Les dernières fonctionnalités de skott : la route vers la v1

Dans la continuité de l’aventure de construction de skott, voici un point rapide sur les dernières fonctionnalités ajoutées, et ce qu’il a fallu pour les construire.

Résumé

• Application web (v0.11.0)
• Comparaison incrémentale (v0.12.0)
• Détection des dépendances tierces inutilisées (v0.13.0)

Application web (introduite en v0.11.0)

Pour ses premières versions, la visualisation de skott ne s’affichait que dans notre bien-aimée interface en ligne de commande, sympa, mais loin d’être idéal pour des structures de graphe réelles.

Depuis la v0.11.0, skott embarque le nouveau mode d’affichage webapp, qui est désormais celui par défaut :

$ skott --displayMode=webapp

Si vous voulez que les dépendances tierces (npm) et les dépendances natives (Node.js) soient affichées dans l’application, n’oubliez pas de passer les flags à la CLI, sinon elles ne seront ni collectées ni affichées :

$ skott --displayMode=webapp --trackThirdPartyDependencies --trackBuiltinDependencies

Une fois le graphe généré, l’application web s’ouvre automatiquement dans votre navigateur par défaut sur un port libre :

L’application affiche un réseau 2D dans lequel les fichiers sont les nœuds et les liens entre eux des arêtes orientées. Dans la barre latérale de gauche, on trouve plusieurs éléments :

• quelques statistiques (nombre de fichiers, dépendances circulaires, etc.),
• des options de visualisation pour activer/désactiver des nœuds et arêtes supplémentaires représentant les dépendances tierces ou natives.

Pour faciliter la recherche d’un fichier précis sur les grands graphes, une recherche globale a récemment été introduite. Avec CMD+K / CTRL+K, on peut rechercher des fichiers et zoomer dessus :

Merci à @bam-charlesbo d’avoir suggéré des fonctionnalités pour la webapp.

Traitement incrémental du graphe (introduit en v0.12.0)

Calculer le graphe coûte cher : cela lance une analyse statique sur chaque fichier du projet, impliquant principalement du parsing et du parcours d’AST. Selon le langage, certains parseurs sont plus rapides que d’autres : les parseurs JavaScript sont naturellement plus rapides que ceux de TypeScript, puisque TypeScript encode beaucoup plus d’informations au niveau des types.

Place à la comparaison incrémentale

Même si skott peut analyser des milliers de fichiers en quelques secondes, la performance compte toujours pour une meilleure DX. Voici donc une première étape.

Par le passé, j’ai reproduit une implémentation minimaliste du pattern Affected/Incremental que la plupart des outils de monorepo embarquent nativement pour gagner énormément en performance sur les gros graphes de projet.

Comme les graphes de projet ne changent généralement pas en totalité (pensez à quelques fichiers par commit), une comparaison incrémentale nous permet de profiter pleinement du cache.

À partir de la v0.12.0, une première version peut être activée avec l’argument --incremental. Un dossier .skott est généré à l’endroit où la commande est lancée :

$ skott --incremental

En relançant la même commande, vous devriez voir la différence par rapport à une analyse sans cache (la différence peut être faible si le projet ne contient pas beaucoup de fichiers).

Comme la résolution des chemins depuis un cache implique de nombreux cas limites, le mode incremental n’est pas encore activé par défaut, mais il le sera une fois qu’il couvrira les cas que j’ai en tête. La plupart du temps il fonctionne déjà bien, alors n’hésitez pas à l’utiliser et à ouvrir des issues si vous rencontrez des problèmes.

Dépendances inutilisées (introduites en v0.13.0)

La fonctionnalité de détection des dépendances inutilisées cherchera à couvrir le plus de cas d’usage possibles au fil du temps. Pour l’instant, v0.13.0 introduit la détection des dépendances npm de production inutilisées. Seul le code de production est analysé pour le moment, donc si vous utilisez des dépendances de production dans des fichiers de test, skott les signalera comme inutilisées.

$ skott --showUnusedDependencies --trackThirdPartyDependencies --displayMode=raw

--trackThirdPartyDependencies est nécessaire pour que les dépendances npm inutilisées puissent être trouvées.

Merci à @ild0tt0re pour la demande de fonctionnalité.

Conclusion

C’est tout pour les dernières mises à jour. Comme promis, le prochain chapitre explique comment j’ai tiré parti du Test-Driven Development et de l’injection de dépendances pour développer en toute confiance toute la chaîne d’exploration, de parsing et d’analyse des fichiers.

skott est open source, n’hésitez pas à l’explorer sur GitHub.