Améliorez la vitesse de chargement via PageSpeed Insights Part 6

  • février 10, 2019
  • SEO
No Comments
Améliorez la vitesse de chargement via PageSpeed Insights

14) Préconnexion aux origines requises

En règle générale, l’établissement de connexions, en particulier sécurisées, prend beaucoup de temps. Le fait est que cela nécessite des recherches DNS, des ententes SSL, un échange de clé secrète et des allers-retours vers le serveur final responsable de la demande de l’utilisateur. Donc, pour gagner ce temps précieux, vous pouvez vous connecter à l’avance aux origines requises.

 

Comment optimiser?

Pour préconnecter votre site Web à une source tierce, il vous suffit d’ajouter une balise de lien à votre page. Voici à quoi ça ressemble:

 

<link rel = « preconnect » href = « https://example.com »>

Une fois que vous avez implémenté le tag, votre site Web n’aura plus besoin de passer plus de temps à établir une connexion avec le serveur requis, évitant ainsi aux utilisateurs d’attendre plusieurs allers-retours supplémentaires.

 

15) Servir des images dans les formats next-gen

Tous les formats d’image ne sont pas créés égaux. La vérité est que nos vieux formats fidèles JPEG et PNG ont maintenant des caractéristiques de compression et de qualité bien pires par rapport à JPEG 2000, JPEG XR et WebP. J’essaie donc de dire que le codage de vos images dans ces formats leur permettra de se charger plus rapidement et de consommer moins de données cellulaires.

 

Comment optimiser?

Tout comme pour les formats vidéo évoqués précédemment, vous devez vous assurer que vos images sont visibles par tous vos visiteurs. Cela peut être fait en utilisant l’élément <picture>, qui vous permet de lister plusieurs formats d’image alternatifs par ordre de priorité. Ainsi, même si le navigateur d’un utilisateur ne prend pas en charge un certain format, il peut passer au format spécifié suivant et afficher une image correctement.

 

16) Assurer la visibilité du texte pendant le chargement de la webfont

Tous les propriétaires de sites Web veulent se démarquer avec leurs polices super cool. Le seul inconvénient est que le chargement de ces polices peut prendre trop de temps. Si tel est le cas, le navigateur remplacera votre police par une police de secours (comme Arial ou Times New Roman, par exemple).

 

Comment optimiser?

Ce n’est pas tout à fait un conseil d’optimisation, mais si vous ne voulez pas que votre contenu soit affiché de manière incorrecte, vous devez vous assurer qu’il a l’air convenable avec des polices de secours de base telles que Arial ou Georgia (en particulier sur les appareils mobiles). Après cela, vous pouvez être sûr que les utilisateurs peuvent réellement lire votre contenu et votre page semble appropriée.

 

17) Minimiser le travail sur le fil principal

Lors du téléchargement d’une certaine page, votre navigateur effectue simultanément plusieurs tâches, telles que l’analyse et la compilation de scripts, le rendu, l’analyse HTML et CSS, la collecte de place, l’évaluation de scripts, etc.

 

Comment optimiser?

Parfois, il peut être assez difficile d’obtenir une ventilation de l’emplacement où le temps CPU a été passé à charger une page. Heureusement, avec l’aide de la nouvelle fonctionnalité d’audit de la discussion principale sur le travail principal de Lighthouse, vous pouvez maintenant voir clairement le nombre et le type d’activités qui se produisent pendant le chargement de la page. Cela vous aidera à comprendre les problèmes de performances de chargement liés à la mise en page, à l’évaluation de script, à l’analyse ou à toute autre activité.

 

 

18) Réduire le temps d’exécution de JavaScript

JavaScript est ce qui influence directement les performances de chargement de votre page. C’est pourquoi il est essentiel de réduire le temps nécessaire à l’analyse, la compilation et l’exécution de JavaScript.

 

Comment optimiser?

D’abord et avant tout, vous ne devez envoyer que le code dont vos utilisateurs ont besoin. Essayez de supprimer toutes les données redondantes telles que les commentaires de code et le code inutilisé. Après cela, réduisez autant que possible votre JavaScript et mettez-le en cache pour réduire les déplacements supplémentaires sur le réseau. Les développeurs avancés préfèreront peut-être utiliser des techniques plus complexes telles que le chargement paresseux, le tremblement d’arbre pour supprimer du code ou des fonctionnalités telles que le cache de code V8.

 

19) Implémentation d’une politique de cache

Lorsqu’un navigateur demande une ressource, le serveur qui fournit cette ressource peut le faire stocker par le navigateur pendant un certain temps. Donc, pour toutes les visites répétées, le navigateur utilisera une copie locale au lieu de la récupérer à partir de zéro.

 

Comment optimiser?

Pour contrôler automatiquement le temps et la durée de mise en cache de la réponse par le navigateur, utilisez cache-control.

 

Outre la mise en cache HTTP, la détermination de la durée de vie optimale des scripts (max-age) et la fourniture de jetons de validation (ETag), n’oubliez pas la mise en cache Service Worker, y compris la mise en cache du code V8 susmentionnée.

 

20) Éviter une taille excessive de DOM

