Embellissez du JavaScript, ou minifiez-le et voyez combien d'octets disparaissent
Fonctionne dans votre navigateur. Rien de ce que vous saisissez n'est envoyé nulle part.Formater du JavaScript l'indente et place les instructions là où on peut les lire ; le minifier retire noms et espaces pour la production. Les octets retirés sont affichés, si bien que le gain sur un bundle de 50 KB se voit avant la mise en ligne. Votre code est analysé dans le navigateur et jamais envoyé.
Cette page a été traduite automatiquement à partir de l'original anglais. Aucune personne n’a encore relu la traduction : c’est la version anglaise qui fait foi. Lire l'original en anglais
Collez du JavaScript ou du JSX dans la zone, ou appuyez sur Essayer un exemple ; TypeScript n'est pas pris en charge.
Gardez Embellir pour le reformater avec Prettier, ou choisissez Minifier pour le réduire avec terser.
Réglez Indentation, Couper à, Points-virgules et Guillemets simples pour Embellir, ou les options affichées pour Minifier.
Appuyez sur Copier ou Télécharger pour récupérer le résultat.
Ce formateur JavaScript fait les deux choses qu'on attend d'un fichier de script. Embellir le passe dans Prettier et rend le même code mis en forme à votre façon : deux espaces, quatre espaces ou une tabulation, avec ou sans points-virgules, guillemets simples ou doubles, et la largeur de ligne de votre choix. Minifier le passe dans terser et rend le plus petit fichier équivalent, avec la taille avant, la taille après et le pourcentage gagné.
Il convient aux petites tâches qui interrompent une journée. Un extrait copié d'une réponse en ligne suit un style que votre projet n'utilise pas. Un fichier hérité contient trois instructions par ligne. Vous voulez voir à peu près la taille qu'aura une fonction utilitaire une fois livrée, avant de décider de l'écrire vous-même. Et parfois il faut l'inverse : un bundle minifié suffisamment déplié pour comprendre ce que fait un script tiers.
Minifier a deux interrupteurs. Renommer les variables locales en lettres uniques apporte l'essentiel du gain et ne change rien d'observable de l'extérieur. Garder les noms de fonctions coûte quelques octets mais laisse lisibles les traces de pile et tout ce qui lit le nom d'une fonction, ce qui compte si vous envoyez les erreurs à un service de supervision.
L'outil lit du JavaScript simple et du JSX. TypeScript n'est pas pris en charge : si vous en collez, l'erreur d'analyse ne servirait à rien, donc la page vérifie d'abord et vous dit quelle construction TypeScript elle a trouvée, comme un alias de type ou un paramètre typé. Tout s'exécute dans votre navigateur, donc le code non publié et tout ce qui contient une clé ne quittent jamais votre appareil.
Oui. Sans inscription, sans limite de taille et sans plafond sur le nombre de fichiers traités. La page est financée par quelques publicités affichées en dehors de l'outil, et rien n'est inséré dans votre code.
Non. Prettier comme terser s'exécutent dans votre navigateur. Le code non publié, les endpoints internes ou une clé d'API placée dans un objet de configuration ne quittent jamais votre appareil, et rien n'est conservé une fois l'onglet fermé.
Non. Il lit du JavaScript simple et du JSX. Si vous collez du TypeScript, la page indique la construction trouvée, comme un alias de type ou un paramètre typé, au lieu d'afficher une erreur d'analyse qui n'explique rien. Retirez d'abord les types, ou utilisez un éditeur qui comprend TypeScript.
Un code source lisible avec des commentaires perd généralement 40 à 60 pour cent, et bien plus s'il a de longs noms de variables et des lignes vides. Un code déjà minifié change à peine. Le nombre exact d'octets est affiché pour que vous puissiez comparer.
Le mangling renomme les variables locales et les arguments de fonctions en lettres uniques. Rien en dehors du fichier ne voit ces noms, donc le comportement ne change pas, et c'est généralement le plus gros gain à lui seul. Les noms exportés et les propriétés d'objets ne sont pas touchés.
Vous retrouvez la mise en page, pas les noms. Embellir ajoute retours à la ligne, indentation et espacement pour rendre le code lisible, mais un minificateur supprime les noms de variables et les commentaires d'origine, et aucun outil ne peut les retrouver.
Toujours bloqué ? Poser une question sur Formateur et minificateur JavaScript et toute personne qui connaît la réponse peut répondre. Aucun compte nécessaire.