Commentaire: Qu'il s'agisse d'un développeur de navigateur ou d'un développeur d'applications Web normal, ils font tous un effort conjoint: pour que la navigation Web soit plus rapide. Il existe de nombreuses techniques connues qui peuvent rendre votre site Web plus rapidement: utiliser CSS Sprites, utiliser des outils d'optimisation d'image, utiliser .htaccess pour définir les informations d'en-tête de page et le temps de cache, la compression JavaScript, l'utilisation de CDN, etc.
J'ai introduit certaines techniques d'optimisation de vitesse utilisées sur ce site. Dans HTML5, une nouvelle fonctionnalité est apparue pour optimiser la vitesse du site Web: Page Resource Prechar / Pre-Read (Link Prefetch).
Qu'est-ce que Page Resource Precharge / Pre-Read (préfet de lien)? Explication de MDN:
Page Resource Precharding (lien Prefetch) est une compétence fournie par le navigateur, qui est conçue pour permettre au navigateur de télécharger ou de prévoir certaines ressources de document pendant le temps libre, et les utilisateurs accéderont à ces ressources à l'avenir. Une page Web peut définir une série d'instructions de précharge pour le navigateur. Lorsque le navigateur charge la page actuelle, il chargera tranquillement les documents spécifiés en arrière-plan et les stockera dans le cache. Lorsque l'utilisateur accède à ces documents préchargés, le navigateur peut rapidement les extraire du cache à l'utilisateur.
Autrement dit, c'est: laissez le navigateur précharge d'autres ressources (pages, photos, vidéos, etc.) auxquelles l'utilisateur est le plus susceptible d'accéder après avoir accédé à la page actuelle. Et la méthode est super simple!
HTML5 Page Resource Précharge (Préfet de lien) Méthode d'écriture
<! - Précharge de la page entière ->
<link href = "http://www.vevb.com/misc/3d-album/" /> </p> <p> <! - Preload une image ->
<link href = "<a href =" http://www.vevb.com/wordpress/ "> </a>
WP-CONTENT / Télécharges / 2014/04 / B-334X193.jpg "/>
La fonction HTML5 Page Resource Précharge / pré-lecture (préfet de liaison) est implémentée via des balises de liaison. L'attribut REL est spécifié comme préfesche et l'adresse à charger dans l'attribut HREF. Firefox Browser fournit également un support d'attribut supplémentaire:
<
title = "conçu pour mozilla" href = "mozspecific.css" _fcksavedUrl = "" mozspecific.css "" />
<link href = "2.html" />
La préfetch peut également être utilisée sous les ressources du protocole HTTPS.
Dans quelles circonstances, les ressources de la page doivent être préchargées
Quel type de ressources est chargé sur votre page et quand tout dépend de vous. Voici quelques suggestions:
1. Lorsque la page a un service de diapositive, précharge / pré-lecture, les 1-3 pages suivantes et les 1-3 pages précédentes.
2. Préchargez les images communes à l'ensemble du site Web.
3. Préchargement de la page suivante des résultats de recherche sur le site Web.
Interdire la préchargée des ressources de la page (préfet de liaison)
Il existe une option dans le navigateur Firefox pour interdire toute fonction de préchargement de la ressource de page (préfet de liaison). Vous pouvez le définir comme ceci:
1.User_Pref (réseau.prefetch-next, false);
2. Précautions pour la précharge de la ressource de page (préfet de liaison)
Voici quelques notes sur le préchargement des ressources de la page (préfescée de liaison):
1. Précharge (préfecture de liaison) ne peut pas fonctionner entre les domaines, notamment en tirant des cookies à travers les domaines.
2. Le préchargement (préfet de liaison) polluera votre site Web Visite Statistics, car certaines pages préchargées au navigateur peuvent ne pas être réellement visitées par les utilisateurs.
3. Firefox Browser a fourni un support pour cette technologie de précharge (préfesche de liaison) depuis 2003.
En utilisant le temps libre du navigateur pour charger des fichiers de ressources supplémentaires, il semble à la fois excitant et dangereux. Voulez-vous essayer ces technologies?