S'il y a bien un module du navigateur qui fait horreur aux développeurs de jeux vidéos en ligne, c'est bien le DOM jugé lent voire même très lent au regard des exigences de rafraîchissement dont la cible idéale est actuellement de 60 FPS, correspondant à la fréquence de rafraîchissement de la plupart des écrans.
Jusqu'à présent, les animations se réalisent en général au sein d'un environnement bitmap (canvas) où le développeur perd la principale force du DOM, à savoir sa capacité à identifier, sélectionner et manipuler les éléments de la vue.
Cela pourrait peut-être changer avec un Web Component du nom de HTML GL dont le principe est de créer une couche applicative entre le DOM et le rendu WebGL permettant ainsi l'accélération graphique matérielle et l'utilisation de toute la panoplie des effets graphiques (shaders compris bien entendu). Ceci tout en permettant aux objets graphiques affichés d'être accessibles individuellement par des requêtes classiques sur le DOM (par exemple via getElementById() ou le framework jQuery)
L'utilisation de ce composant dans une page HTML est très simple, comme le montre l'exemple ci-dessous :
Code : | Sélectionner tout |
1 2 3 4 5 | <html-gl> This element`s content is rendered in <h1>WebGL</h1> <span style="color: green;">was it easy?</span> Feel free to use CSS, images and all you are common to in HTML/CSS world. </html-gl> |
Code : | Sélectionner tout |
$('.some div').htmlgl();
source : Dépôt GitHub
Et vous ?
Cette solution est-elle un progrès ?
Pensez-vous l'essayer prochainement ?