Utilisez la prélecture de liens HTML5 pour accélérer votre site Web_html5 conseils du didacticiel

La prélecture de liens HTML5 est un joyau enfoui dans le sable, et peu de gens connaissent encore sa valeur. Vous connaissez peut-être déjà l'ancienne et célèbre fonction de préchargement d'images. La fonction de prélecture de liens étend ce concept des images au contenu Web (sans aucun code AJAX).
Voici comment ça marche : Ajoutez un lien vers la page comme ceci :

Copiez le code

Le code est comme suit :

De cette façon, lorsque votre machine est inactive, le navigateur téléchargera automatiquement page2.html en arrière-plan. Lorsque l'utilisateur clique enfin sur le lien vers page2.html, le navigateur récupère la page du cache, de sorte que la page se charge à une vitesse inattendue.
Actuellement, seul Firefox prend en charge cette fonctionnalité. Mais comme Firefox est actuellement le navigateur avec la deuxième plus grande base d'utilisateurs au monde, tant que vous ajoutez une telle ligne de code à la page HTML, il y aura toujours un nombre considérable de visiteurs qui pourront expérimenter cette vitesse de chargement de page très évidente. . améliorer. Comme c'est cool !

Vous pouvez utiliser la fonction de prélecture de liens dans de nombreuses situations  :
* Lorsque vous avez un long article, ou un tutoriel en ligne, ou un album, etc., vous devez le diviser en Lorsque plusieurs pages sont affichées.
* Préchargez les prochaines pages que vos utilisateurs sont les plus susceptibles de visiter sur votre page d'accueil. (Il peut s'agir d'une page de produit « hautement recommandé » sur un site Web de produit, ou d'un blog récent sur un site Web de blog)
* La page de requête de recherche précharge les premiers éléments recherchés.
Pour le contenu statique, vous pouvez également utiliser la balise rel pour implémenter la fonction prefetch :

Copiez le code

Le code est le suivant :

Il existe d'autres choses intéressantes à noter ici :
* La prélecture de liens sera bientôt implémentée dans les navigateurs Opera, Chrome et Safari, mais pour Internet Explorer, vous devrez peut-être attendre jusqu'en 2020.
* Si cette fonctionnalité est largement utilisée, elle affectera les journaux de votre site Web et les statistiques d'accès. Veuillez considérer la situation dans laquelle l'une de vos pages a pré-récupéré plusieurs pages, mais l'utilisateur n'a pas réellement accédé à ces pages. Votre serveur (ou outil de statistiques) ne connaît pas la différence entre les deux.
Pour distinguer cela, Firefox enverra le message X-moz: prefetch dans l'en-tête HTTP, mais vous avez besoin de quelque chose côté serveur pour reconnaître ce message.