blog.pagesd.info // Archives // Traductions

Solitaire - Passer de jQuery à Vanilla JS

2019-03-27 #javascript

Ce billet fait partie d’une série consacrée au travail en cours sur mon site de solitaires et aux évolutions que je souhaite y apporter :

  1. Introduction
  2. Passer de jQuery à Vanilla JS
  3. Améliorer FreeCell
  4. Ajouter des animations CSS
  5. Drag and drop sans jQuery UI
  6. Remplacer AjaxMin, etc…
vanille-bourbon
Vanille Bourbon - La Réunion

Au départ, j’ai utilisé jQuery (et jQuery UI) parce que c’était encore ce qui se faisait plus ou moins à l’époque. Et pour moi, c’était la solution la plus simple pour réussir à faire rapidement ce que je voulais, et que cela fonctionne correctement sur un maximum de navigateurs.

Maintenant, je connais un peu mieux JavaScript, et surtout les navigateurs sont beaucoup plus “standards”. Inspiré par le mouvement You Don’t Need jQuery, et par de nombreux exemples disponibles sur le web, j’ai déjà pas mal creusé le sujet. Pas parce que jQuery est un problème, mais parce que j’ai envie de faire autrement et de m’améliorer en JavaScript.

J’ai commencé à travailler sur une librairie “dQuery.js”. Elle reprend uniquement les fonctions de jQuery que j’utilise dans Solitaire-Play, de façon très basique. Le code est assez standard (même si je m’accorche à IE9) et devrait donc être OK pour tous les navigateurs suffisament modernes, y compris sur les smartphones.

Quelques liens qui m’ont aidé / encouragé pour démarrer :

Et quelques exemples de librairies qui visent à “remplacer” jQuery :

  • Bliss - Heavenly JavaScript - Want to use Vanilla JS but find native APIs a bit unwieldy? Bliss is for you.
  • Umbrella JS - Tiny library for DOM manipulation, events and AJAX
  • nanoJS - Minimal standalone JS library for DOM manipulation

J’ai utilisé “nanoJS” comme point de départ et j’ai bien progressé depuis. J’ai maintenant une version de test du jeu Golf Solitaire qui fonctionne telle quelle avec jQuery ou avec ma librairie dQuery.

La suite maintenant, c’est de tester cette nouvelle solution dans un maximum de cas et de conditions. Une fois que je serai suffisament sûr du résultat, je pourrai migrer les quelques jeux sans drag and drop, puisqu’ils ne dépendent que de jQuery et pas de jQuery UI.

Eventuellement, je pourrais aussi rédiger un billet à part pour présenter un peu plus en détails ce que j’ai fait avec ma librairie dQuery.