JavaScript Embellisseur & Minificateur

Formatez du JavaScript désordonné avec une indentation et des styles d'accolade personnalisés, ou réduisez-le pour diminuer la taille du fichier. ES6+ pris en charge. S'exécute entièrement dans votre navigateur : votre code ne quitte jamais votre appareil.

Embellir · Réduire · ES6+ · côté client
Entrée 0 car. · 0 lignes
Sortie 0 car. · 0 lignes

Comment embellir et minifier JavaScript

Comment utiliser cet outil

Collez votre JavaScript dans le panneau de saisie, sélectionnez Embellir ou Réduire à partir des onglets de mode, et le résultat apparaît instantanément. Ajustez les options telles que la taille de l'indentation, le style d'accolade et la gestion des nouvelles lignes avant le traitement. Cliquez sur Copier la sortie pour copier dans le presse-papiers ou sur Télécharger .js pour enregistrer le fichier.

Options d'embellissement expliquées

  • Style d'accoladeCollapse garde { sur la même ligne (K&R / standard JS). Expand met { sur sa propre ligne (style Allman). End-expand est un hybride où else et catch obtiennent de nouvelles lignes.
  • Conserver les nouvelles lignes — conserve les lignes vides de l'original là où elles existent. Utile pour le code qui utilise l'espacement comme regroupement logique.
  • JSLint-happy — correspond au style imposé par le JSLint de Douglas Crockford. Les expressions de fonction obtiennent un espace avant (, entre autres ajustements.
  • Désescaper les chaînes — reconvertit les échappements \xNN et \uNNNN en leurs caractères littéraux lorsque c'est sans risque.

Explication des options de réduction

  • Garder /*! license */ — conserve les commentaires commençant par /*!, la convention utilisée par la plupart des bibliothèques pour marquer les en-têtes de copyright MIT/Apache qui doivent rester dans le code distribué.
  • Supprimer le dernier point-virgule — supprime le ; final avant }. Économise un octet mais rend les diffs plus bruyants, donc c'est désactivé par défaut.

Le minificateur est intentionnellement conservateur : il supprime uniquement les espaces et les commentaires. Il ne renomme pas les variables, ne modifie pas les propriétés et n'effectue pas d'élimination de code mort au niveau AST. Pour une optimisation plus agressive, utilisez terser ou esbuild dans votre pipeline de build.

Propulsé par js-beautify

L'embellisseur est alimenté par js-beautify, la même bibliothèque utilisée par VS Code, Sublime Text, Atom et les formateurs en ligne les plus populaires. Tout s'exécute localement dans votre navigateur : pas d'étape de téléchargement, pas d'aller-retour sur le serveur et aucune limite de débit. Collez un bundle minifié de 500 Ko et il se formate en millisecondes.

FAQ

Mon code JavaScript est-il envoyé à un serveur ?

Non. Tout l'embellissement et la minification se font entièrement dans votre navigateur, grâce à js-beautify chargé depuis un CDN. Votre code ne quitte jamais votre appareil.

Quelle est la différence entre embellir et minifier ?

Embellir formate le code avec une indentation et des sauts de ligne appropriés pour une meilleure lisibilité humaine. Minifier supprime les espaces, les commentaires et les caractères superflus afin de réduire la taille du fichier pour la mise en production.

Le minificateur renomme-t-il les variables ?

Non. Cet outil effectue uniquement la suppression des espaces et des commentaires. Il ne renomme pas les variables, ne modifie pas les identifiants et n'effectue pas d'optimisations au niveau AST. Pour ce niveau de compression, utilisez Terser, UglifyJS ou esbuild dans un pipeline de build.

Peut-il gérer la syntaxe ES6+ ?

Oui. L'embellisseur prend en charge le JavaScript moderne, notamment les fonctions fléchées, les littéraux de gabarit, l'async/await, les classes, la déstructuration, le spread/rest, le chaînage optionnel et la coalescence nulle.

Quelles options de style d’accolade sont disponibles ?

Trois styles : Collapse (accolade ouvrante sur la même ligne que l’instruction), Expand (accolade ouvrante sur une nouvelle ligne), et End-Expand (ouverture sur la même ligne, mais else et catch commencent sur de nouvelles lignes).

Outils associés