Cet article est initialement paru sur Le blog de WP Rocket et a été publié ici avec permission.
Astra est l’un des thèmes les plus populaires et les plus légers parmi lesquels vous pouvez choisir sur WordPress.
Si vous avez déjà essayé d’optimiser les performances de votre site, vous savez à quel point il est difficile de répondre aux recommandations de PageSpeed Insights telles que « Réduire le temps d’exécution de javascript » et « Éliminer les ressources bloquant le rendu« . Nous vous sentons !
Voici pourquoi nous vous racontons l’histoire de Rick Orford, un propriétaire d’entreprise qui a réussi à accélérer son site construit avec Astra. Il a réalisé 99 PageSpeed Insights mobiles et a boosté les Core Web Vitals. Ça sonne bien, non ? Nous savons tous que le score de performance mobile est le plus difficile à optimiser.
Alors, il est temps d’en savoir plus sur son défi de performance !
Table des matières
Lancer un nouveau site Web et négliger quelque chose de crucial
En 2020, Rick Orford a lancé son site Web en devenant financièrement indépendant — une ressource complète pour ceux qui cherchent à épargner davantage, à gagner plus et à rembourser rapidement leurs dettes. En tant que site éditorial avant tout, la stratégie d’acquisition de contenu la plus pertinente a toujours placé le SEO au premier plan.
Dézoomer: vous savez probablement déjà à quel point le référencement est crucial pour votre trafic et vos revenus et comment le Mise à jour de l’expérience de la page peut affecter votre performance organique.
Après que Google a annoncé le déploiement de Core Web Vitals
Le LCP mesure le temps nécessaire pour que le plus grand élément se charge et devienne visible
« Comme de nombreux sites WordPress qui sont rapidement mis en place, nous n’avons pas pris en compte les temps de chargement lors du déploiement initial », explique Rick. « Comme le SEO est rapidement devenu un facteur clé pour notre modèle d’affaires, il était temps de commencer à optimiser les performances du site et les scores Core Web Vitals« , ajoute-t-il. Il craignait vraiment que le classement du site ne s’aggrave plutôt que de s’améliorer. Et il avait de bonnes raisons d’y croire.
La fonctionnalité JavaScript retardée comme point tournant
Rick n’a pas commencé à utiliser WP Rocket tout de suite. Au début, son équipe utilisait unautre plugin de mise en cache. Cependant, « l’assistance a toujours été un problème », explique-t-il. Et tout le monde sait comment un support expert et amical fait toute la différence pour les clients.
Alors, Rick a continué à chercher la bonne solution à ses besoins. Il souhaitait une performance de haute qualité, ainsi qu’un excellent support client. Pouvez-vous lui en vouloir ?
C’est là que WP Rocket entre en jeu. « WP Rocket s’est avéré être la bonne solution mature pour la mise en cache », déclare Rick.
Ce qui a fait la différence
En fait, le tournant de sa décision a été la possibilité de retarder le chargement des fichiers JavaScript jusqu’à ce que l’utilisateur interagisse facilement. Ce n’est pas un hasard si retarder les fichiers JavaScript aide à réduire le temps de chargement et améliorer LCP – la métrique Core Web Vital que Rick visite à améliorer en premier lieu.
Dézoomer: Lighthouse —
Retour à Rick : « Nous avons également aimé la possibilité de télécharger un fichier de configuration des paramètres actuels. De cette façon, si nous commettons une erreur, nous pourrons toujours revenir à une version précédemment enregistrée », ajoute-t-il. Une option plutôt pratique, non ?
Enfin, Rick a décidé d’acheter WP Rocket grâce à la période de remboursement généreuse qui atténuait tout risque. Au cas où vous vous poseriez la question, nous vous remboursons si vous en faites la demande
Bonjour ! Je m’appelle Sujay et je suis PDG d’Astra.
Nous avons pour mission d’aider les petites entreprises à se développer en ligne avec des produits logiciels abordables et la formation dont vous avez besoin pour réussir.
Laissez un commentaire ci-dessous si vous souhaitez rejoindre la conversation, ou cliquez ici si vous souhaitez une aide personnelle ou pour vous engager avec notre équipe en privé.
Comment optimiser le thème d’Astra avec WP Rocket
Passons maintenant aux détails de l’optimisation des performances. Rick a partagé les paramètres sur lesquels il a travaillé pour obtenir un excellent score de performance avec le thème Astra. Son équipe a passé environ 100 heures à faire fonctionner toutes les pièces au mieux. Il a donc partagé avec nous une information assez précieuse – et il est prêt à répondre à d’autres questions si vous souhaitez entrer en contact aveclui.
Les outils
Commençons
- Cloudflare (y compris l’enregistrement de domaine)
- Serveur Amazon EC2
- Panneau de configuration Plesk (Ubuntu)
- Serveur Web Apache et Nginx
- Mysql et Redis pour la mise en cache
- WordPress 5.7 avec Gutenberg
- Astra 3
- Qubely (Pour afficher les publications en vedette sur notre page d’accueil)
- Le CDN gratuit de Jetpack pour gérer l’hébergement d’images
- WP Rocket.
Ces paramètres ont été obtenus à 99% du chemin. Les modifications CSS personnalisées ont fourni le coup de circuit.
Les paramètres WP Rocket mis en œuvre
Les paramètres activés avec WP Rocket sont les suivants :
Cache des onglets :
- Activer la mise en cache pour les appareils mobiles
- Durée de vie du cache : 10 heures
Onglet Optimisation des fichiers :
Tout a été vérifié.
Pour vous donner un peu de contexte, l’onglet Optimisation des fichiers vous permet de minifier les fichiers CSS et JS, d’optimiser la livraison CSS, de retarder l’exécution de JavaScript et de charger JavaScript de manière différée. En anglais simple, c’est le moyen d’éliminer les ressources bloquant le rendu et de s’attaquer au temps d’exécution de JavaScript. Et ça marche – vous pouvez parier!
L’onglet Optimisation des fichiers
Onglet Médias :
- Lazyload – Activer pour les images, les iframes et les vidéos
- Remplacer l’iframe YouTube
Onglet Préchargement :
- Activer le préchargement
- Activer le préchargement du cache basé sur le plan du site
- Plan du site XML Yoast SEO
Onglet Heartbeat :
- Control Heartbeat (cela permet d’économiser certaines des ressources de votre serveur).
Onglet Modules complémentaires :
- Nuageux.
La règle des 80/20 pour l’optimisation des performances
Après avoir examiné les paramètres, nous avons demandé à Rick de partager le conseil le plus important à garder à l’esprit lors de l’optimisation des performances du site.
« Faites attention à la règle des 80/20 », a-t-il répondu. « 20 % de vos modifications pourraient vous permettre d’atteindre 80 % du chemin. Pour nous, cela signifie héberger notre blog sur notre propre serveur AWS EC2, en utilisant Cloudflare, Apache & Nginx, WordPress et WP Rocket. Pour WP Rocket, en particulier, je recommande de le connecter avec Cloudflare, Minifying & Combining CSS, et assurez-vous de différer le chargement du fichier .js”.
Load Deferred Javascript est également une fonctionnalité puissante
Chargement JavaScript différé a été l’une des principales caractéristiques de WP Rocket pour obtenir un score de performance exceptionnel.
« Différer JavaScript a changé la donne pour nous« , explique-t-il. Comme nous l’avons mentionné ci-dessus, en différant leschargements JavaScript, vous supprimez les fichiers JS qui bloquent le rendu. En conséquence, le score LCP s’améliorea.
De plus, Rick avait raison sur la possibilité de sauvegarder et de restaurer la configuration de WP Rocket. « Cela a permis à l’équipe de tester et de retester les configurations jusqu’à ce que nous soyons satisfaits », dit-il. Et cela en valait la peine – continuez à lire!
Le résultat époustouflant du PSI et ce qu’il implique
Grâce aux paramètres mis en place, le site d’Éric a obtenu un score PageSpeed mobile de 99.
Tous les Core Web Vitals sont désormais verts, et comprennent le score le plus délicat de Largest Contentful Paint :
Le score Mobile PSI – Page d’accueil
« WP Rocket joue un rôle essentiel
Avant d’optimiser le site avec WP Rocket, notre score PageSpeed Insights sur mobile était terrible à 23 et environ 60 pour ordinateur. Maintenant, nous obtenons un score presque parfait de 100 sur chacun pour notre page d’accueil, et près de 100 sur nos articles », ajoute-t-il.
Grâce aux excellents résultats de performances Web, le site fonctionne désormais à une vitesse optimale. L’équipe d’Éric peut désormais consacrer 100 % de son temps à créer du contenu engageant et à se concentrer sur la partie cruciale de l’entreprise.
« Un grand merci à WP Rocket pour avoir rendu cela possible», dit Ric. « Si vous envisagez WP Rocket, allez-y et faites l’achat. Mais ne vous contentez pas de me croire sur parole – vérifiez Les critiques incroyables de WP Rocket! », termine-t-il.
À vous de jouer : commencez à optimiser votre site dès aujourd’hui
Il est temps de commencer à optimiser les performances de votre site. J’espère que vous avez trouvé de l’inspiration et des conseils précieux
Et peut-être que vous nous raconterez un jour votre histoire de performance Web réussie. WP Rocket est le moyen le plus simple d’améliorer votre score PageSpeed Insights et vos notes Core Web Vitals — et maintenant il est temps de le réaliser !
Auteur: Valentina Orlandi
Valentina est la spécialiste du marketing de contenu chez WP Rocket. Elle aime le marketing, la psychologie numérique et comprendre le pourquoi des comportements humains. C’est une lectrice passionnée et toujours désireuse de travailler avec les mots.
