Comment réduire les requêtes http et augmenter la vitesse du site sur WordPress

Votre site WordPress fonctionne – t – il lentement? Le problème peut être dû à un trop grand nombre de requêtes http. Réduire le temps de chargement des pages Web en réduisant les demandes http peut accélérer l’accès des utilisateurs au contenu et affecter leur expérience globale de navigation sur le Web. La vitesse de chargement des pages est importante et influe directement sur la façon dont les utilisateurs se sentent à l’aise avec l’application ou le site Web. Mais qu’est – ce qu’une requête HTTP? Combien de pages doivent être faites? Combien de demandes traitez – vous actuellement? Restez à l’écoute: dans cet article, nous définissons les requêtes http, expliquons pourquoi elles sont importantes, comment les mesurer et comment les maintenir à un niveau inférieur.
Qu’est – ce qu’une requête HTTP? Http est un Protocole de communication utilisé pour fournir du contenu et des données (fichiers HTML, css, images, vidéos, etc.) Sur Internet. Le World Wide Web est un vaste endroit où beaucoup d’informations sont hébergées sur des serveurs, n’est – ce pas? Pour accéder à ce contenu, le navigateur doit envoyer une demande et recevoir une réponse. S’il n’y a pas de demande, il n’y a pas de communication valide entre vous et le serveur. Les requêtes http peuvent également être considérées comme le niveau de communication entre l’utilisateur et le serveur. Le message envoyé par le client est appelé http (Hypertext Transfer Protocol), ce qui permet de diviser efficacement le message de demande en trois parties: la ligne de demande, l’en – tête et le corps. Comme vous pouvez le voir, chaque fois que vous visitez un site, vous envoyez des requêtes http pour voir le contenu. Par conséquent, plus vous envoyez de requêtes http sur la page, plus il faut de temps pour charger. Vous vous demandez peut – être combien de requêtes http sont « trop » de requêtes http? Regardons quelques chiffres clés pour savoir où placer votre site WordPress: performances exceptionnelles: ot
Verrouillez le temps de rendu et de chargement des ressources. Par conséquent, la réduction du nombre de requêtes http est essentielle pour accélérer les pages. Moins un site Web fait de requêtes http, plus le contenu le plus important (LCP) est chargé rapidement pour les utilisateurs.
Il est résumé comme suit:

Beaucoup de fichiers sur le site WordPress? → avez – vous reçu de nombreuses demandes http pour des fichiers volumineux et lourds? → obtenir des requêtes http plus longues requêtes http plus longues → augmenter le temps de chargement réel pour réduire les requêtes http → avoir un impact positif sur LCP

Gardez à l’esprit que si les utilisateurs ont un accès plus rapide à votre contenu, vous augmenterez leurs chances de rester sur la page et d’interagir avec votre site. L’interaction signifie aussi qu’ils peuvent acheter vos produits… Non seulement vous éviterez la frustration des visiteurs, mais Google aimera votre site. Cela soulève la question clé suivante: Combien de requêtes http ont été envoyées par votre site WordPress?
Comment tester et mesurer les requêtes http d’un site il existe des outils en ligne pour simuler les requêtes http sur un site WordPress, à savoir: gtmetrix (vous avez besoin d’un compte gratuit pour accéder aux détails de votre page): il suffit d’entrer l’url de votre site, d’examiner et d’ouvrir l’onglet sommaire. Faites défiler vers la dernière section intitulée détails de la page pour voir combien de demandes votre page fait.

Trouver le total des demandes de page – Source: l’onglet déroulant gtmetrix est un bon moyen de voir le temps consacré à une seule demande http sur votre site: Demande et temps de chargement – Source: gtmetrix vous pouvez également voir les demandes http à partir de plug – ins spécifiques, tels que elementor:

Identifier les fichiers les plus lourds par plug – in – Source: gtmetrix

Gtmetrix utilise la technologie Lighthouse. Si vous souhaitez en savoir plus sur le phare KPI, nous avons un tutoriel détaillé qui met en évidence comment
En termes simples, si vos visiteurs ne défilent pas vers le bas, l’image à la fin de la page ne sera même pas téléchargée. En raison de la lenteur du chargement, vous pouvez réduire le nombre de requêtes http parce que vous ne chargez que les images au – dessus de l’effondrement. Implémenter manuellement un script de chargement lent: Tout d’abord, vous devez déterminer comment télécharger l’image: vous utilisez des balises

Ou CSS? Réticulum Il doit bien expliquer comment implémenter un script de chargement lent pour les deux méthodes. Vous devez également utiliser l’API intersection Viewer pour vérifier si le projet est dans la fenêtre. Voici comment le chargement différé est affiché sur l’image et l’iframe, respectivement:

Appliquer automatiquement le script en utilisant le plug – in de chargement lent: WP Rocket lazy load (free): afficher le contenu seulement lorsque l’utilisateur est visible. Rocket WP: avec fonction de chargement différé. Il s’agit d’un plug – in avancé qui offre de nombreux autres avantages tels que la mise en cache, le nettoyage de code, etc.) Si vous cherchez d’autres plug – ins pour retarder le chargement, consultez notre article. Minimiser l’impact HTML, css et Javascript: minimiser le code signifie supprimer les espaces inutiles, les commentaires et les caractères supplémentaires du fichier pour atténuer l’impact du fichier. Cette technique peut être appliquée aux fichiers Javascript, css et HTML. Bien sûr, il s’agit de nettoyer le Code qui n’est pas important pour l’utilisateur final.

Exemple JS non animé

