Aller au contenu principal
sports_esports Lab Canvas 2D Fractale Plan complexe Rendu progressif

Explorateur de Mandelbrot — la fractale de z ← z² + c en Canvas 2D

Un explorateur de l'ensemble de Mandelbrot en Canvas 2D : je rends la fractale par temps d'échappement de l'itération z ← z² + c dans le plan complexe, avec colorisation continue et un rendu progressif qui reste réactif pendant le zoom. Zéro dépendance.

Clic ou molette : zoomer vers un point Clic droit : dézoomer Glisser : déplacer la vue R : réinitialiser

Une image née d'une seule équation

L'ensemble de Mandelbrot est une fractale : une figure d'une richesse infinie produite par une règle dérisoire. Je pars d'un point c du plan complexe, puis j'itère la suite z ← z² + c à partir de z = 0. Si la suite reste bornée, le point appartient à l'ensemble ; si elle part vers l'infini, il en est exclu. Toute l'infinie complexité de la frontière — bulbes, cardioïde, vrilles, mini-copies — sort de cette seule ligne d'arithmétique, répétée des millions de fois.

Le critère d'échappement

Comment savoir si la suite « part à l'infini » sans l'itérer indéfiniment ? On démontre que dès que le module de z dépasse 2 (soit |z| > 2), la divergence est acquise : le point s'échappera à coup sûr. Je compte alors le nombre d'itérations nécessaires pour franchir ce seuil — le temps d'échappement. Loin de la frontière, deux ou trois tours suffisent ; tout près, il en faut des dizaines voire des centaines. Ce compteur, converti en couleur, est ce qui donne à la fractale son halo dégradé.

Une colorisation continue

Un temps d'échappement est un entier, et colorier par paliers entiers produit des bandes disgracieuses. J'utilise donc la colorisation continue (normalized iteration count, ou potentiel) : à l'itération qui franchit le seuil, je corrige le compteur d'une fraction calculée à partir du module atteint. Le résultat est une valeur réelle, lisse, sans marche d'escalier — que je projette sur un dégradé de marque, du bleu nuit du large vers l'ambre qui souligne la frontière, l'intérieur de l'ensemble restant d'un bleu profond.

Profondeur d'itération contre performance

Calculer l'image, c'est itérer la suite pour chaque pixel — des centaines de milliers de fois par rendu. Deux réglages s'opposent : plus le plafond d'itérations est haut, plus la frontière se détaille finement, mais plus le calcul est lourd ; plus on zoome, plus il faut d'itérations pour distinguer ce qui appartient à l'ensemble de ce qui s'en échappe lentement. Tout l'enjeu est de tenir ce compromis sans jamais figer l'onglet.

Un rendu progressif qui ne bloque jamais

Ma réponse est un rendu progressif. J'affiche d'abord une version grossière, par gros blocs, calculée en une fraction de seconde, puis je l'affine par passes successives de résolution croissante, étalées sur plusieurs images avec un budget de temps borné par image. Pendant que vous zoomez ou déplacez la vue, le rendu reste volontairement grossier pour rester réactif, puis il se raffine dès que vous relâchez. Le fil principal du navigateur n'est jamais monopolisé : l'interface répond en permanence.

Le même réflexe sur vos écrans de production

Afficher instantanément une approximation utile, puis converger vers le résultat exact sans bloquer l'interface : c'est exactement la démarche que j'applique aux écrans lourds de vos applications — tableaux volumineux, cartes, rapports calculés. Un utilisateur qui voit une réponse tout de suite, puis la voit s'affiner, perçoit un produit rapide et maîtrisé. C'est ce ressenti de fluidité, autant que la justesse du calcul, qui fait la qualité perçue d'un logiciel.

Photo d'Emmanuel BALLERY, fondateur de x10

À propos de l'auteur

Emmanuel BALLERY est le fondateur de x10 solutions. Ces petits jeux sont surtout un plaisir de développeur, codés le week-end — pas une vitrine de mes missions, qui sont bien plus exigeantes. J'y soigne quand même la performance et la lisibilité, par habitude.

Voir plus arrow_forward
rocket_launch

Un vrai projet en tête ?

Ce petit jeu m'amuse, mais il ne dit pas grand-chose de mon métier : mes missions sont bien plus complexes. Si vous avez une application à concevoir ou à fiabiliser, c'est là que je suis vraiment utile.

Discuter de mon projet arrow_forward