Minificateur JS

À propos de l’outil Minificateur JS

L’outil Minificateur JS compresse du JavaScript avec Terser dans votre navigateur. Terser analyse d’abord le code, si bien que le résultat se comporte comme l’original : le code écrit sans points-virgules, un return suivi d’un retour à la ligne, les expressions régulières et les expressions comme a - -b sont bien traités. Par défaut, les noms locaux aux fonctions sont raccourcis, les noms globaux et les propriétés des objets sont gardés, le code inatteignable comme un bloc if (false) est retiré et tous les commentaires disparaissent. Les réglages permettent de garder les commentaires de licence ou tous les commentaires, de retirer les appels console, de raccourcir aussi les noms de premier niveau, de garder les noms des fonctions et des classes, de lire le code comme un module ES, de laisser Terser écrire une syntaxe plus récente et d’ajouter une carte de source. Plusieurs fichiers .js, .mjs ou .cjs peuvent être minifiés un par un dans un ZIP ou réunis en un seul fichier, et les tailles avant et après s’affichent en octets et avec gzip. La syntaxe moderne est acceptée, y compris les classes, les fonctions async, le chaînage optionnel et BigInt, tout comme les lignes import et export. Le TypeScript ne l’est pas : convertissez-le d’abord.

Exemple

Aucun point-virgule dans l’entrée ; Terser les ajoute, met tout sur une ligne et renomme les variables locales.

function total(prices) {
  let sum = 0
  for (const price of prices) sum += price
  return sum
}
console.log(total([1, 2]))

function total(o){let t=0;for(const l of o)t+=l;return t}console.log(total([1,2]));

Comment minifier du JavaScript

1. 1Collez votre script dans « Entrée », ou cliquez sur « Ouvrir des fichiers » pour charger un ou plusieurs fichiers .js, .mjs ou .cjs.
2. 2Modifiez les « Réglages » si besoin : « Commentaires », « Retirer les appels console.* », « Raccourcir les noms locaux », « Type de code », « Carte de source (fichier .map) » ; avec plusieurs fichiers, choisissez « Minifier chaque fichier (ZIP) » ou « Réunir en un seul fichier ».
3. 3Cliquez sur « Minifier ».
4. 4Lisez la « Sortie minifiée », les caractères économisés et les tailles avant et après ; si le code ne peut pas être analysé, l’erreur donne sa ligne et sa colonne, et le nom du fichier quand il y en a plusieurs.
5. 5Cliquez sur « Copier », ou sur « Télécharger » pour enregistrer « minified.js » (ou le nom du fichier ouvert avec .min.js), sa carte de source, ou le ZIP des fichiers minifiés.

Formats et limites

Entrée

Scripts JavaScript ou modules ES, collés ou ouverts depuis des fichiers .js, .mjs ou .cjs, jusqu’à 100 à la fois

Sortie

JavaScript minifié, enregistré sous minified.js, ou sous nom.min.js pour un fichier ouvert ; un fichier .map quand « Carte de source (fichier .map) » est cochée ; un ZIP pour plusieurs fichiers minifiés un par un

Réglages

Par défaut : compression et raccourcissement des noms activés, commentaires retirés, noms de premier niveau gardés, instructions debugger retirées, script, syntaxe de sortie ES5 ; chacun de ces choix peut être modifié

Erreurs

Le message de Terser, avec sa ligne et sa colonne, et le nom du fichier quand plusieurs fichiers sont ouverts

Taille avec gzip

Estimée avec gzip au niveau 6, celui de la plupart des serveurs web par défaut ; la taille servie par le vôtre dépend de ses réglages

Où votre script est traité

Terser est téléchargé une seule fois, à votre premier clic sur « Minifier », puis fonctionne sur votre appareil : le script et les fichiers que vous ouvrez sont lus par votre navigateur et ne sont pas envoyés. Une minification qui échoue fait exception : le message d’erreur affiché, épuré des passages entre guillemets, des nombres longs et des adresses, est envoyé à notre journal des erreurs avec le nom de l’outil ainsi que le nom et la version de votre navigateur ; une panne inattendue de la page est signalée de la même façon.

Questions fréquentes

Outils associés

• Formateur JavaScript
• Minificateur de code
• Formateur CSS
• Formateur JSON