dokuro Posté(e) le 28 décembre 2014 Signaler Share Posté(e) le 28 décembre 2014 InstantClick est une petite bibliothèque JavaScript bien sympathique puisque celle-ci permet d’accélérer la navigation sur un site internet. Pour cela, InstantClick va précharger les pages lors de la navigation en se basant sur trois types d’évènements au choix : au hover sur un lien au hover sur un lien et après un délai au mousedown (un lien n’est ouvert que lorsque le bouton de la souris est relâché, on gagne donc quelques millisecondes qui participent tout de même à donner cette impression de vitesse) Si vous êtes un peu dubitatif sur le fonctionnement, je vous encourage à faire le test du clic sur la page suivante. Ainsi, on remarque que le délai écoulé entre le hover sur un lien et le clic est en général situé entre 200 et 500 ms. InstantClick va alors tirer profit de ce délai pour faire une requête en utilisant le combo pushState + Ajax (plus connu sous le nom de pjax) et propose de ce fait plusieurs avantages : les fichiers JS et CSS ne sont pas recompilés à chaque changement de page le chargement est casi imperceptible (pas de flash) la navigation n’est pas cassée (un point crucial dans l’expérience utilisateur) Maintenant, si vous choisissiez d’implémenter la lib sur votre site, je vous encourage à bien réfléchir avant au type d’évènement que vous souhaitez utiliser : L’évènement hover sur un site contenant énormément de liens pourrait entrainer trop de requêtes superflues vers le serveur (et donc surcharger celui-ci inutilement) L’évènement mousedown sera inefficace avec l’utilisation d’un trackpad. J’ai fait le test sur mon mac, le mousedown levé par un clic au trackpad génère un délai d’environ 7 ms (contre 100 ms avec le bouton physique). L’évènement hover + délai semble lui être un bon compromis, à condition que le délai soit en dessous de la barre des 100 ms (sinon le mousedown lui sera préférable) Pour finir, sachez qu’il ne vous suffira pas de charger InstantClick pour que tout se fasse comme par magie et vous aurez probablement besoin de faire quelques ajustements pour éviter le conflit avec vos autres scripts (notamment parce que l’évènement DOMContentLoaded ne sera pas déclenché par la lib).De plus, il faut être conscient que le script permettra d’accélérer la navigation et non d’améliorer les performances globales de votre site. Citer Lien vers le commentaire Partager sur d’autres sites More sharing options...
Messages recommandés
Rejoindre la conversation
Vous pouvez publier maintenant et vous inscrire plus tard. Si vous avez un compte, connectez-vous maintenant pour publier avec votre compte.