web-dev-qa-db-fra.com

Comment ajouter l'en-tête an expires pour les composants d'URL externes comme suggéré par GTmetrix et YSlow?

J'essaie de réduire le temps de chargement de mon site Web qui est hébergé dans Bluehost . Ainsi, lorsque je vérifie les scores de performance via GTmetrix sous la section YSlow, il est mentionné "Ajouter des en-têtes expirés" pour quatre composants statiques comme ci-dessous.

Ajouter des en-têtes expirés

There are 4 static components without a far-future expiration date.

    https://www.googletagmanager.com/gtag/js?id=UA-49812165-2
    https://www.google-analytics.com/analytics.js
    https://www.trustedsite.com/rpc/ajax?do=tmjs-visit&Host=surf2ship.com&Rand=1565102041274
    https://cdn.ywxi.net/meter/surf2ship.com/105.png

Donc, pour avoir une meilleure réponse à cela, j'ai google le problème et les liens ci-dessous ont été étudiés

  1. article moz.com publié en 2012
  2. Stackoverflow post - Add Expires headers - qui est publié en 201

Toutes les pages ci-dessus expliquent comment ajouter des en-têtes expirés pour les types de fichiers courants. Pour un exemple, voir ci-dessous .htaccess fichier. Il spécifie tous les formats courants plutôt que de spécifier une source exacte.

# Media: images, video, audio
  ExpiresByType audio/ogg "access plus 1 month"
  ExpiresByType image/gif "access plus 1 month"
  ExpiresByType image/jpeg "access plus 1 month"

Comment ajouter des en-têtes Expire pour une URL spécifique? Comme pour https://www.google-analytics.com/analytics.js

Ce sont mes scores actuels pour le site GTmetrix

google-analyticshtaccessperformancegoogle-tag-managerexpires
1
Nipun Tharuksha

Comme @Evgeniy l'a déjà expliqué dans sa réponse, afin d'ajouter des en-têtes de réponse HTTP à des ressources externes à votre site, vous devez copier ces ressources localement - sur un serveur que vous contrôlez - pour pouvoir envoyer l'en-tête de réponse HTTP dans le cadre de la réponse HTTP.

Cependant, si vous devez le faire ou non, c'est une autre affaire et chaque cas doit être évalué individuellement. Servir une ressource "localement" à partir de votre serveur d'applications peut ne pas améliorer les performances des visiteurs. Il peut également réduire la fonctionnalité si la ressource apparente "statique" est mise à jour ou si des cookies tiers sont utilisés (ce qui peut ou non être souhaitable).

Les résultats de GTmetrix (et d'autres outils "de performance") doivent être considérés uniquement comme "consultatifs". Un endroit à partir duquel commencer votre propre analyse de site. Vous ne devez pas implémenter les suggestions à l'aveugle sans d'abord évaluer les implications. Il n'est pas nécessairement faux de ne pas avoir "une date d'expiration très lointaine". L'implémentation de fonctionnalités pour simplement satisfaire le "rapport d'outil de performance automatisé" est incorrecte.

dois-je ajouter des en-têtes expirés pour d'autres liens que j'ai mentionnés dans la question.

  1. https://www.googletagmanager.com/gtag/js?id=UA-49812165-2
  2. https://www.google-analytics.com/analytics.js

Notez que, comme mentionné dans les commentaires, ces ressources ne sont pas sans en-têtes Expires (et plus important encore, les Cache-Control: max-age header), c'est juste qu'ils ne sont pas ce que vous pourriez appeler un "futur lointain". Le gtag/js le fichier est mis en cache pendant 15 minutes et analytics.js est mis en cache pendant 2 heures "raisonnables". Couplé au fait que ces mêmes ressources sont utilisées par de nombreux autres sites Web, elles sont probablement déjà mises en cache au moment où le visiteur accède à votre site et le temps de cache peut même être suffisamment long pour que ces ressources restent en cache pendant la durée de l'utilisateur. visitez (et s'ils continuent de parcourir d'autres sites Web dans d'autres onglets, les ressources seront de nouveau mises en cache de toute façon).

Google sert ces ressources pré-compressées à partir d'un CDN rapide, il est donc peu probable que vous puissiez battre le temps de téléchargement initial en l'hébergeant sur votre propre serveur.

StackExchange (généralement considéré comme faisant la bonne chose en matière de référencement/performances) demande analytics.js directement à partir de Google (à l'URL ci-dessus) et ne le copie pas localement.

Google eux-mêmes ne recommande pas de diffuser ces fichiers localement . Cependant, Google n'indique pas les "performances" comme raison principale:

Le référencement du fichier JavaScript à partir des serveurs de Google garantit que vous avez accès aux nouvelles fonctionnalités et mises à jour de produits dès qu'elles sont disponibles, vous donnant les données les plus précises dans vos rapports.

Une fois que vous avez choisi de servir ces fichiers localement, la maintenance peut être plus problématique. Pour ceux qui utilisent WordPress, il existe des plugins disponibles qui aident spécifiquement à automatiser le processus de vérification des mises à jour.

  1. https://www.trustedsite.com/rpc/ajax?do=tmjs-visit&Host=surf2ship.com&Rand=1565102041274

Cela ne semble pas être une ressource statique ! (Peut-être que GTmetrix est dupe de la réponse texte/javascript?) La réponse varie entre les demandes et définit un cookie (tiers) pendant 6 jours. La copie locale et la mise en cache ne serviraient à rien et pourraient éventuellement casser la fonctionnalité. (Ou peut-être que vous n'en avez pas besoin du tout?)

  1. https://cdn.ywxi.net/meter/surf2ship.com/105.png

Servi à partir d'Amazon CloudFront CDN et gzip'd. Alors que l'en-tête Expires est expiré ! Le Cache-Control: public, max-age=86400 header garantit que tous les navigateurs traditionnels distants mettront en cache cette ressource pendant 1 jour.

Conclusion

OMI, il est peu probable que vous profitiez de la copie locale et de la mise en cache de ces "ressources". C'est plus de travail et pourrait même aggraver les performances de vos utilisateurs; pas mieux. GTmetrix (et d'autres "outils") sont uniquement destinés à servir de guide. Les performances réelles des utilisateurs sont ce qui compte vraiment.

4
MrWhite

Non, vous ne pouvez pas gérer vous-même les en-têtes de fichiers que vous n'hébergez pas. La seule façon de gérer les en-têtes des fichiers que vous avez mentionnés (google analytics, etc.) est de les héberger localement. Dans ce cas, vous devez également gérer leurs mises à jour.

En général, vous pouvez faire correspondre les fichiers dans htaccess avec leurs types de fichiers, comme ceci:

<IfModule mod_expires.c>
# Enable expirations
ExpiresActive On
# Default directive
ExpiresDefault "access plus 1 month"
# Javascript
ExpiresByType application/javascript "access plus 1 year"
</IfModule>

Mais si vous voulez définir un en-tête pour certains fichiers, utilisez la directive filesmatch, comme

 <FilesMatch "^(googleanalytics.js)$">
        FileETag None
        Header set Cache-Control "max-age=604800, public, must-revalidate"
        Header set Expires "Thu, 31 Dec 2020 20:00:00 GMT"
    </FilesMatch>
1
Evgeniy

Voir la solution ici , qui fonctionne très bien pour moi.

0
stéphane privé