Cloudflare Cache Everything améliore WordPress TTFB de 90 %

Publié: 2022-12-03

Cloudflare cache everything fast site load

Vous savez que la vitesse du site est un facteur crucial pour votre blog. Cloudflare cache tout peut vraiment vous aider à accélérer les choses.

Vos visiteurs n'attendront pas plus de quelques secondes que vos pages Web se chargent avant de partir. Google indique clairement que le temps de réponse est un facteur important dans le classement de la recherche. Alors oui, la vitesse compte aujourd'hui pour votre site.

Il est relativement facile d'obtenir des vitesses de chargement de page raisonnables pour le bureau avec WordPress. Mais la vitesse mobile n'est pas aussi facile.

Cependant, il existe un moyen d'améliorer considérablement la vitesse de votre site avec les règles de page Cloudflare.

Dans cet article Masquer
Utilisez-vous Cloudflare ?
Réduire le TTFB
Comment appliquer Cloudflare cache tout
Vérifiez le chargeur de fusée
Un inconvénient et la solution
Mise à jour : Une nouvelle solution bien meilleure
Sommaire

Utilisez-vous Cloudflare ?

La première étape pour améliorer vos temps de réponse côté serveur consiste à faire fonctionner votre site sur un CDN (Content Delivery Network).

Le service le plus populaire est Cloudflare pour la plupart des blogueurs car il est très efficace, fiable et gratuit.

Si vous avez besoin d'ajouter votre site à Cloudflare, ce tutoriel de WP Beginner est un excellent point de départ.

Mais si vous l'utilisez déjà, vous pouvez considérablement améliorer les performances de votre temps au premier octet (TTFB).

C'est l'un des facteurs les plus critiques pour la vitesse de chargement du site.

Dans un article précédent, j'ai écrit sur l'amélioration de la vitesse des pages d'administration WordPress avec trois règles de page.

Mais pour ce correctif, vous devez utiliser la règle Cloudflare cache tout.

Si vous utilisez un compte Cloudflare gratuit, vous n'obtenez que trois règles de page.

Il faudra donc modifier les règles de votre page existante.

Mais cela en vaut la peine.

Réduire le TTFB

Voici quelques exemples de la différence que ces changements peuvent apporter à votre vitesse TTFB.

Les deux images ci-dessous utilisant les outils Chrome Deleveopers vous montrent à quel point vous pouvez améliorer la vitesse de votre mobile.

Le premier n'est pas optimisé et a un TTFB de 1,55 seconde.

TTFB mobile

Vous pouvez voir l'amélioration ici après avoir ajouté la nouvelle règle Cloudflare. Le TTFB n'est plus que de 33,25 millisecondes.

Cloudflare Cache Everything TTFB mobile

Depuis mon compte Freshping, vous pouvez voir les temps de réponse globaux pour les trois sites que j'ai optimisés.

Ils sont 90 % plus rapides que les quatre sites qui ne sont pas encore entièrement mis en cache.

Cloudflare cache everything response times

Comment appliquer Cloudflare cache tout

Avant de vous lancer dans ces changements, un mot d'avertissement.

Cette méthode ne convient que pour un site raisonnablement statique qui ne change pas très souvent.

Ce n'est pas une bonne idée si vous avez un contenu dynamique tel que des widgets changeants, des flux Twitter, des curseurs ou des mises à jour régulières d'informations.

Lorsque vous ajoutez tout le cache à Cloudflare, il fait ce qu'il dit.

Voici comment vous pouvez ajouter cette amélioration de la vitesse du site à partir de votre tableau de bord Cloudflare.

Pour commencer, vous devrez ajouter votre nouvelle règle. Cliquez sur le bouton de l'application de règles de page dans le menu supérieur.

Si vous avez déjà trois règles, vous devrez en supprimer une. Dans mon cas, j'ai supprimé la règle *preview=true*.

new page rule

Ajoutez maintenant votre nouvelle règle de page pour l'URL de votre site Web avec une étoile générique à chaque extrémité.

Ajoutez ensuite ces paramètres de règle.

Cache du navigateur TTL - 1 heure
Niveau de cache – Tout mettre en cache
Edge Cache TTL – 7 jours

Cliquez sur Enregistrer et tout est maintenant défini pour vos en-têtes de contrôle de cache.

Une note importante est de vérifier et de vous assurer que vous ordonnez vos règles comme dans l'image ci-dessus.

Votre règle de cache de site doit venir après vos règles wp-login et wp-admin pour protéger le contrôle du cache d'origine de vos pages d'administration.

Vous devez également vérifier les paramètres de cache de votre navigateur Cloudflare pour vous assurer que vous avez sélectionné Respecter les en-têtes existants.

cache du navigateur ttl

Vérifiez le chargeur de fusée

Vous pouvez également vérifier si vous utilisez Rocket Loader de Cloudflare.