Une arborescence DOM trop volumineuse avec des règles de style compliquées peut avoir un impact négatif sur la vitesse, l’exécution et les performances de la mémoire. La meilleure pratique consiste à avoir une arborescence DOM (moins de 1 500 nœuds au total), une profondeur maximale de 32 nœuds et aucun nœud parent avec plus de 60 nœuds enfants.

 

Comment optimiser?

Une très bonne pratique consiste à supprimer les nœuds DOM dont vous n’avez plus besoin. Pour ce faire, envisagez de supprimer les nœuds qui ne sont pas affichés du document chargé et essayez de les créer uniquement après qu’un utilisateur a fait défiler une page ou appuyé sur un bouton.

 

21) Minimiser la profondeur des requêtes critiques

La chaîne de demandes critiques fait partie de la stratégie de chemin de rendu critique (CRP) dont l’idée principale est de hiérarchiser le chargement de certaines ressources et de modifier leur ordre de chargement. Même si la chaîne de demandes critiques est conçue pour télécharger les ressources les plus importantes, elles peuvent quand même être réduites à zéro.

 

 

Comment optimiser?

Malheureusement, il n’y a pas de conseil unique pour réduire au minimum la profondeur des demandes critiques pour votre site (comme pour bon nombre des facteurs énumérés ci-dessus). Cependant, il est toujours bon de minimiser la longueur de vos chaînes, de réduire la taille des ressources téléchargées et, comme toujours, de différer le téléchargement de ressources inutiles.

 

22) Marques et mesures de chronométrage de l’utilisateur

Comme je l’ai déjà mentionné, très souvent, les problèmes de JavaScript sont à l’origine du lent chargement des pages. Et très souvent, les développeurs ont du mal à trouver le point faible exact dans leurs scripts Java. Heureusement, avec l’API User Timing, ce n’est plus un problème. Ce service a pour objectif principal de mesurer les performances JavaScript de votre application afin que vous sachiez quelles parties de vos scripts sont en retard et nécessitent une optimisation.

 

Comment optimiser?

Pour mesurer les performances de votre application, tout ce que vous avez à faire est d’utiliser JavaScript pour accéder aux résultats à l’aide de l’API. Après avoir identifié les domaines à améliorer, allez-y et corrigez-les. Voici un guide pratique pour vous familiariser avec l’API de synchronisation utilisateur.

 

Conclusion

Je sais que ce fut un long article rempli de tonnes de trucs techniques. Cependant, je recommanderais toujours fortement de prendre très au sérieux le côté technique de l’optimisation de la vitesse des pages, car c’est ce qui influence le plus votre score de vitesse. De plus, vous devriez garder un œil sur les mesures réelles de CrUX. Parce que même si vous avez un score de 100 vitesses, votre page Web peut sembler lente aux utilisateurs en raison d’une mauvaise connexion Internet ou d’anciens appareils.

A propos de nous et de ce blog

Nous sommes une entreprise de marketing numérique qui aide ses clients à obtenir d'excellents résultats dans plusieurs domaines clés.

Demander un devis gratuit

Nous proposons des services de référencement professionnels qui aident les sites Web à augmenter considérablement leur score de recherche organique afin de rivaliser pour le classement le plus élevé, même en ce qui concerne les mots clés les plus concurrentiels.

Subscribe to our newsletter!

Les champs marqués avec * sont requis

Retrouvez-nous

Adresse
83 Avenue Abderrahim Bouabid
80000, Agadir

Heures d’ouverture
Du lundi au vendredi : 9h00–17h00
Les samedi et dimanche : fermé

À propos de ce site

Pour commencer, la visibilité de votre site web sur les principaux moteurs de recherche Google , Bing, Yahoo est primordiale pour le développement de votre entreprise. Nos formules de référencement web vos proposent des stratégies ( Search Engine Optimisation ) et référencement naturel Google efficace et innovante. Nous mettons à votre disposition tout notre savoir-faire en web marketing, référencement web Google et redirection de trafic sur différents sites web.

Plus D'Articles SEO

Voir Tous les Articles SEO
Tout sur le RankBrain de Google : le système d’apprentissage automatique

Tout sur le RankBrain de Google : le système d’apprentissage automatique

Tout comme la plupart des mises à jour d'algorithmes de Google, RankBrain…
Lire la Suite
Comment j'ai optimisé le référencement d'un nouveau site Web

Comment j’ai optimisé le référencement d’un nouveau site Web

Est-il difficile de classer un tout nouveau site Web ? Tout dépend…
Lire la Suite
Le Black Hat SEO est une stratégie de référencement naturel (SEO)

Black Hat SEO : Qu’est-ce que c’est et pourquoi vous devriez l’éviter

Black Hat SEO peut sembler être un raccourci pour améliorer votre classement…
Lire la Suite
33 technique du référencement seo on-page

On-Page SEO : Optimiser chaque page sur votre site

pour aider les articles et les pages de blog à gagner en…
Lire la Suite
10 experts en la matière donnent les meilleurs conseils SEO

Contenu Cornerstone : 10 experts en la matière donnent les meilleurs conseils

Lorsqu’il s’agit de développer du contenu pour votre site, vous ne voulez…
Lire la Suite
la recherche sémantique, pourquoi elle est bonne pour le référencement

La Recherche sémantique et sont impact sur votre référencement

Cet article explique ce qu'est la recherche sémantique, pourquoi elle est bonne…
Lire la Suite