Un article peut être un peu plus technique que d’habitude, mais il devrait tout de même être intéressant à tout un chacun et tout le monde devrait y trouver son compte (autant client, agence, que développeur). Alors on commence ? Voici Tout l’art de se passer du Javascript :
Pour commencer c’est quoi le Javascript ?
On va dire que c’est un langage de programmation de scripts (d’où le script :D), qui est utilisé pour rendre une page web plus dynamique et qui vient prêter main forte au PHP qui ne permet pas vraiment de rendre une page dynamique.
Il (Javascript) s’exécute côté client (comprendre votre pc), et permet donc quelque chose de dynamique puisque c’est votre pc qui va s’en occuper tout seul comme un grand, alors que le php lui est exécuté sur le serveur pour ensuite vous renvoyer un résultat qui sera “statique”.
Alors on va s’arrêter là, je n’ai parlé que de ce petit point technique car c’est un peu ce qui va nous intéresser par la suite.
A quoi sert donc le Javascript en pratique ?
Le javascript est présent sur quasiment tous les sites internet (le notre y compris) et permet de rendre l’expérience utilisateur la plus agréable possible. Comment ?
- Aucun rechargement de la page pour une fonctionnalité spécifique (charger une liste, filtrer des résultats etc..)
- Contrôle des données tapées par le client sur la page web directement à la saisie et donc éviter de recharger une page pour valider les formulaires.
- Modifier le CSS de la page actuelle (qui permet de modifier les couleurs d’un bloc dynamiquement par exemple)
- Permet de faire des animations (diaporamas par exemple)
Cela n’est qu’une petite partie des possibilités mais vous voyez l’idée.
Mais alors pourquoi se passer de Javascript vous allez me dire, ça a l’air bien pratique non ?
Disons qu’aujourd’hui Javascript permet de tout faire ou presque grâce à des librairies ou framework js, et parmi ceux-ci on retrouve la librairie jQuery. Je ne vous demande pas de retenir ni de savoir ce que c’est en détail, il suffit de savoir que cela permet au développeur de gagner du temps et simplifier certaines choses. Et il le fait bien ! Tellement bien que la majorité des sites web intègrent systématiquement jQuery, c’est vous dire ! Et pour la suite de l’article je parlerai de jQuery pour parler du Javascript.
Ne plus réfléchir en terme pratique
Le fait que jQuery soit intégré à tous les projets a été une bonne chose il y a quelques années car cela a permis de proposer beaucoup de choses innovantes de rendre les sites très dynamiques et sans avoir besoin de maîtriser le Javascript totalement, mais aujourd’hui d’autres technologies ont évolué en parallèle, et notamment le CSS qui est le “langage” classique qui permet d’habiller votre site (les couleurs, la position des éléments etc. vous voyez l’idée).
Et nous arrivons à une situation où aujourd’hui beaucoup de choses peuvent être réalisées avec autre chose que Javascript + jQuery, mais le choix de la facilité et / ou le manque de veille fait que l’on utilise encore et toujours celui ci quand on pourrait s’en passer.
Pourquoi changer alors ?
- Javascript est un langage client, donc qui est exécuté sur le PC du client, donc si votre PC est lent, l’exécution du code jQuery pourra être lente, de plus le javascript peut être désactivé par les utilisateurs.
- jQuery contient énormément de choses, et votre site n’utilisera pas 5% de ses possibilités, mais vous allez bel et bien charger tout le fichier.
- Vous allez même en charger plusieurs car en général il faut des plugins supplémentaires pour faire certaines choses.
Pour résumer, on charge une usine à gaz dans votre projet alors que vous n’aviez besoin que d’une petite chose simple. On va donc alourdir le poids du site, et ralentir l’expérience utilisateur.
On ne réfléchit plus à ce dont vous avez réellement besoin, on vous booste votre site aux hormones inutilement.
Cas pratique
Enfin des choses plus compréhensibles et qui parleront à tout le monde ! Voici typiquement ce qui est réalisé avec jQuery
- Sliders
- Animations en tout genre
- Ouverture / fermeture de Pop-up
- Gérer des menu déroulants
Vous les rencontrez partout n’est ce pas ? Et je met ma main au feu que votre site contient du jQuery pour tout gérer ! (oui le notre aussi :D).
Mais les exemples cités ci-dessus peuvent largement être réalisés en CSS simple, et donc augmenter les performances de votre site internet car vous ne chargez plus de script inutile, et que dans la pratique votre pc sera plus rapide à exécuter le CSS.
Que retenir
Ce qu’il faut retenir de cet article est plus un principe applicable à plusieurs choses mais qui pour le coup concernent le CSS / Javascript.
Dans un projet pour un site internet il faut non pas intégrer tous les outils classiques et “simples” à utiliser sous prétexte qu’on sait faire et que l’on est dans notre zone de confort, au contraire il faut réfléchir en amont aux outils nécessaires pour l’accomplissement d’une tâche.
Sur un projet simple ne nécessitant pas énormément de modules particuliers, intégrer un Jquery sans module par exemple peut s’avérer être une bonne solution car permet d’accélérer la phase de développement, et au final on ne ressentira aucun ralentissement. Mais si vous allez plus vite en CSS c’est encore mieux.
En revanche sur un site plus complexe avec beaucoup de modules, optimiser le temps de chargement et le poids de la page devient primordial, et réfléchir aux technologies appropriées pour le développement d’un projet doit être une opération effectuée en amont.
