Twintig jaar lang was canvas in de browser een eiland: krachtig, maar blind voor de rest van de DOM. HTML-elementen in een canvas-scene renderen betekende bijna altijd handmatig een snapshot maken via bibliotheken als html2canvas — inclusief bugs, onbetrouwbare lettertypen en alles wat stilletjes stuk gaat in een tweede tab. Google I/O 2026 introduceert een origin trial die dat fundamenteel verandert: de HTML-in-Canvas API.
Hoe het werkt
De API heeft drie primitieven. Een layoutsubtree-attribuut laat de browser kindelementen van een canvas normaal opmaken — dezelfde flow, dezelfde cascade. De methoden texElementImage2D() en copyElementImageToTexture() sturen die opmaak als textuur naar respectievelijk WebGL en WebGPU, waarbij de rendering volledig door de GPU verloopt. Een paint-event signaleert wanneer kinderen veranderen, zodat je alleen opnieuw uploadt wanneer dat nodig is. Cruciaal: de DOM-elementen blijven gewoon in de DOM — met alle bijbehorende voordelen: toegankelijkheid, find-in-page, vertalingen, donkere modus en zelfs autofill.
Groter dan het klinkt
Design-tools, code-editors en visualisatieplatforms bouwen al jaren creatieve oplossingen om dit gemis heen. Elk schildert HTML na in een canvas, rendert in een verborgen iframe, of vertrouwt op screenshots. Dat zijn workarounds voor een fundamenteel ontbrekende primitieve. De HTML-in-Canvas API lost het op aan de platformkant, zodat er minder library-magie nodig is. Er is ook een agentic web-voordeel: omdat de tekst in de DOM blijft, kunnen AI-agenten en webcrawlers canvas-applicaties voor het eerst gewoon lezen.
Onze kijk
De origin trial draait in Chrome 148 tot en met 151 — en geen andere browserengine heeft zich tot nu toe gecommitteerd aan een implementatie. Je kunt het nu experimenteel testen, maar er nog niet op bouwen voor productie-apps met een breed publiek. Desondanks: dit is de richting die creatieve web-applicaties al jaren nodig hadden. Wie design-tools, 3D-omgevingen of rijke visualisaties bouwt, doet er goed aan de specificatie nu te volgen.