Quand ça marche, ça marche extrêmement bien, mais ça peut aussi casser votre site. Je l'ai en cours d'exécution sur deux sites, et tout va bien.

Mais sur un autre site, cela cause des problèmes, alors je l'ai désactivé.

Une fois que vous avez vérifié que tous les paramètres sont corrects, rendez-vous sur votre site pour voir si tout fonctionne comme prévu. Il devrait se charger presque instantanément maintenant.

Vérifiez ensuite la vitesse de votre site avec Google Page Speed ​​Insights, GTMetrix ou Pingdom pour voir l'amélioration.

Votre objectif doit être inférieur à 200 ms pour TTFB et inférieur à 2 secondes pour une charge complète.

Voici une capture d'écran du temps de chargement d'un de mes sites sur GTMetrix. Vous pouvez voir qu'il est complètement chargé en seulement 0,6 seconde.

page load time

Un inconvénient et la solution

Étant donné que tout sur votre site est désormais mis en cache, les modifications que vous apportez ne prendront effet qu'une fois le cycle de cache effacé.

Cela peut prendre beaucoup de temps.

Par conséquent, lorsque vous ajoutez un nouveau message ou modifiez un message existant, vous ne verrez pas les modifications. Cela s'applique également aux nouveaux commentaires sur votre site.

Le seul moyen de contourner cela est d'installer le plugin Cloudflare.

Je n'aime pas ajouter plus de plugins, mais celui-ci est essentiel pour ce correctif de vitesse.

Une fois que vous l'avez ajouté, activez la gestion automatique du cache.

Il va maintenant purger les fichiers individuels que vous créez ou modifiez, puis mettre en cache les nouveaux fichiers de votre serveur Web d'origine.

Depuis le plugin, vous pouvez également purger l'ensemble de votre site. Mais cette action augmentera votre temps de chargement.

Il est préférable de suspendre votre site Web sur Cloudflare si vous souhaitez contourner les problèmes de cache pour enquêter sur les problèmes.

Le bouton sur lequel vous ne devriez vraiment pas cliquer est Optimiser Cloudflare pour WordPress.

Si vous le faites, cela modifie de nombreux paramètres qui peuvent ne pas être souhaitables pour vous. Celles-ci incluent la réduction de HTML, javascript et CSS et également la modification de vos paramètres d'en-tête existants.

Mise à jour : Une nouvelle solution bien meilleure

Depuis la rédaction de cet article, il existe désormais un nouveau plugin WordPress gratuit qui résout presque tous les problèmes avec Cloudflare Cache Everything.

Super Page Cache for Cloudflare

Super Page Cache pour Cloudflare est facile à installer et vous donne beaucoup de contrôle.

Le plugin vous aide à mettre en cache non seulement les fichiers statiques (par exemple, CSS, JS, images, etc.), mais également les pages Web HTML générées par WordPress, à la fois au niveau du disque du serveur et sur le CDN Cloudflare global.

Je l'ai installé sur un de mes sites, et cela a fonctionné parfaitement. Le TTFB est passé de près d'une seconde à moins de 0,2 seconde.

speed results

Il est comparable à Cloudflare APO, qui n'est pas un service gratuit.

Mais si vous utilisez un compte Cloudflare gratuit, ce plugin gratuit fera presque tout ce qu'APO peut faire.

J'utilise ce plugin de mise en cache sur Just Publishing Advice, et il permet d'obtenir facilement un excellent résultat Core Web Vitals.

Google Page experience mobile

Vous pouvez vérifier n'importe quelle page de ce site avec PageSpeed ​​Insights ou GTMetrix pour voir à quel point tout fonctionne correctement.

Je serais surpris si vous n'obteniez pas un résultat tout vert.

GTmetrix JPA site perfomance

Si vous souhaitez améliorer votre vitesse de chargement et Core Web Vitals, cela vaut vraiment la peine d'y jeter un coup d'œil.

Sommaire

Cloudflare Cache Tout fonctionne très bien et accélérera énormément votre site. Il est particulièrement efficace pour améliorer la vitesse du site mobile.

Mais ce n'est pas pour tous les sites, et il peut y avoir des inconvénients en fonction de votre thème, de vos fonctionnalités et de la conception de votre site.

Cette méthode de mise en cache est très agressive, alors revérifiez tout.

Idéalement, vous devriez l'essayer sur un site intermédiaire ou sandbox pour vous assurer que votre site fonctionne sans aucun problème.

Si vous l'implémentez sur votre site en ligne et rencontrez des problèmes, vous pouvez toujours supprimer la règle de page. Ensuite, purgez complètement votre site sur Cloudflare.

Vous serez alors de retour à votre point de départ.

Si vous avez besoin d'aide, il existe de nombreuses entrées sur le support Cloudflare concernant le contenu statique du cache et tout le cache.