Apache
Web-fr

Fixer Google PageSpeed améliorer la mise en cache du navigateur avec htaccess

ybierling , , , , , , ,

Pour optimiser la mise en cache du navigateur dans htaccess, ajoutez simplement le code suivant inspiré d’un fil de discussion sur Stack Overflow [1] dans votre fichier htaccess :

#Browser caching
ExpiresActive On
ExpiresByType image/gif A2592000
ExpiresByType image/jpeg A2592000
ExpiresByType image/jpg A2592000
ExpiresByType image/png A2592000
ExpiresByType image/x-icon A2592000
ExpiresByType text/css A86400
ExpiresByType text/javascript A86400
ExpiresByType application/x-shockwave-flash A2592000
#
<FilesMatch "\.(gif¦jpe?g¦png¦ico¦css¦js¦swf)$">
Header set Cache-Control "public"
</FilesMatch>

Cela ne permettra pas seulement de passer le test Leverage browser caching de Googleicon PageSpeed, mais aussi, et plus important, d’accélérer le temps d’accès à votre site web.

Par exemple, cela m’a permis de passer le test Googleicon PageSpeed [2] Leverage browser caching [3] (avec aussi Eliminate render-blocking JavaScript and CSS in above-the-fold content [4]) sur un site web, en passant d’un score de 51 sur mobile (Fig 1) à 72 (Fig 2), et de 59 (Fig 3) à 79 sur desktop (Fig 4).

Google Page Speed - Score avant activation de mise en cache navigateur de 51 sur mobile
Fig 1 : Google Page Speed – Score avant activation de mise en cache navigateur de 51 sur mobile
Google Page Speed - Score après activation de mise en cache navigateur de 72 sur mobile
Fig 2 : Google Page Speed – Score après activation de mise en cache navigateur de 72 sur mobile
Google Page Speed - Score avant activation de mise en cache navigateur de 59 sur desktop
Fig 3 : Google Page Speed – Score avant activation de mise en cache navigateur de 59 sur desktop
Google Page Speed - Score après activation de mise en cache navigateur de 79 de desktop
Fig 4 : Google Page Speed – Score après activation de mise en cache navigateur de 79 de desktop

Liens et crédits

  • [1] – php – Leverage browser caching, how on apache or .htaccess? – Stack Overflow – stackoverflow.com
  • [2] – PageSpeed Insights – developers.google.com
  • [3] – Leverage Browser Caching PageSpeed Insights Google Developers – developers.google.com
  • [4] – Fixer Google PageSpeed Eliminate render-blocking JavaScript and CSS in above-the-fold content – Yoann Bierling, International SAP/Web Consultant – www.ybierling.com

Images