Les décos dans les blogs, c'est joli, mais on peut rapidement avoir des articles très très lourds, voire même dépasser les capacités des traitement du bbcode de nos serveurs, comme c'est arrivé à
etrangeegnarte (c.f. les commentaires de l'avant dernier article). La solution ? comprendre un peu ce qui se passe et optimiser le bbcode.
Le principe des décos, c'est de faire une image pixelisée, où chaque caractère représente un "pixel". Bon, admettons que vous vouliez faire un triangle bleu (au début je voulais faire une étoile, mais c'est trop chiant ;))
On veut :
7
777
77777
7777777
777777777
On peut faire ça comme ça :
[ align=center ][ c=#ffff80 ]7[ /c ]
[ c=#ffff80 ]7[ /c ][ c=#00ccff ]7[ /c ][ c=#0088ff ]7[ /c ]
[ c=#ffff80 ]7[ /c ][ c=#00ccff ]777[ /c ][ c=#0088ff ]7[ /c ]
[ c=#ffff80 ]7[ /c ][ c=#00ccff ]77777[ /c ][ c=#0088ff ]7[ /c ]
[ c=#ffff80 ]7[ /c ][ c=#0088ff ]77777777[ /c ][ /align ]
ou comme ça :
[ align=center ][ f=#ffffff ][ c=#ffff80 ]7[ /c ][ /f ]
[ f=#ffffff ][ c=#ffff80 ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ]
[ f=#ffffff ][ c=#ffff80 ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ]
[ f=#ffffff ][ c=#ffff80 ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ]
[ f=#ffffff ][ c=#ffff80 ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ /align ]
Si si, les deux bouts de bbcode ci-dessus font la même chose.. Et y'a même moyen de faire pire pour le même résultat visuel !
777~*~ Le jeu des différences ~*~
=> Dans le premier code, on met
[ c=#... ]...[ /c ] uniquement lorsqu'on change de couleur ou de ligne, et il n'y a pas de couleur de fond
[ f=#... ]...[ /f ] parce que, dans cet exemple, on veut toujours un fond blanc et que le fond est déjà blanc.
=> Dans le deuxième code, on met
[ c=#... ]...[ /c ] pour chaque caractère, même
lorsque plusieurs caractères de la même couleur se suivent sur la même ligne. En plus, on ajoute un
[ f=#ffffff ]...[ /f ] à chaque fois, pour définir un fond blanc, ce qui est inutile dans notre cas.
Les différences entre le premier et le deuxième code en orange :
[ align=center ][ f=#ffffff ][ c=#ffff80 ]7[ /c ][ /f ]
[ f=#ffffff ][ c=#ffff80 ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ]
[ f=#ffffff ][ c=#ffff80 ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ]
[ f=#ffffff ][ c=#ffff80 ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#00ccff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ]
[ f=#ffffff ][ c=#ffff80 ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ f=#ffffff ][ c=#0088ff ]7[ /c ][ /f ][ /align ]
~*~*~*~
777Si vous comprenez cet exemple, vous serez capable de réduire le poids de vos articles, ce qui peut être utile lorsque vous utilisez des générateurs de déco dont le code généré est un peu trop lourd.