Déminifier du JavaScript en ligne
Collez un fichier .js minifié, un bundle webpack ou un extrait sur une seule ligne, et récupérez du JavaScript correctement indenté dans le panneau de droite. Le formatage est assuré par Prettier, dans votre navigateur, sans rien envoyer nulle part.
Pourquoi le JavaScript devient illisible
Toutes les chaînes de build modernes minifient le JavaScript avant de le livrer. Terser, esbuild, SWC et leurs équivalents retirent les espaces et les commentaires, renomment les variables et fonctions locales en une seule lettre, écrasent les blocs imbriqués en expressions chaînées, et fusionnent l'application entière en un ou deux fichiers. Une application React partie de trois cents fichiers sources lisibles arrive dans le navigateur sous la forme d'une seule ligne de quelques centaines de kilooctets. Le code fonctionne parfaitement, mais dès qu'il faut le lire, le fichier n'est plus qu'un mur de texte sans structure à laquelle se raccrocher.
Ce que le formatage vous rend vraiment
Embellir un bundle rétablit ce qui rend un code navigable. Les instructions retrouvent chacune leur ligne, si bien qu'une stack trace pointant vers la ligne 1 colonne 24815 devient un emplacement réel auquel vous pouvez aller. L'imbrication redevient visible, vous voyez donc où commence et où finit une fonction, quelle branche protège une condition, et comment s'enchaîne une suite de callbacks. Les chaînes, les URL et les noms de points de terminaison deviennent faciles à parcourir, ce qui est en général exactement ce que vous cherchez quand vous auditez un script plutôt que vous ne déboguez le vôtre.
La syntaxe moderne est gérée
Le formateur analyse le JavaScript actuel, pas un sous-ensemble vieux de dix ans. Fonctions fléchées, classes, async et await, générateurs, chaînage optionnel, coalescence des nuls, littéraux de gabarit, décomposition, syntaxe de propagation, imports dynamiques et modules ES sont tous formatés correctement. Le JSX est également pris en charge, ce qui compte quand vous regardez un composant React compilé sans avoir été transformé. Et comme c'est Prettier qui travaille, le résultat suit les mêmes conventions que celles que votre éditeur applique déjà à vos propres fichiers.
Où sont les limites
Déminifier n'est pas faire de la rétro-ingénierie. Le minifieur a supprimé vos commentaires et renommé vos variables, et aucun formateur ne peut deviner que la variable désormais appelée n s'appelait avant remainingRetries. Si le projet a publié un source map, chargez-le plutôt dans les outils de développement de votre navigateur, c'est la seule route vers le véritable original. Et si le fichier a été délibérément obfusqué plutôt que simplement minifié, attendez-vous à une structure lisible, mais pas à une intention lisible.
Questions fréquentes
Est-ce que ça déminifie un bundle webpack ou Vite ?
Oui. Collez le bundle ou chargez-le par URL, il sera formaté comme n'importe quel autre fichier JavaScript. Les gros bundles prennent quelques secondes puisque le travail se fait sur votre machine, et la structure des modules redevient visible une fois le code indenté.
Est-ce que ça désobfusque le JavaScript ?
Cela formate du code obfusqué, ce qui le rend nettement plus facile à lire, mais cela n'annule pas l'obfuscation elle-même. Les chaînes encodées, le flux de contrôle artificiel et le code mort ajouté volontairement restent exactement là où ils étaient.
Est-ce que ça peut casser mon code ?
Non. Le formatage ne change que les espaces et les retours à la ligne, jamais le programme. Le résultat est fonctionnellement identique à l'entrée, vous pouvez donc l'exécuter, le comparer à une autre version, ou le coller directement dans votre éditeur.