Ressources WordPress: Comment servir correctement les fichiers statiques
L’un des aspects les plus négligés de l’optimisation des ressources WordPress n’a rien à voir avec wordpress lui – même; Il s’agit de la façon dont nous fournissons des ressources statiques aux navigateurs des visiteurs. Qu’est – ce qu’une ressource WordPress? Nous utilisons le terme Assets pour décrire tous les fichiers statiques que le serveur Web envoie aux visiteurs, qui sont divisés en trois types: Javascript, feuilles de style et images. Les deux premiers sont généralement mis en file d’attente dans nos plug – ins et thèmes, tandis que le second est chargé par la médiathèque. Mais d’abord, un mot sur la corruption de cache lorsque nous visitons le site, le serveur retourne d’abord le HTML généré par WordPress, puis toutes les ressources déclarées dans le HTML, généralement à partir d’un fichier CSS, puis l’image qui apparaît dans le contenu ou qui est insérée par CSS, si le thème est développé correctement, et Enfin le fichier javascript, Parce qu’ils sont les derniers contenus (en file d’attente) dans la source.
Cela signifie que pour chaque chargement de page que vous voyez à l’écran, votre navigateur doit faire entre 10 et 100 requêtes, chacune étant un aller – retour de votre navigateur au serveur. Ainsi, sur un serveur Web non optimisé, si vous Rafraîchissez la page, tout le processus se répète encore et encore. En plus du temps total qu’il faut à chaque requête pour rendre complètement la page à l’écran, cela affecte également le serveur, car il doit traiter toutes ces requêtes à plusieurs reprises. Pour éviter cela, le serveur Web permet aux administrateurs de définir ce que nous appelons un en – tête expiré. Il s’agit d’un petit morceau d’information qui indique au navigateur quand un fichier particulier reste inchangé. Par conséquent, si nous le définissons à + 2 jours, cela signifie que le navigateur enregistrera le fichier dans son cache et lorsque vous mettez à jour la page, il extraira le fichier au lieu de contacter le serveur jusqu’à ce que le temps expire
25% ion! Selon la taille et la complexité du CSS, vous pouvez économiser jusqu’à 40% ou plus. De plus, si vous fusionnez ces fichiers, vous pouvez enregistrer plusieurs requêtes pour les visiteurs. Site Web plus rapide! Bien sûr, l’opération manuelle n’est pas la meilleure solution, donc il y a deux solutions: utiliser un gestionnaire de tâches comme Grunt ou gulp pour utiliser des plug – ins même si vous créez votre propre CSS simplifié pour votre sujet en utilisant un gestionnaire de tâches (j’a i écrit une idée pour le flux de travail gulp), vous pouvez utiliser des plug – ins qui contiennent des ressources non minces. Cela signifie que le seul moyen est d’utiliser des fils.
Attention: l’activation de n’importe quel plug – in d’optimisation est susceptible de détruire votre site, donc essayez d’abord dans l’environnement de mise en scène! Si vous avez suivi mon précédent tutoriel WP Rocket, l’activation de l’optimisation est simple, il suffit d’accéder aux paramètres et de sélectionner les deux cases à cocher suivantes: WP Rocket minimise les paramètres sinon, la plupart des autres plug – ins de cache (comme W3 total cache) le supporteront immédiatement, mais personnellement, je ne l’aime pas beaucoup, donc je recommande deux autres plug – ins pour faire le travail: Mini et mini – Yui. Ils ne sont pas dans le dépôt officiel et exigent que votre serveur ait Java installé, mais c’est bien. SSH, puis saisissez la commande suivante (assurez – vous d’entrer le bon chemin vers le répertoire plug – in!):
$ Sudo APT get – y installe git openjdk – 6 – JRE $CD ~ \/ www \/ www.wp-kickstart. Com \/ WP content \/ plug – in $GIT clone https:\/\/github.com\/kasparsd\/minit $GIT clone https:\/\/github.com\/bjornjohansen\/minit-yui.git Connectez – vous maintenant à WordPress, activez les deux plugins et regardez ce qui se passe de façon magique! Malheureusement, minit n’a aucun type d’écran de configuration, donc si vous devez exclure certains fichiers de la minimisation, tels que les dessins
Tampon IP \ U 16 8K; Niveau Gzip \ u comp \ u 9; Gzip \ u http \ u version 1.0; Gzip _ Min length 0; Gzip _ type text \/ Plain text \/ CSS image \/ X – icon image \/ SVG + XML image \/ PNG image \/ JPG image \/ JPEG text \/ JS text \/ PHP application \/ javascript application \/ X – JavaScript; Gzip _ change avec le temps; Gzip _ proxy Expired without cache without Storage Private Authentication; Gzip _ Disable \
Ou, si vous utilisez Apache, utilisez le fragment de code recommandé par Codex et insérez – le. Htaccess. Vous ne verrez peut – être pas d’amélioration significative de l’image, mais les feuilles de style et le javascript compressent parfois 90%. Oui, c’est 90%, donc voici ce qui se passe: Différence de taille entre les fichiers compressés et non compressés. Et le CDN? Lorsqu’il s’agit d’optimiser la vitesse de WordPress, de nombreux articles en ligne recommandent l’utilisation d’un réseau de distribution de contenu. Je dirais qu’il s’agit en fait de la dernière étape à franchir pour optimiser les ressources.
La raison en est que vous devez d’abord découvrir d’où viennent la plupart de vos visiteurs concernés; S’ils sont géographiquement proches de votre serveur (presque un terme relatif, 1000 km est un signe raisonnable), il n’est pas logique d’utiliser le CDN. D’autre part, s’ils sont distribués dans le monde entier, c’est tout à fait logique. Comment fonctionnent – ils? Lorsque vous vous inscrivez au CDN, vous recevez habituellement un sous – domaine, que vous insérez avant le fichier statique et que vous téléchargez à partir du fichier statique (www.domain.com \/ style.css est similaire à xxx.cdnprovider.com \/ style.css). Comme le fichier sur le CDN n’existait pas au moment de la première demande, la zone dite pull – up prend effet (vous devez la configurer). La zone pull est essentiellement la source originale de ces fichiers, c’est – à – dire l’url du site WordPress. Après la première demande, CDN extrait les fichiers de votre WordPress, les met à la disposition des visiteurs et les distribue ensuite aux autres serveurs de son réseau afin que, dans toutes les demandes ultérieures, ces fichiers (