Myth, un préprocesseur rendant accessible le futur CSS dès maintenant

Aujourd'hui, le Blog du Webdesign vous propose un nouveau préprocesseur pour le CSS ayant pour but non pas de vous apprendre un nouveau langage, mais de vous offrir aujourd'hui le CSS de demain.

Ce n'est pas la première fois que je parle de préprocesseurs sur le Blog du Webdesign, et vous savez que c'est une technologie que j'aime beaucoup : bien utilisée, elle permet de gagner beaucoup de temps. Il y a toujours quelques réfractaires, que ce soit par ignorance ou par choix. Myth entend changer cet état de fait en fournissant une porte d'accès simplifiée aux réfractaires : Le préprocesseur de CSS à CSS.

Qu'est-ce qu'un préprocesseur en quelques mots ?

Un préprocesseur CSS est un outil fait pour lire et transformer votre code de style entre son écriture et sa lecture par le navigateur. Cela vous permet par exemple d'écrire vos feuilles de style en SCSS, et d'obtenir des feuilles en CSS que les navigateurs comprendront nativement.

L'avantage principal est de travailler avec un langage bien plus évolué que le CSS, contenant des boucles, variables et autres outils mathématiques manquants cruellement au CSS. Cela permet aussi quelques raccourcis, comme l'ajout automatique des préfixes CSS.

L'inconvénient est d'ajouter une couche d'abstraction forçant à réfléchir au code CSS qui sera généré par nos actions pour ne pas produire un CSS particulièrement indigeste. Certains langages comme le SASS, assez éloigné du code CSS original, peuvent aussi complexifier le travail en équipe si tout le monde n'est pas formé.

Myth – le CSS tel qu'imaginé

La particularité de Myth en tant que préprocesseur est qu'il prend du CSS en entrée, et qu'il vous fournit du CSS en sortie. Pour être un peu plus précis, il prend du CSS moderne, avec des fonctionnalités à peine annoncées comme les variables, et fournit un CSS lisible par les navigateurs dépassés tels qu'IE 8.

Les avantages sont évidemment immédiatement visibles : codez sous les derniers Chromes, Firefox et IE (oui, même IE 10 est un navigateur moderne ^^) sans vous préoccuper du préprocesseur, puis compilez votre CSS et fournissez le pour la production. De plus, il n'est pas nécessaire d'apprendre un nouveau langage ici : tout est CSS et reste CSS.

La part des choses

Bien que l'idée soit très intéressante sur le papier, le passage à la pratique n'est pas aussi rose. Myth ne fonctionne pas exactement de la même manière que le CSS, au niveau des variables notamment, car le CSS est interprété dans le navigateur, et a donc conscience du DOM (pour quelque chose de moins simplifié et bien plus exacte, je vous conseille la lecture de cette issue Github).

Le résultat est donc un CSS compilé qui peut être interprété différemment du CSS original, et donc quelque chose de dangereux à utiliser.

Conclusion

Pour moi, Myth n'est malheureusement pas le préprocesseur révolutionnaire attendu, mais ce n'est pas pour autant qu'il n'est pas utilisable.

Il reste un outil, et comme tous les outils il vient avec ses forces et ses contraintes. Après un peu de documentation et de pratique, il est tout à fait possible de l'utiliser en production si l'on en ressent le besoin.

Pour ma part, je reste ancré au SASS et SCSS, préprocesseurs qui demmandent une formation plus longe pour être utilisé à leur pleine puissance, mais aussi bien plus puissants.