Code informatique

Souris = souffle · B = burst · F = filaire · WebGL2, fond noir, sans dépendances

Particles WebGL2 — cours en 10 étapes Objectif : partir d’un simple <canvas> noir pour arriver à un système de particules animé (fumée, champ de flux, souffle souris) en WebGL2 natif , sans dépendance. Adapté à des élèves avancés (collège/lycée) et suffisamment propre pour que des développeurs viennent y piocher des morceaux en douce 😉 1) Structure HTML minimale Niveau 1 On commence par une page fond noir avec un <canvas> plein écran. C’est notre “toile” où le GPU dessinera les particules. html, body sans marges, hauteur 100% canvas fixé sur tout l’écran Copier le code <style> html,body{margin:0;height:100%;background:#000;overflow:hidden} canvas{position:fixed;inset:0;width:100%;height:100%;display:block} </style> <canvas id="gl"></canvas> 2) Canvas + DPR (haute résolution) Niveau 2 Pour évi...