Minification

En informatique, la minification est le processus qui consiste à supprimer les éléments inutiles et à réécrire le code afin de réduire la taille des fichiers. Elle est généralement appliquée aux ressources des pages web, comme les fichiers HTML, CSS et JavaScript. La réduction de la taille des ressources web permet de transférer les fichiers plus rapidement et d'accélérer le chargement des pages web.

Il existe plusieurs façons de minifier des données. La plus simple consiste à supprimer les commentaires, les espaces inutiles et les sauts de ligne caractères (de nouvelle ligne). Les commentaires et les espaces facilitent la lecture du code, mais ils sont ignorés par le navigateur. Ces éléments peuvent donc être supprimés sans risque avant la publication. Une autre méthode consiste à réduire le code nécessaire pour chaque instruction. En CSS, cela se fait souvent en convertissant le CSS détaillé en CSS abrégé. Par exemple, une définition margin peut occuper sept lignes dans sa forme détaillée, mais une seule ligne dans sa forme abrégée. En JavaScript, les noms longs de variables peuvent être remplacés par des noms plus courts, souvent un seul caractère.

Voici un exemple de code CSS avant et après la minification. Remarquez que les commentaires, les espaces, les sauts de ligne et les points-virgules inutiles sont supprimés. Le code est également converti du CSS détaillé en CSS abrégé.

Code CSS standard

img.left   /* float left 400px image */
{
    float: left;
    max-width: 400px;
    margin-top: 8px;
    margin-right: 30px;
    margin-bottom: 12px;
    margin-left: 0px;
}

Code CSS minifié

img.left{float:left;max-width:400px;margin:8px 30px 12px 0}

Des algorithmes de minification avancés peuvent réduire encore davantage la taille des fichiers. Par exemple, un minificateur CSS peut détecter et supprimer les lignes en double dans un fichier CSS. Il peut également combiner des définitions CSS similaires en une seule instruction. Un minificateur JS peut même réécrire les fonctions JavaScript pour les rendre plus efficaces.

La minification du code ne permet souvent d'économiser que quelques kilo-octets. Par exemple, un fichier CSS standard peut faire 50 Ko, tandis que sa version minifiée peut faire 40 Ko. Cependant, lorsqu'on cherche à accélérer le chargement d'une page, chaque kilo-octet compte. L'objectif d'un bon minificateur est de réduire la taille du fichier autant que possible, sans aucun impact sur la façon dont le code est analysé ou traité. Quel que soit le minificateur utilisé, les développeurs conservent généralement une version non minifiée du code pour pouvoir la modifier ultérieurement.

Minification et compression

Bien que la minification et la compression de fichiers réduisent toutes deux la taille des fichiers, elles ne sont pas identiques. La minification modifie simplement le texte, tandis que la compression de fichiers réécrit complètement le code binaire contenu dans un fichier. Un fichier compressé doit être décompressé par un utilitaire de décompression de fichiers pour pouvoir être lu comme un fichier texte. De nombreux sites web combinent la minification et la compression de fichiers « gzip » afin de réduire autant que possible la taille des ressources web.