Maison  >  Article  >  interface Web  >  Introduction à l'accélération du chargement des pages HTML

Introduction à l'accélération du chargement des pages HTML

黄舟
黄舟original
2017-09-01 15:18:381892parcourir

1. Perte de poids de la page

a. Le poids de la page est le facteur le plus important affectant la vitesse de chargement.

b. Supprimez les espaces et commentaires inutiles.

c. Déplacez le script en ligne et le CSS vers des fichiers externes.

d. Vous pouvez utiliser HTML Tidy pour affiner le HTML, et vous pouvez également utiliser certains outils de compression pour affiner le JavaScript.

2. Réduisez le nombre de fichiers

a. Réduire le nombre de fichiers référencés sur la page peut réduire le nombre de connexions HTTP.

b. De nombreux fichiers JavaScript et CSS peuvent être fusionnés et sont mieux fusionnés. Caibangzi a fusionné ses fonctions JavaScript et Prototype.js dans un fichier base.js.

3. Réduire les requêtes de noms de domaine

a. Les requêtes DNS et la résolution de noms de domaine prennent également du temps, il est donc nécessaire de réduire les références à JavaScript, CSS, images et autres ressources externes. , et moins les noms de domaine différents sont utilisés, mieux c'est.

4. Mettre en cache les données réutilisées

a. Mettre en cache les données réutilisées.

5. Optimisez l'ordre de chargement des éléments de la page

a. Chargez d'abord le contenu initialement affiché sur la page ainsi que le JavaScript et le CSS qui y sont associés, puis chargez les éléments liés au HTML, comme ce qui n'est pas pertinent pour l'affichage initial Les ressources très volumineuses telles que les images, le flash et les vidéos sont chargées en dernier.

6. Réduisez le nombre de JavaScript en ligne

a. L'analyseur du navigateur supposera que le JavaScript en ligne modifiera la structure de la page, donc l'utilisation de JavaScript en ligne est plus coûteuse.

b. N'utilisez pas document.write() pour générer du contenu, utilisez les méthodes DOM modernes du W3C pour gérer le contenu des pages pour les navigateurs modernes.

7. Utilisez du CSS moderne et des balises légales a. Utilisez du CSS moderne pour réduire les balises et les images. Par exemple, l'utilisation de CSS + texte moderne peut remplacer complètement certaines images par du texte uniquement.

b. Utilisez des balises légales pour empêcher le navigateur d'effectuer des opérations de « correction d'erreurs » lors de l'analyse du HTML. Elles peuvent également être utilisées par HTML Tidy pour affiner le HTML.

8. Découpez votre contenu a. N'utilisez pas de tableaux imbriqués, mais utilisez des tableaux ou des divs non imbriqués. Divisez la mise en page basée sur un grand tableau imbriqué en plusieurs petits tableaux, de sorte qu'il n'est pas nécessaire d'attendre que le contenu entier de la page (ou du grand tableau) soit chargé avant de l'afficher.

9. Spécifiez la taille des images et des tableaux

a. Si le navigateur peut déterminer immédiatement la taille de l'image ou du tableau, alors il peut afficher la page immédiatement sans avoir à refaire une mise en page. dispositions.

b. Cela accélère non seulement l'affichage de la page, mais évite également certaines modifications de mise en page inappropriées après le chargement de la page.

c. L'image utilise la hauteur et la largeur.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn