Préprocesseur CSS

Comme son nom l'indique, un préprocesseur CSS intervient avant le traitement des fichiers CSS par les navigateurs web. Il se situe soit côté serveur, soit côté client[1]. Il permet de générer dynamiquement un fichier CSS standard (aux normes W3C) à partir d'un ou de plusieurs fichiers source qui disposent d'une syntaxe plus étendue que le CSS[2].

Il existe plusieurs préprocesseurs CSS, chacun possédant une syntaxe et un langage qui leur est propre. Bien qu'ils étendent la structure du CSS, ils restent indépendants des normes CSS existantes. Parmi les plus connus se trouvent Sass, LESS et Stylus[3]. L'objectif des préprocesseurs CSS est d'ajouter des fonctionnalités qui permettent au développeur de mieux structurer son code, fonctionnalités qui pour beaucoup manquent au CSS[4]. En créant une couche d'abstraction, elles visent à améliorer la maintenabilité et la clarté du code, à améliorer sa structure, à éviter les répétitions (philosophie de programmation "DRY"), et ainsi à augmenter la productivité du développeur[5]. Quelques-unes des fonctionnalités offertes par les préprocesseurs CSS incluent généralement : les variables, l’imbrication (hiérarchisation) du code, les mixins, les opérations mathématiques et logiques, les conditions, les boucles et les importations[3].

Pour des exemples sur les fonctionnalités et la syntaxe d'un préprocesseur CSS, voir l'article sur le langage LESS.

Certains préprocesseurs CSS fournissent des traitements complémentaires sur les fichiers CSS. Par exemple, les Google Stylesheets proposent la minification du code, la vérification syntaxique, l'inversion RTL (Right-To-Left en anglais), et le renommage de classe[6]. Ces opérations sont assimilées à du post-traitement CSS, travail dédié généralement aux "postprocesseurs" CSS[7].

Tout le monde ne plaide pas forcément en faveur de l'utilisation des préprocesseurs CSS. Voici quelques arguments qui peuvent être avancés à leur encontre[8] :

• "Ils complexifient CSS", la syntaxe des préprocesseurs étant plus complexe que le CSS de base.
• "Ils n'ajoutent pas de fonctionnalités CSS aux CSS", les préprocesseurs ne pouvant générer que du CSS standard.
• "Ils ne font pas (toujours) gagner de temps", leur utilisation ne se justifiant pas pour des projets de taille modeste.
• "Ils peuvent être dangereux pour le standard CSS", leurs fonctionnalités risquant de faire stagner l'évolution du CSS.

Pour d'autres, de telles raisons ne sont pas suffisantes, le niveau d'abstraction et la flexibilité obtenus par les préprocesseurs CSS s'avérant plus bénéfiques que toute autre considération[9].

• LESS
• SASS