Technologies
Transformation Numérique
Prestations de service
Technologies

Python

Django, Flask

Wagtail, Django CMS, CKAN

PHP

Laravel, Symfony

Magento, Opencart

Wordpress, Drupal, Joomla

JavaScript

React, Angular, Vue

Android

Java

Ionic, Cordova

iOS

Swift, Objective C

Transformation Numérique

Numérisation bancaire

Traitement des données médicales

Numérisation du commerce de détail

Main d'œuvre de programmation

Solutions pour site d'emploi

Prestations de service

Développement SaaS

Développement web

Développement d'applications

Intelligence artificielle

Conception UX/UI

Développement de logiciels

Maintenance Web

Intégration

Programmation

Gestion de cloud

Services conseils

logo Nixa

Développement numérique
Application, Web, Logiciel

Du nouveau chez NIXA #NixaLife Planifiez votre prochain projet

Parce qu'on s'amuse et qu'on apprend plein de truc, on a envie de vous les partager ♥️

Comment choisir entre Sass et PostCSS

SASS est très populaire et est l’un des pré-processeurs CSS les plus connus et utilisés. Cependant, il est toujours pertinent de mettre en doute nos connaissances et de s’ouvrir aux alternatives disponibles sur le marché. Voici pourquoi nous proposons une analyse comparative entre SASS et POSTCSS afin de faire le point sur les meilleures technologies à adopter.

 

Commençons par le début ! Afin de pouvoir faire la comparaison, commençons d’abord par définir les concepts.

 

 

Qu’est ce que c’est que SASS?

SASS est un langage permettant d’écrire plus facilement du CSS. Le SASS contient plusieurs éléments permettants de faciliter et d’accélérer l’écriture du CSS sans avoir à trop se répéter. Par exemple, les variables qui évitent à avoir à spécifier de multiples fois du code (ex: font-family qui se répète à multiples endroits), ou encore les extends pour les sections qui sont similaires. Le SASS est un langage solide, mature et est l’un des pré-processeurs CSS des plus utilisés. Pour en savoir plus sur le sass, voir cet article.

 

 

Qu’est ce que c’est que POSTCSS?

PostCSS est un outil conçu en Javascript qui permet de lire un fichier CSS écrit avec une syntaxe différente puis, de le convertir en vrai CSS. Tout comme SASS, il sert à rendre l’écriture du CSS plus rapide, plus facile et plus modulaire. Cependant, contrairement à SASS qui fait déjà tout, POSTCSS, à lui seul, ne fait rien. En fait, POSTCSS est inclus avec plusieurs plugins que l’on peut installer. En d’autres termes, on peut considérer que c’est un peu comme un SASS DIY !

Tout comme SASS, POSTCSS fonctionne avec :

  • Gulp
  • Webpack
  • Grunt
  • Etc…

 

 

Quelles sont les principales différences?

La principale différence entre les deux technologies est que, contrairement à SASS, POSTCSS nous offre plus de flexibilité. En effet, il est possible de le personnaliser avec les nombreux plugins disponibles. Il est également possible d’en créer de nouveaux facilement.

Toutefois, puisque POSTCSS peut être personnalisé, bon nombre de projets peuvent être conçu différemment. Or, cela rends la courbe d'apprentissage de POSTCSS plus lente pour les développeurs et, par conséquent, le set up des projets peut être plus complexe.

 

 

Quels sont les avantages de POSTCSS?

Le principal avantage de POSTCSS est qu’il a la particularité d’être personnalisable à 100%. Cela offre plus de contrôle sur l’outil. Aussi, puisque le développeur choisit manuellement ses fonctionnalités et qu’il doit les intégrer lui-même, celui-ci sait comment bien s’en servir. En revanche, en ce qui concerne SASS, si le développeur comprend mal les fonctionnalités, le CSS généré peut être non optimisé et répétitif (ex: mauvaise utilisation des mixins).

 

 

Quels sont les désavantages de POSTCSS?

Malheureusement, avec tout ces plugins, la maintenance devient plus complexe. Les plugins mis en place dépendent d’un tiers parti, il y a donc des chances qu’un jour, ceux-ci ne soient plus maintenus / supportés. À noter aussi qu’il y a une possibilité de conflit entre plugins et que certains d’entre eux doivent respecter un ordre spécifique lorsqu’ils sont ajoutés au projet. Toutefois, cet ordre, ainsi que les conflits, seront détaillés dans la documentation des plugins.

 

 

Exemples de plugins de POSTCSS

Comme mentionné ci-haut, il existe des plugins POSTCSS pour chacune des fonctionnalités SASS. Cependant, ils ne sont pas inclus par défaut. Il faut donc les installer manuellement.

Voici quelques exemples:

 

Vous pouvez également consulter la liste complète des plugins ici : https://www.postcss.parts/

 

 

Mais finalement, lequel devrait-on choisir?

Évidemment, comme toutes les technologies, chaque alternative a des avantages et des inconvénients. Il suffit de voir de quelle manière nous voulons agrémenter l’expérience des développeurs dans l’écriture du CSS, le temps que nous pouvons allouer pour faire de la maintenance, l’expertise des développeurs qui seront mandaté sur les projets, etc. Dans le cas de SASS et POSTCSS, les deux ont sensiblement la même utilité. À ce stade, il s’agit donc d’une question de goût.

 

 

Encore des hésitations?

Saviez-vous que POSTCSS et SASS peuvent être utilisés en même temps sur un même projet? Vous pouvez donc continuer à utiliser SASS, tout en prenant le meilleur de POSTCSS !

Chez Nixa nous sommes des passionnés de design et de nouvelles technologies. Nous serions heureux de partager notre passion avec vous.

Nous Contacter