Après notre refonte, WPBv4, nous avons passé du temps à optimiser les performances (il reste encore du travail à faire). Après quelques optimisations, nous avons constaté une amélioration majeure des performances du site. C’était assez visible pour que nos utilisateurs nous envoient des e-mails à ce sujet. Nous avons entendu vos demandes, et un guide complet sur ce que nous avons fait pour accélérer notre site sera disponible très bientôt. Même si nous avions expliqué comment installer MaxCDN dans notre tutoriel sur W3 Total Cache, nous avons apporté quelques modifications supplémentaires depuis lors. Dans cet article, nous allons vous montrer comment installer et configurer MaxCDN dans WordPress.
Voici l’e-mail que nous avons reçu d’un de nos utilisateurs :
« … la raison principale pour laquelle je vous contacte est de vous poser des questions sur la vitesse du site. Comment diable parvenez-vous à accélérer votre site si rapidement ? La vitesse est folle et j’ai tout simplement adoré ça.
Nous avons fait de nombreux tests à l’aide d’un site appelé Pingdom. Le temps de chargement le plus rapide de notre page d’accueil n’était que de 483 ms. Nous avons effectué le test plusieurs fois (heures et centres de données différents). Notre plage de temps de chargement sur la page d’accueil était de 483 ms à 1,7 s. Ci-dessous l’une des captures d’écran :
Beaucoup a été consacré à l’optimisation des performances (réduction des requêtes HTTP telles que le chargement de scripts uniquement lorsqu’ils sont nécessaires, combinaison de scripts et de feuilles de style, optimisation des images, etc.). Mais l’un des principaux composants qui accélère le chargement de notre site Web et nous empêche de planter est un excellent CDN WordPress. Nous utilisons MaxCDN, et vous pouvez consulter notre revue MaxCDN dans notre section Blueprint où nous expliquons pourquoi nous utilisons MaxCDN. Si vous ne savez pas ce qu’est un CDN ou pourquoi vous avez besoin d’un CDN, vous devriez consulter ou consulter l’infographie « Qu’est-ce qu’un CDN ».
Cela dit, pour suivre ce tutoriel, vous DEVEZ avoir un compte MaxCDN. C’est très abordable et vaut bien l’argent. Si vous n’avez pas de compte, vous pouvez vous inscrire maintenant. Vous pouvez obtenir 25% de réduction en utilisant notre coupon MaxCDN « wpbeginner »
Didacticiel vidéo
Si vous n’aimez pas la vidéo ou avez besoin de plus d’instructions, continuez à lire.
Une fois que vous avez créé votre compte avec MaxCDN, vous devez installer ce plugin WordPress gratuit appelé W3 Total Cache.
La première chose que vous devez faire est de vous connecter à votre compte MaxCDN et de créer une « Pull Zone ». Pour ce faire, cliquez sur le bouton Gérer les zones, puis cliquez sur l’icône « Créer une zone d’extraction ».
Sur la page suivante, il vous sera demandé d’entrer les détails de votre nouvelle zone Pull.
- Nom de la zone d’extraction : il peut s’agir de n’importe quoi sans espaces, d’au moins 3 caractères. Considérez cela comme votre nom d’utilisateur.
- URL du serveur d’origine : entrez l’URL de votre blog wordpress. Doit contenir « http:// » et la barre oblique finale (/).
- Domaine CDN personnalisé : utilisez n’importe quel sous-domaine, par exemple : cdn.wpbeginner.com
- Libellé : C’est comme un champ de description. Il est facultatif d’ajouter une description.
- Compression : nous vous recommandons de l’activer car cela économisera l’utilisation de la bande passante sur votre compte.
Une fois que vous avez cliqué sur créer, vous verrez un écran de réussite. Dans cette case verte, vous aurez une URL pour votre CDN. Cela ressemblera à quelque chose comme « wpb.wpbeginner.netdna-cdn.com ». Copions cette URL et enregistrons-la dans votre bloc-notes. Nous aurons besoin de l’utiliser dans les étapes ultérieures. Si vous allez sur votre tableau de bord, vous verrez maintenant la zone que vous avez créée. Cliquez sur l’icône « gérer ».
Ensuite, vous devez cliquer sur l’onglet « Paramètres » et regarder les domaines personnalisés.
L’objectif ici est d’ajouter plusieurs sous-domaines (CNAME), afin d’améliorer les performances de pipelining dans le navigateur. Pour ce faire, cliquez sur le bouton Modifier sur les domaines personnalisés et ajoutez simplement plusieurs domaines personnalisés.
Une fois que vous avez ajouté les sous-domaines personnalisés, cliquez simplement sur mettre à jour. Dans les paramètres de compression, assurez-vous d’activer la compression GZip.
Maintenant que vous avez configuré votre zone d’extraction, prenez la longue URL CDN que vous avez obtenue lors des étapes précédentes, qui ressemblait à ceci « wpb.wpbeginner.netdna-cdn.com ». Nous en aurons besoin pour définir des enregistrements CNAME. Nous allons vous montrer comment créer l’enregistrement CNAME à l’aide de cPanel. La plupart des hébergeurs WordPress utilisent cPanel. Connectez-vous à votre cPanel, puis faites défiler jusqu’à la section Domaines et cliquez sur Éditeur de zone DNS simple.
Sur cette page, vous devrez remplir les champs pour ajouter un enregistrement CNAME. Les deux valeurs que vous devrez remplir sont : Name et CNAME.
- Nom: Il s’agit du nom de votre domaine CDN personnalisé. Par exemple, notre domaine CDN personnalisé est cdn.wpbeginner.com, nous mettrons donc « cdn » dans notre champ de nom.
- CNAME : Cette URL vous sera fournie par MaxCDN lors de la création de la zone d’extraction. Par exemple : « wpb.wpbeginner.netdna-cdn.com ».
Exemple de capture d’écran :
Répétez ce processus pour tous les domaines personnalisés que vous ajouterez. La valeur CNAME sera la même. Tout ce que vous changez est le nom comme « cdn », « cdn2 », etc. L’ajout de la méthode CNAME peut être différent si vous avez un hôte non cPanel.
Maintenant que vous avez configuré MaxCDN, allons-y et intégrons-le à WordPress. Nous devrons utiliser le plugin W3 Total Cache. Installez et activez le plugin. Sur l’écran Général, si vous faites défiler vers le bas, vous verrez la boîte CDN. Activez CDN et sélectionnez l’option NetDNA/MaxCDN.
Enregistrez les paramètres. Maintenant, vous devrez aller dans le menu CDN dans W3 Total Cache pour configurer MaxCDN avec WordPress. Cette page vous demandera d’entrer votre ID API, votre clé API et vos noms de domaine personnalisés.
Vous pouvez obtenir votre ID API et votre clé à partir de votre tableau de bord MaxCDN. Si vous allez Gérer le compte »API. Cliquez sur ajouter une clé et créez votre clé.
Une fois que vous avez configuré la partie W3 Total Cache, vous êtes prêt à partir. Vous pouvez cliquer sur le bouton Test NetDNA et vous devriez pouvoir faire passer le test.
Vous voulez accélérer votre WordPress ? Eh bien, nous vous recommandons de commencer à utiliser un service CDN comme MaxCDN. Utilisez le coupon MaxCDN « wpdébutant » pour bénéficier de 25 % de réduction.