Coder sans jQuery ? Retour d'expérience

C'est officiel, Bootstrap va se séparer de sa dépendance la plus forte : jQuery. C'est ce qu'annonce cette PR sur le Github du plus célèbre Framework CSS. A la place, pas de nouveau framework Javascript, pas de super lib next gen : du Vanilla JS, tout simplement. Cette PR montre pour moi la tendance Javascript de 2019, qui se confirme en 2020 : jQuery a-t-il encore une raison d'exister ?

Si l'on remonte de quelques années aux temps où IE 6 était roi, jQuery avait du sens lorsque les navigateurs avaient d'énormes différences dans l'implémentation des specs. Aujourd'hui, bien qu'encore présentes, ces différences tendent à se réduire de plus en plus :

• querySelector est devenu stable et consistent entre les navigateurs.
• XMLHTTPRequest peut être remplacé par fetch qui est devenu standard.
• Les animations peuvent être gérées en CSS3 et sont d'ailleurs plus performantes car elles utilisent le GPU du client.
• Microsoft a annoncé l'arrêt de l'utilisation de son moteur de rendu en faveur de Chromium pour son navigateur Edge.
• etc etc

Pour enfoncer le clou, GitHub annonce lui aussi qu'il a supprimé jQuery de son interface frontend. Alors, faut-il bannir absolument jQuery de ses nouveaux projets ?

Mon retour d'expérience

Un zeste de contexte

J'ai récemment développé une application Symfony pour un client. Fort de cette tendance, j'ai donc décidé d'utiliser du pur Javascript dans le projet et voir si j'arrivais à m'en sortir.

Pour ça, je me suis fortement inspiré de la structure frontend du site en-marche.fr qui est Open Source (pro tip : vous n'avez pas besoin d'adhérer aux idées du parti politique pour pouvoir tirer le meilleur de l'architecture du site 🤫). Je trouve d'ailleurs que Titouan Galopin a fait de l'excellent travail lorsqu'il était sur ce projet.

La stack technique

Pour ce projet, j'ai utilisé Bootstrap, axios pour les requêtes HTTP, SweetAlert2 pour les popups, Select2 pour des jolis select et pjax pour accélérer les changements de page. Le code front métier étant écrit en ES6 et transpilé avec Webpack et Babel.

À cause de certaines de ces libs, j'ai donc quand même été contraint d'inclure jQuery dans mon projet, mais j'ai décidé de restreindre son utilisation uniquement pour manipuler les plugins. Histoire de jouer le jeu pour de vrai.

Résultat

Globalement, l'absence de jQuery ne s'est pas tant fait ressentir. C'est d'ailleurs gratifiant de savoir que l'on peut développer rapidement des apps sans framework JS et leurs contraintes associées.

En utilisant jQuery, je trouve aussi qu'on se place dans une zone de confort qui nous maintient à l’écart de l’univers JS. Et ça bouge vite, très vite. De nouveaux standards apparaissent quasiment chaque année, et apportent des évolutions intéressantes et de nouvelles façons de penser et d’écrire le Javascript. Il se passe des choses et il ne faut pas rater le coche, il n'y a qu’à voir du code écrit avec React pour se rendre compte du fossé qu'il y a avec jQuery, alors que les 2 s'appuient sur le même langage.

Mais tout n'est pas rose, il y a quand même eu quelques points de frustration :

• Il y a toujours beaucoup de libs qui ne marchent qu'avec jQuery (Bootstrap 4, select2, etc etc). C'est pourquoi même si je n'en voulais pas, jQuery s'est invité de force dans mon fichier package.json.
• fetch n'est pas si cool que ça. J'ai fini par utiliser axios après avoir perdu pas mal de temps à tenter de cerner ses subtilités.

Et vous ? Utilisez-vous encore jQuery en 2020 dans vos nouveaux projets ? Pensez-vous que jQuery va mourir ?

PS : Le bug de l'an 2000 risque bien de se reproduire si les systèmes ne se mettent pas à jour avant le 19 Janvier 2038 à 03h14 et 08s GMT, date à laquelle toutes les architectures d'ordinateurs qui sont encore en 32 bits cesseront de gérer correctement les dates. Mais ça reste entre nous 🤫