Minimiser les échantillons JS Minimisez manuellement le Code: téléchargez une copie du fichier du serveur pour l’enregistrer sur votre ordinateur avant de l’éditer pour vous assurer qu’il est sécurisé. Réduire au minimum le HTML: ouvrir la table de code et supprimer les commentaires ), Minimiser CSS: supprimer les espaces supplémentaires et les commentaires (\/ *… * \/) du fichier CSS réduire au minimum l’id, la classe ou le nom de la variable minimiser js: supprimer les commentaires JS (\/ \/)
UG dans le moniteur de requête peut être utilisé pour identifier les plug – ins qui endommagent votre site et vous aider à les supprimer Utilisez le plug – in Query Monitor pour identifier le plug – in lent – Source: onlinemediamaster 7. Charger des scripts seulement si nécessaire (et seulement sur des pages spécifiques) Impact: une autre façon de réduire les requêtes http est de désactiver sélectivement les scripts et les plug – ins dans des pages \/ messages spécifiques qui n’ont pas besoin d’être chargés. Utilisez le plugin wordpress pour charger les scripts seulement si nécessaire: perfmatters: vous permet de désactiver les scripts sur les pages ou les messages. Choisissez où exécuter le script sans utiliser l’outil de gestion de script – vue globale de la source: perfmatters Asset Cleanup pro – ce n’est pas intuitif, mais vous pouvez aussi le faire. Nettoyage des ressources pro 8. Réduire l’impact des scripts externes \/ requêtes http: le chargement moyen de chaque script tiers est une requête HTTP supplémentaire du navigateur qui réduit les performances de la page (Voici comment réduire l’impact des scripts tiers). Le suivi de toutes les intégrations de tiers est essentiel pour comprendre quelles ressources externes ralentissent le site. Nous avons expliqué comment réduire les requêtes http. Ne laissons pas le monde extérieur nous influencer, d’accord? Trop de requêtes http forcent souvent la ressource à se rétablir du réseau et nous ne voulons pas qu’elle affecte notre performance. Les scripts externes proviennent principalement de l’onglet Google Analytics, des pixels Facebook, des vidéos YouTube, des boutons de partage social et des onglets de test A \/ B. Nous vous recommandons fortement d’identifier tous les fichiers que vous ajoutez à la demande. Utilisez des outils pour identifier les scripts externes lourds: des outils de performance tels que chrome devtools, PageSpeed Insights et webgettest peuvent vous aider à les identifier. Identifier les scripts externes qui ralentissent mon site – Source: Chrome
Si vous n’avez jamais effectué de contrôle de performance auparavant, consultez notre guide détaillé pour tester les performances et la vitesse du site WordPress.

Nous utiliserons gtmetrix pour mesurer les KPI suivants: niveau de performance global (A à f) score de la clé Web de base (LCP, CLS et fid) + TTI et TBT (Remarque: si fid n’est pas disponible, nous mesurerons FCP) Nombre de requêtes http (nombre total de requêtes de page) en termes de contenu, mon site WordPress contient du texte, quelques icônes de médias sociaux, 8 images, vidéos intégrées sur YouTube, Une carte avec code PIN (de Google Maps) et 3 références clients avec photo.

Test site scenario 1: http Performance and request Metrics: No WP Rocket regardons les résultats de performance avec gtmetrix. Ils ne sont pas très encourageants et ma note globale de rendement est « e »:

Détails de la page (taille de la page et requêtes HTTP) – Source: gtmetrix

KPI

Et

Le rapport général est de niveau E (pas de Rocket WP) – gtmetrix nous avons remarqué que ma page a envoyé 140 requêtes http, dont 42,9% ont été causées par JS. Le chargement complet de ma page prend 10,2 secondes et la taille de la page est de 5,11 Mo.
Score (pas de fusée WP)	Niveau global gtmetrix

Performance 55% La plus grande peinture joyeuse (LCP) 2,7 secondes Primo content paint (FCP) 2.4s

Déplacement cumulatif de la disposition (CLS)

0,53 MS

Temps d’interaction (TTI)

3,6 secondes Temps total de verrouillage (TBT)

51 MS

Temps jusqu’au premier octet (ttfb)

806 MS

Temps de pleine charge

10,2 secondes

Taille de la page

5,11 mo

Nombre total de demandes de pages

140 (meilleure note dans la même catégorie:

Les principales recommandations de gtmetrix sont les suivantes: charger efficacement un JS tiers (voir JS, établir une connexion précoce à la source requise et appliquer un chargement différé à Ri)
Intégrer des sor tiers) Supprimer les ressources de blocage de rendu (envisager de fournir des CSS et des JS critiques en ligne et reporter tous les styles \/ styles JS non critiques. En savoir plus sur les CSS critiques dans cet article) Optimiser mon code (combiner et minimiser JS et CSS \/ optimiser la livraison CSS) implémenter la Mise en cache de page

Problèmes signalés par gtmetrix lors de la vérification de mon site devinez quoi? C’est exactement ce que Wp Rocket peut faire (et d’autres choses) pour votre site WordPress. Dans le scénario 2, nous activerons WP Rocket et vérifierons à nouveau la santé du site. Les bonnes choses arrivent. Scénario 2 – mesurer la performance http et les requêtes – utiliser WP Rocket maintenant WP Rocket est activé, nous allons lancer une autre vérification de performance en utilisant la même page. Cette fois, les résultats sont très encourageants et ma note globale de rendement est passée de « e » à « A »:

Mon nouveau score \ Leave a Reply Cancel reply Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec * Enregistrer mon nom, mon e-mail et mon site dans le navigateur pour mon prochain commentaire. Comment configurer le blog e – mail WordPress? Comment se connecter à Google Sheets et WordPress: fiches techniques, formulaires, woocommerce, etc. Comment construire une communauté pour le marché en ligne? 30 meilleurs tutoriels graphiques Adobe illustrator 12 plugins wordpress pour gagner de l’argent pour votre site WordPress Copyright © 2024 Qoxag. All Right Reserved.