Path Visualizer
Un bac à sable pour voir tourner les algorithmes de parcours et de labyrinthe.
Rôle
Projet personnel
Période
Stack technique
- React
- TypeScript
- Canvas
- Zustand
- Vite
En bref
En 2023, je voulais écrire moi-même les algorithmes de parcours et les voir tourner, plutôt que de les lire en pseudo-code, alors j'en ai fait une petite version en HTML, CSS et JavaScript. J'y suis revenu en 2025 pour la porter sur une stack que je maîtrise, React, et évaluer ce qu'un agent de code pouvait faire d'un projet existant.
Points forts
- Neuf algorithmes de parcours, de DFS et BFS à Dijkstra, A-star, A-star bidirectionnel et Jump Point Search, animés pas à pas à vitesse réglable.
- Quatre générateurs de labyrinthe (backtracker, Prim, automate cellulaire, partitionnement binaire de l'espace), chacun écrit avec une fonction génératrice pour animer la construction pas à pas.
- Rendu sur un canvas 2D piloté à la main, là où la v1 empilait une div par cellule, avec un travail de performance (rendu à la demande, culling) pour rester fluide quand la grille grandit.
- Un mode 3D façon raycaster, inspiré d'une vidéo de javidx9, pour parcourir le labyrinthe en vue première personne, avec minimap et détection de l'arrivée.