Aperçu / Développement et code / Minifieur de code
Développement et code 100 % dans le navigateur et hors ligne

Minifieur de code

Minifiez du JavaScript avec Terser et du CSS avec csso dans votre navigateur, avec le gain en octets et en gzip.

Collez ou saisissez votre entrée ; le résultat s’affiche aussitôt et les erreurs apparaissent dessous.

Vos fichiers et données ne quittent jamais votre navigateur : rien n’est envoyé.

Options

Les noms de premier niveau restent intacts tant que vous n'activez pas leur raccourcissement. Cette option peut casser des scripts qui s'appellent d'un fichier à l'autre ou qui utilisent des variables globales du HTML. Les commentaires de licence commencent par /*! ou contiennent @license ou @preserve. La cible fixe la syntaxe la plus récente que Terser peut écrire. Supprimer console et debugger demande « Compresser le code ».

Limites : 2 000 000 de caractères. Les tailles sont en octets UTF-8. La ligne gzip n'apparaît que si votre navigateur dispose de CompressionStream. Le HTML n'est pas minifié. La minification modifie le code : testez le résultat avant de le publier. Votre code est traité dans cette page et n'est envoyé nulle part.

Minifier du JavaScript et du CSS sans outil de build

Un snippet de suivi à coller dans un CMS, une feuille de style de 90 Ko héritée d'un ancien thème : monter un bundler pour cela serait disproportionné. Collez le code ici, la version minifiée apparaît à côté. Terser traite le JavaScript, csso le CSS.

Les étapes

  1. Choisissez JavaScript ou CSS en haut de l'outil.
  2. Remplacez l'exemple par votre code. Le résultat se met à jour environ 300 ms après la dernière frappe.
  3. Réglez les options voulues.
  4. Cliquez sur Copier ou Télécharger. Le fichier s'appelle script.min.js ou styles.min.css.

Les options JavaScript et leurs effets

Six interrupteurs agissent sur le code : Compresser le code, Raccourcir les noms de variables, Raccourcir les noms de premier niveau, Garder les noms de classes et de fonctions, Supprimer les appels console.* et Supprimer les instructions debugger. Les deux derniers exigent que la compression soit active. Les noms de premier niveau restent intacts par défaut : un autre fichier ou un attribut onclick peut les appeler par leur nom, et le raccourcissement casserait l'appel.

La cible (ES2015, ES2017, ES2020 ou ES2022) fixe la syntaxe la plus récente que Terser peut écrire. Les commentaires se suppriment tous, se gardent seulement s'ils sont de licence (/*!, @license, @preserve) ou se gardent tous.

Le travail de csso sur une feuille de style

csso transforme margin: 0px 0px 0px 0px en margin:0, raccourcit les couleurs et retire les commentaires. Avec Restructurer les règles, il fusionne aussi les règles qui ont les mêmes déclarations. Désactivez cette option si l'ordre exact des règles compte pour votre mise en page. Les propriétés personnalisées et les blocs @media sont conservés.

Limites et traitement de vos données

L'entrée est limitée à 2 000 000 de caractères et les tailles sont des octets UTF-8. La ligne gzip n'apparaît que si le navigateur dispose de CompressionStream. Une erreur de syntaxe JavaScript indique la ligne et la colonne. csso, lui, ne signale aucune erreur CSS : une partie cassée peut disparaître sans message. Le HTML n'est pas minifié.

La minification modifie le code. Pour du code inhabituel, aucune garantie de comportement identique : testez le fichier produit. Terser et csso s'exécutent dans votre navigateur. À la première utilisation, la page télécharge le fichier de la bibliothèque depuis son propre serveur, ce que montre l'onglet réseau. Ensuite, un clic n'envoie rien. Votre code n'est ni transmis ni exécuté.

Foire aux questions (FAQ)

Seulement si rien en dehors du fichier n'utilise ces noms. Les attributs onclick et les scripts tiers qui appellent vos fonctions par leur nom cesseraient de marcher ; l'option est donc désactivée par défaut.