Minificateur et Formateur JavaScript

En quoi consiste cet outil ?

Un minificateur JavaScript réécrit le code pour qu'il soit aussi petit que possible tout en se comportant à l'identique : il raccourcit les noms de variables et fonctions quand c'est sûr, supprime commentaires et espaces, replie les constantes et élimine le code inaccessible.

Cet outil repose sur Terser, le minificateur basé sur l'AST utilisé par webpack, Vite, Rollup et la plupart des outils de build JavaScript modernes. Comme il analyse réellement votre code plutôt que de faire du filtrage par motif, il distingue correctement un opérateur de division d'une expression régulière, ne casse pas les template strings contenant des séquences ressemblant à //, et ne renomme pas une variable avec un nom entrant en collision avec quelque chose dans une portée englobante.

Pourquoi l'utiliser ?

• Minification basée sur l'AST (Terser), le même moteur utilisé par les principaux bundlers — fiable avec les expressions régulières, template strings et closures.
• Raccourcit les noms de variables pour un vrai gain de taille, pas juste la suppression des espaces.
• Affiche exactement combien d'octets et quel pourcentage vous avez économisés.
• Le mode Formater reconvertit du JS minifié et obscurci sur une seule ligne en code lisible et indenté — utile pour comprendre des scripts tiers.
• Traitement 100% local — le code propriétaire ne quitte jamais votre navigateur.

Mode d'emploi

1. Collez votre JavaScript dans le champ de saisie, ou cliquez sur "Charger un exemple" pour tester un échantillon avec une expression régulière et un template string.
2. Cliquez sur "Minifier" pour le compresser, ou sur "Formater" pour l'embellir avec une indentation de 2 espaces.
3. Vérifiez le message sous les champs — le mode minifier affiche la réduction de taille ; une erreur de syntaxe dans votre code affiche un message clair au lieu de produire silencieusement un résultat cassé.
4. Cliquez sur "Copier" pour récupérer le résultat.

Exemple

Entrée

function greet(name) {
  const pattern = /^[a-z]+$/i;
  const msg = `Hello, ${name}!`;
  if (pattern.test(name)) {
    // simple check
    return msg;
  }
  return "Hi there";
}

Résultat

function greet(n){const e=/^[a-z]+$/i,g=`Hello, ${n}!`;return e.test(n)?g:"Hi there"}

Les noms de variables sont raccourcis, le commentaire et le if sont réduits à une expression, mais l'expression régulière et le template string sont préservés exactement et le comportement reste inchangé.

Conseils pratiques

• Minifiez au moment du build, pas en modifiant à la main — gardez la source lisible dans le contrôle de version et générez le bundle minifié comme une étape de build.
• Si le résultat minifié se comporte de façon inattendue, vérifiez s'il y a du code dépendant de Function.prototype.name ou de réflexion — le raccourcissement des noms renomme les fonctions, ce qui peut apparaître dans de rares cas limites.
• Formater un script tiers avant de le lire est bien plus rapide que d'essayer d'analyser une seule ligne de 2000 caractères.
• Combinez avec les minificateurs HTML et CSS ci-dessous si vous préparez un bundle statique complet pour le déploiement.

Sa place dans de vrais flux de travail

Le JavaScript est généralement la plus grande ressource bloquant le rendu ou l'analyse sur une page, donc le minifier a un effet réel et mesurable sur le temps de chargement — plus que le HTML ou le CSS octet pour octet. La plupart des frameworks modernes le font automatiquement au moment du build, mais les scripts écrits à la main, extensions de navigateur et bookmarklets sont souvent publiés non minifiés à moins que quelqu'un ne les passe dans un outil comme celui-ci.

Le mode Formater est couramment utilisé dans l'autre sens : déboguer une erreur de production à partir d'une stack trace minifiée est bien plus facile une fois le code environnant reformaté et lisible, même sans les noms de variables d'origine.

→ Minificateur HTML · Minificateur CSS

Cas d'usage courants

• Réduire un script autonome ou un bookmarklet avant de le publier.
• Reformater un script minifié récupéré sur un site en ligne pour comprendre ce qu'il fait.
• Nettoyer du JavaScript collé depuis un forum ou un extrait généré par IA avant de le lire attentivement.
• Vérifier rapidement si un extrait JS écrit à la main contient une erreur de syntaxe, une erreur d'analyse apparaissant clairement.

Foire aux questions