J'ai rejoint il y a peu un JDR en ligne appelé Kigard.
Ce dernier a un thème graphique rétro pixelisé.
Un peu par challenge et pour proposer au staff du jeu un moyen de migrer les images en SVG, j'ai codé une lib qui permet de convertir des images GIF animées ou non en SVG.
L'avantage du SVG est sa nature vectorielle qui aura un rendu pixelisé propre quelque soit la nature du client web (PC, mobile, ...).
| Name | GIF | SVG |
|---|---|---|
| Fire |  |
 |
| Tree |  |
 |
Le challenge consistait dans l'optimisation des paths SVG pour simplifier et réduire la taille du fichier produit. Une conversion naïve de chaque pixel en un path unique produisait un fichier assez conséquent. Fusionner les paths et optimiser les nodes a permis en gros de réduire la taille des SVG de 80%.
Pour une image statique, il n'y a plus vraiment de stratégie d'optimisation à part :
- détecter les paths au fond opaque inclus dans d'autres pour enlever les portions de paths représentants les trous, cela enlèverait aussi les liserés de rendu blancs aux jointures que l'on voit en zoomant beaucoup
Dans le cas d'image animée, on pourrait tenter d'aller plus loin avec ces idées :
- changer que la couleur des paths identiques entre plusieurs frames pour les éviter en doublon.
- détecter les zones de pixels statiques pour découper les zones de même couleur en plusieurs
Cependant, à ce stade, vu la petite taille des images (et donc le nombre de nodes possibles), les gains seraient probablement marginaux et situationels.
Détails
Pour plus de détails techniques, allez voir le README sur Gitlab.