SlideShare une entreprise Scribd logo
1#seocamp
La mise en cache et ses
secrets
Aymeric Bouillat, Benoit Chevillot
2#seocamp
Le cache?
Mais je ne fais
que du SEO moi!
3#seocamp
Le cache client
Sommaire
▪ Les caches
▪ Fonctionnement
▪ Les limites : connexion et navigateur
▪ Les limites: serveur
▪ Cache et SEO
▪ Les en-têtes de cache
▪ TTL
▪ Le cache anticipé
4#seocamp
“Tu as vidé ton cache?!”
Oui!!! Mais tu parles de quell cache?
Cache du Navigateur
FAI: Proxy cache
DNS cache
Serveur HTTP
PHP: APC / Cache
d'OPCodes
SQL:
Cache des requêtes
Applicatif: Cache disque,
cache CMS
Cache serveur / reverse
proxy (ex: Varnish)
Coté serveur
Coté client
5#seocamp
▪ Vous pouvez charger plusieurs fois des ressources
identiques (images d’habillage,CSS,JS,…)
 Ces resources sont souvent demandées
 Elles ne changent pas souvent…
 Elles peuvent induire une charge serveur
importante ! (ex: #soldes)
Quand vous surfez…mieux vaut cacher
Tel un cliqueur fou
6#seocamp
Comment ça marche?
Cache Client vs cache serveur
Client
Cache navigateur
Serveur
Client
Cache navigateur
Client
Cache navigateur
7#seocamp
Comment ça marche?
Cache Client vs cache serveur
Client
Cache navigateur
Serveur de cache
Serveur
Client
Cache navigateur
Client
Cache navigateur
8#seocamp
 Hausse du nombre de JS, CSS, images et fonts…
2013
88 requêtes
1270 Kb
2014
93 requêtes
1703 Kb
2015
100 requêtes
2087 Kb
2016
108 requêtes
2426 Kb
Nombre de requêtes Desktop par page
Source: http://httparchive.org/trends.php
9#seocamp
A vous
de jouer!
Quel est le temps de chargement moyen d’une page web
mobile complète ?
5,4 sec.
9 sec.
13,6 sec.
22 sec.
https://think.storage.googleapis.com/docs/mobile-page-speed-new-industry-benchmarks.pdf
10#seocamp
Le poids et les limites de votre connexion…
Edge, 2G, 3G, 4G, Wifi & co
11#seocamp
Les limites du
navigateur…Max
Parallel HTTP
connections
Entre 2 à 8 connexions
TCP simultanées
/nom d’hôte
(en moyenne, depend des
navigateurs)
12#seocamp
JS synchrone
qui bloque le
rendu
Mise en attente du
rendu CSS/HTML, au cas
où le JS interviendrait…
sur ce même rendu
Les limites du
navigateur…
13#seocamp
▪ Réduire la bande passante sur le serveur
▪ Réduire la latence
▪ Réduire la charge serveur
▪ Cacher les plantages!
A quoi sert le cache pour le serveur?
La performance intimement liée au SEO
14#seocamp
Et ça donne quoi dans GSC?
La performance intimmement liée au SEO
15#seocamp
En rapport avec le SEO!
La performance intimmement liée au SEO
Facteur de
ranking
Crawl
budget
Rebond UX
16#seocamp
Navigateur,
fais tes
réserves !
17#seocamp
Comment savoir ce qui est caché?
No comment 
18#seocamp
Comment savoir ce qui est caché?
19#seocamp
• Votre navigateur mettra en cache ce qu’il pourra, en fonction des en-tête HTTP
C’est dans l’en-tête que ça se passe
20#seocamp
Expires
• 0 requête intermédiaire par la suite, mais…
• Modification de fichier original ne mettra pas à jour le cache pendant 1 an
dans cet exemple
• Dépend de la date et l’heure du serveur
Protocole HTTP 1.0 et expiration
Accept-Language: fr-FR,fr;
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/5.0 (Linux ; Android
6.0.1...
HTTP/1.0 200 OK
Date: Thu, 04 Jun 2015 20:39:14 GMT
Expires: Thu, 04 Jun 2016 20:49:14 GMT
269Ko
21#seocamp
Cache-Control
• Un contrôle du cache au plus fin!
• Gestion des proxies: Cache-Control: private, public
• De nombreux paramètres possibles, mais un peu complexes! (public,
private, no-cache, no-store, no-transform, max-age, must-revalidate,
proxy-revalidate, …)
Protocole HTTP 1.1 et expiration
Accept-Language: fr-FR,fr;
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/5.0 (Linux ; Android
6.0.1...
HTTP/1.0 200 OK
Date: Thu, 04 Jun 2015 20:39:14 GMT
Cache-Control: public; max-
age=31536000
269Ko
22#seocamp
Et si le fichier change?
23#seocamp
▪ Ajout d’une chaîne de paramètres à l’URL du fichier
(appel du même fichier, URL différente)
▪ Ex: /javascript-cms.js?v=2.3
▪ Également appelé versionning
Cache busting is the key
La performance intimement liée au SEO
24#seocamp
Last-modified
• Consommation d’une requête seulement
• On ne renvoie qu'une réponse partielle HEAD -> 304
Protocole HTTP 1.0 et validation
Accept-Language: fr-FR,fr;
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/5.0 (Linux ; Android
6.0.1...
HTTP/1.1 200 OK
Date: Thu, 04 Jun 2015 20:39:14 GMT
Last-Modified: Thu, 02 Jun 2015 17:32:03
Accept-Language: fr-FR,fr;
Accept-Encoding: gzip, deflate
User-Agent: User-Agent: Mozilla/5.0 (Linux ;
Android 6.0.1...
If-Modified-Since: Thu, 02 Jun 2015 17:32:03
HTTP/1.1 304 not modified
Date: Thu, 04 Jun 2015 20:39:14 GMT
Last-Modified: Thu, 02 Jun 2015 17:32:03
269Ko
1 Ko
25#seocamp
EntityTag
• Etag = empreinte du fichier
• Utile si un Last-Modified correspondant à une date de billet est
renvoyée, et que le contenu autour a changé (ex: widgets, pub & co)
Protocole HTTP 1.1 et validation
Accept-Language: fr-FR,fr;
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/5.0 (Linux ; Android
6.0.1...
HTTP/1.1 200 OK
Date: Thu, 04 Jun 2015 20:39:14 GMT
ETag: "UreJ2g"
Accept-Language: fr-FR,fr;
Accept-Encoding: gzip, deflate
User-Agent: Mozilla/5.0 (Linux ; Android
6.0.1...
If-None-Match: "UreJ2g"
HTTP/1.1 304 not modified
Date: Thu, 04 Jun 2015 20:39:14 GMT
ETag: "UreJ2g"
269Ko
1 Ko
26#seocamp
Règle optimale pour
Cache-Control
27#seocamp
Attention, le cycle de vie des ressources dépend des sites et de vos besoins:
c’est un ordre de grandeur…
HTML JS CSS Images PDF, fonts
TTL
Minutes/
Heures
Jours/Mois Jour/mois Mois/année Mois/Année
Commentaires
Dépend des
contenus de la
page
Versionning si
besoin
Versionning si
besoin
Renommer les
fichiers si
besoin
-
Durée de vie des ressources
Ça depend, ça depasse!
28#seocamp
▪ Balises de pagination
<link rel=next….>
▪ Balise prefetch (slides, carousel,
habitudes des utilisateurs)
<link rel="prefetch"
href="/autre_page.html">
Le cache par anticipation
La performance intimement liée au SEO
29#seocamp
Les caches serveur
Sommaire
▪ C'est quoi un cache serveur ?
▪ Pourquoi cache-t-on ?
▪ Quels sont les différents types de cache coté serveur ?
▪ Que cache-t-on et pour combien de temps ?
▪ Qu'est ce qu'on ne cache pas ?
▪ Cas concrets : avant / après
▪ Quels sont les effets de bords d’un reverse proxy ?
▪ Astuces, légendes urbaines et pièges à éviter
30#seocamp
Un cache serveur est un mécanisme de stockage des ressources (page html,
image, fichier javascript, fichier css, ...) de manière statique, le serveur génère la
ressource, la stocke ‘en dur’ puis la sert ensuite au client avec une date de
péremption.
Lorsque la date de péremption est atteinte le serveur régénère la ressource à la
première sollicitation, c’est à dire au premier visiteur qui la demande (humain ou
bot).
C'est quoi un cache serveur ?
Quelques précisions
https://www.smashingmagazine.com/2016/05/modern-wordpress-server-stack/
31#seocamp
 La mise en cache coté serveur permet de soulager énormément
la charge du serveur et de grandement améliorer la vitesse de
‘livraison’ des ressources.
 Une ressource en cache ne nécessite qu’une action de lecture
sur le disque dur ou sur la mémoire vive du serveur.
 Une ressource non cachée sollicite le serveur web, le langage de
script associé (php, js, python, …), la base de donnée.
Pourquoi cache-t-on ?
Pour gagner du temps
32#seocamp
 Un cache efficace coté serveur permet de multiplier le
nombre de visiteurs simultanés sans changer
d’infrastructure.
 Un cache efficace coté serveur permet d’améliorer
l’expérience utilisateur.
 Un cache efficace permet d’accélérer le crawl par les
bots.
Pourquoi cache-t-on ?
Pour gagner de l’argent
33#seocamp
 Reverse proxy (le graal)
 Permet de soulager l’intégralité du serveur car le
cache est puisé directement en mémoire serveur
sans intermédiaire applicatif.
 Permet d’agir également en load balancer.
 Peut être difficile a mettre en place et a maintenir
Les types de cache
Quels sont les différents types de cache coté serveur ?
34#seocamp
 Cache de code (APC, ...) permet de compiler le code
 Evite la phase de compilation du script
 Cache de ressource (Memcache, ...)
 Intervient en milieu de chaine, cache d’objets, soulage
essentiellement la BDD
Cache applicatif
Quels sont les différents types de cache coté serveur ?
35#seocamp
 Cache de page CMS (smarty, WPRocket, WPTotalcache, …)
 Intervient en fin de chaine, cache de ressources.
 Permet de piloter simplement Varnish et de s’assurer que les 2
caches sont synchronisés.
Cache CMS
Quels sont les différents types de cache coté serveur ?
36#seocamp
 Permet de soulager la base de donnée sur les requêtes coûteuses et
récurrentes, par exemple les facettes les plus consultées d’un
ecommerce. (query cache + 238 % d’apres mysql sur les select)
 Généralement à implémenter au niveau du code ou de l’ORM
 Si vous utilisez massivement le cache de requêtes pour la recherche
alors vous devriez surement déporter votre fonctionnalité recherche sur
une technologie dédié à cela : elasticsearch
Cache base de donnée
Quels sont les différents types de cache coté serveur ?
37#seocamp
 Tout ce qui transite par http peut être caché : pages html,
javascript, css, images, pdf, …
 La durée de vie (date de péremption) de chaque ressources peut
être différente, elle dépend avant tout de vos besoins. Par
exemple les pages produit d’un site ecommerce peuvent avoir
une durée de vie de 1h alors que la page home peut avoir une
durée de vie de 3h ou plus.
To cache ?
Que cache-t-on et pour combien de temps ?
38#seocamp
 ATTENTION : ne pas confondre la durée de vie d’une
ressource coté serveur et les entêtes de cache (Expires et
Cache-control). En effet une ressource peut tout a fait être
régénérée coté serveur avant son expiration coté client, ou
inversement.
To cache ?
Que cache-t-on et pour combien de temps ?
39#seocamp
 Les pages hautement personnalisées.
 Les pages qui enregistre des données (formulaires)
 De manière générale toutes les requêtes POST, les back-
offices, les tunnels de conversion, les espaces perso.
Or not to cache ?
Qu'est ce qu'on ne cache pas ?
40#seocamp
Carla-bikini.com sur prestashop 1.6 multiboutique et https
Avant : devais doubler son d’infrastructure pour accompagner sa croissance, TTFB : 1,2s
Après : pas besoin de faire évoluer l’infrastructure, TTFB : 0,4s
code promo NET10
-10 % hors points rouge
Cas concrets Varnish : avant / après
Des chiffres
41#seocamp
Lemoncurve.com sur prestashop 1.4 (avant mars 2017,
racheté et migré par shopinvest depuis)
Avant : 1500€ d’infrastructure par mois + des
sueurs froides lors des soldes, TTFB : 2s
Après : 700€ d’infrastructure par mois, plus de
sueurs froides lors des soldes ou passage TV, TTFB :
0,2s
Cas concrets Varnish : avant / après
Des chiffres
42#seocamp
 Besoin de développements complémentaires dans certains cas pour garder
un certain dynamisme des pages tout en gardant un cache efficace. (ajax
ou ESI pour les zones panier Prestashop par exemple)
 Besoin de faire des concessions pour avoir le cache le plus performant
possible (ou pas au détriment du cache), par exemple afficher tous les prix
en TTC sur une boutique quelque soit le pays de l’ip du visiteur. Si on
souhaite afficher du HT pour les pays etranger alors on maintiendra 2
caches différents.
Effets de bords
Quels sont les effets de bords d’un reverse proxy ?
43#seocamp
 Un mauvais réglage de cache peut s’avérer catastrophique.
 Pensez a auditer soigneusement le site et ses réglages métier avant
la mise en place et la configuration d’un reverse proxy comme
Varnish.
 On ne peut pas mettre en place Varnish sur Prestashop → FAUX
 On ne peut pas mettre en place Varnish avec https → FAUX
 Utiliser un réchauffeur de cache
 Réglez soigneusement vos entêtes d’expiration
Astuces et pièges
Astuces, légendes urbaines et pièges à éviter
44#seocamp
Benoit Chevillot
(DIVIOSEO)
@beunwa
Aymeric Bouillat
(RESONEO)
@aymerictwit
Merci!Des questions?

Contenu connexe

Tendances

Optimiser son seo avec google tag manager
Optimiser son seo avec google tag managerOptimiser son seo avec google tag manager
Optimiser son seo avec google tag managerMadeline Pinthon
 
Seo camp'us 2018 - cloaking is not a crime : Patrick Valibus
Seo camp'us 2018 - cloaking is not a crime : Patrick ValibusSeo camp'us 2018 - cloaking is not a crime : Patrick Valibus
Seo camp'us 2018 - cloaking is not a crime : Patrick ValibusPatrick Valibus
 
Recherche & SEO / Aujourd'hui & Demain QueDuWeb
Recherche & SEO / Aujourd'hui & Demain QueDuWebRecherche & SEO / Aujourd'hui & Demain QueDuWeb
Recherche & SEO / Aujourd'hui & Demain QueDuWebAysun Akarsu
 
Optimiser son maillage interne pour booster son SEO
Optimiser son maillage interne pour booster son SEOOptimiser son maillage interne pour booster son SEO
Optimiser son maillage interne pour booster son SEOGrégory Florin
 
Javascript et indexation, où en est-on ? - SEO Camp'us Paris 2016
Javascript et indexation, où en est-on ? - SEO Camp'us Paris 2016Javascript et indexation, où en est-on ? - SEO Camp'us Paris 2016
Javascript et indexation, où en est-on ? - SEO Camp'us Paris 2016iProspect France
 
MAILLAGE INTERNE ET SEO - Seo camp webismybusiness 5 oct 2013
MAILLAGE INTERNE ET SEO - Seo camp webismybusiness 5 oct 2013MAILLAGE INTERNE ET SEO - Seo camp webismybusiness 5 oct 2013
MAILLAGE INTERNE ET SEO - Seo camp webismybusiness 5 oct 2013Philippe YONNET
 
Réussir son SEO à l’international - iProspect France
Réussir son SEO à l’international - iProspect FranceRéussir son SEO à l’international - iProspect France
Réussir son SEO à l’international - iProspect FranceiProspect France
 
Les défauts de WordPress pour le SEO
Les défauts de WordPress pour le SEOLes défauts de WordPress pour le SEO
Les défauts de WordPress pour le SEODaniel Roch - SeoMix
 
Comment un e-commerçant a multiplié son trafic SEO par 9,8 en 12 mois !
Comment un e-commerçant a multiplié son trafic SEO par 9,8 en 12 mois !Comment un e-commerçant a multiplié son trafic SEO par 9,8 en 12 mois !
Comment un e-commerçant a multiplié son trafic SEO par 9,8 en 12 mois !David Dragesco
 
Le référencement naturel de cas complexes sur WordPress
Le référencement naturel de cas complexes sur WordPressLe référencement naturel de cas complexes sur WordPress
Le référencement naturel de cas complexes sur WordPressDaniel Roch - SeoMix
 
ADW #6 : Optimiser le référencement naturel
ADW #6 : Optimiser le référencement naturelADW #6 : Optimiser le référencement naturel
ADW #6 : Optimiser le référencement naturelAtlantic 2.0
 
Optimiser son SEO avec Google Tag Manager
Optimiser son SEO avec Google Tag ManagerOptimiser son SEO avec Google Tag Manager
Optimiser son SEO avec Google Tag ManageriProspect France
 

Tendances (12)

Optimiser son seo avec google tag manager
Optimiser son seo avec google tag managerOptimiser son seo avec google tag manager
Optimiser son seo avec google tag manager
 
Seo camp'us 2018 - cloaking is not a crime : Patrick Valibus
Seo camp'us 2018 - cloaking is not a crime : Patrick ValibusSeo camp'us 2018 - cloaking is not a crime : Patrick Valibus
Seo camp'us 2018 - cloaking is not a crime : Patrick Valibus
 
Recherche & SEO / Aujourd'hui & Demain QueDuWeb
Recherche & SEO / Aujourd'hui & Demain QueDuWebRecherche & SEO / Aujourd'hui & Demain QueDuWeb
Recherche & SEO / Aujourd'hui & Demain QueDuWeb
 
Optimiser son maillage interne pour booster son SEO
Optimiser son maillage interne pour booster son SEOOptimiser son maillage interne pour booster son SEO
Optimiser son maillage interne pour booster son SEO
 
Javascript et indexation, où en est-on ? - SEO Camp'us Paris 2016
Javascript et indexation, où en est-on ? - SEO Camp'us Paris 2016Javascript et indexation, où en est-on ? - SEO Camp'us Paris 2016
Javascript et indexation, où en est-on ? - SEO Camp'us Paris 2016
 
MAILLAGE INTERNE ET SEO - Seo camp webismybusiness 5 oct 2013
MAILLAGE INTERNE ET SEO - Seo camp webismybusiness 5 oct 2013MAILLAGE INTERNE ET SEO - Seo camp webismybusiness 5 oct 2013
MAILLAGE INTERNE ET SEO - Seo camp webismybusiness 5 oct 2013
 
Réussir son SEO à l’international - iProspect France
Réussir son SEO à l’international - iProspect FranceRéussir son SEO à l’international - iProspect France
Réussir son SEO à l’international - iProspect France
 
Les défauts de WordPress pour le SEO
Les défauts de WordPress pour le SEOLes défauts de WordPress pour le SEO
Les défauts de WordPress pour le SEO
 
Comment un e-commerçant a multiplié son trafic SEO par 9,8 en 12 mois !
Comment un e-commerçant a multiplié son trafic SEO par 9,8 en 12 mois !Comment un e-commerçant a multiplié son trafic SEO par 9,8 en 12 mois !
Comment un e-commerçant a multiplié son trafic SEO par 9,8 en 12 mois !
 
Le référencement naturel de cas complexes sur WordPress
Le référencement naturel de cas complexes sur WordPressLe référencement naturel de cas complexes sur WordPress
Le référencement naturel de cas complexes sur WordPress
 
ADW #6 : Optimiser le référencement naturel
ADW #6 : Optimiser le référencement naturelADW #6 : Optimiser le référencement naturel
ADW #6 : Optimiser le référencement naturel
 
Optimiser son SEO avec Google Tag Manager
Optimiser son SEO avec Google Tag ManagerOptimiser son SEO avec Google Tag Manager
Optimiser son SEO avec Google Tag Manager
 

En vedette

SEO et ecommerce sur Magento: retour d’expérience
SEO et ecommerce sur Magento: retour d’expérienceSEO et ecommerce sur Magento: retour d’expérience
SEO et ecommerce sur Magento: retour d’expérienceAurélien Lavorel
 
SEO : comment obtenir des liens puissants grâce à un contenu décalé
SEO : comment obtenir des liens puissants grâce à un contenu décaléSEO : comment obtenir des liens puissants grâce à un contenu décalé
SEO : comment obtenir des liens puissants grâce à un contenu décaléLaurent Peyrat
 
Les bonnes pratiques SEO avec les frameworks javascript - SEO CAMPUS 9 mars 2017
Les bonnes pratiques SEO avec les frameworks javascript - SEO CAMPUS 9 mars 2017Les bonnes pratiques SEO avec les frameworks javascript - SEO CAMPUS 9 mars 2017
Les bonnes pratiques SEO avec les frameworks javascript - SEO CAMPUS 9 mars 2017Peak Ace
 
Designing Creative Content: How visualising data helps us see
Designing Creative Content: How visualising data helps us seeDesigning Creative Content: How visualising data helps us see
Designing Creative Content: How visualising data helps us seeVicke Cheung
 
Reportings SEO avec Google Data Studio - SEO Campus Paris 2017
Reportings SEO avec Google Data Studio - SEO Campus Paris 2017Reportings SEO avec Google Data Studio - SEO Campus Paris 2017
Reportings SEO avec Google Data Studio - SEO Campus Paris 2017Woptimo
 
Analyse de logs - Études de cas et best practices - SEO Campus 2017
Analyse de logs - Études de cas et best practices - SEO Campus 2017Analyse de logs - Études de cas et best practices - SEO Campus 2017
Analyse de logs - Études de cas et best practices - SEO Campus 2017iProspect France
 
HTTPS The Road To A More Secure Web / SEOCamp Paris
HTTPS The Road To A More Secure Web / SEOCamp ParisHTTPS The Road To A More Secure Web / SEOCamp Paris
HTTPS The Road To A More Secure Web / SEOCamp ParisAysun Akarsu
 
Google AMP 1 an après : quel bilan, quelles perspectives ?
Google AMP 1 an après : quel bilan, quelles perspectives ?Google AMP 1 an après : quel bilan, quelles perspectives ?
Google AMP 1 an après : quel bilan, quelles perspectives ?Virginie Clève - largow ☕️
 
Seo camp paris - A chaque enjeu, sa stratégie - Tips & REX
Seo camp paris - A chaque enjeu, sa stratégie - Tips & REX Seo camp paris - A chaque enjeu, sa stratégie - Tips & REX
Seo camp paris - A chaque enjeu, sa stratégie - Tips & REX Intuiti
 
Measuring Content Marketing
Measuring Content MarketingMeasuring Content Marketing
Measuring Content MarketingDavid Iwanow
 
Organiser un projet à l’international : un Pari Fou
Organiser un projet à l’international : un Pari FouOrganiser un projet à l’international : un Pari Fou
Organiser un projet à l’international : un Pari FouOpen-linking
 
Pourquoi mes clients n'appliquent pas mes recommandations SEO (mais pas que ...)
Pourquoi mes clients n'appliquent pas mes recommandations SEO (mais pas que ...)Pourquoi mes clients n'appliquent pas mes recommandations SEO (mais pas que ...)
Pourquoi mes clients n'appliquent pas mes recommandations SEO (mais pas que ...)Thomas BART
 
Tendances Social Media 2017
Tendances Social Media 2017Tendances Social Media 2017
Tendances Social Media 2017Marie Dollé
 
12 secrets et astuces pour Booster votre visibilité sur Twitter & Facebook - ...
12 secrets et astuces pour Booster votre visibilité sur Twitter & Facebook - ...12 secrets et astuces pour Booster votre visibilité sur Twitter & Facebook - ...
12 secrets et astuces pour Booster votre visibilité sur Twitter & Facebook - ...Julien Anouilh (noska)
 
Marketing d’influence au travers de la communication de la génération z
Marketing d’influence au travers de la communication de la génération zMarketing d’influence au travers de la communication de la génération z
Marketing d’influence au travers de la communication de la génération zÉric Delcroix
 
Make your website load really really fast - seo campus 2017
Make your website load really really fast  - seo campus 2017Make your website load really really fast  - seo campus 2017
Make your website load really really fast - seo campus 2017SEO Camp Association
 
L’impact du Big Data et Machine Learning sur le marketing en ligne
L’impact du Big Data et Machine Learning sur le marketing en ligneL’impact du Big Data et Machine Learning sur le marketing en ligne
L’impact du Big Data et Machine Learning sur le marketing en ligneSEO Camp Association
 

En vedette (20)

SEO et ecommerce sur Magento: retour d’expérience
SEO et ecommerce sur Magento: retour d’expérienceSEO et ecommerce sur Magento: retour d’expérience
SEO et ecommerce sur Magento: retour d’expérience
 
SEO : comment obtenir des liens puissants grâce à un contenu décalé
SEO : comment obtenir des liens puissants grâce à un contenu décaléSEO : comment obtenir des liens puissants grâce à un contenu décalé
SEO : comment obtenir des liens puissants grâce à un contenu décalé
 
Les bonnes pratiques SEO avec les frameworks javascript - SEO CAMPUS 9 mars 2017
Les bonnes pratiques SEO avec les frameworks javascript - SEO CAMPUS 9 mars 2017Les bonnes pratiques SEO avec les frameworks javascript - SEO CAMPUS 9 mars 2017
Les bonnes pratiques SEO avec les frameworks javascript - SEO CAMPUS 9 mars 2017
 
Designing Creative Content: How visualising data helps us see
Designing Creative Content: How visualising data helps us seeDesigning Creative Content: How visualising data helps us see
Designing Creative Content: How visualising data helps us see
 
Reportings SEO avec Google Data Studio - SEO Campus Paris 2017
Reportings SEO avec Google Data Studio - SEO Campus Paris 2017Reportings SEO avec Google Data Studio - SEO Campus Paris 2017
Reportings SEO avec Google Data Studio - SEO Campus Paris 2017
 
Analyse de logs - Études de cas et best practices - SEO Campus 2017
Analyse de logs - Études de cas et best practices - SEO Campus 2017Analyse de logs - Études de cas et best practices - SEO Campus 2017
Analyse de logs - Études de cas et best practices - SEO Campus 2017
 
HTTPS The Road To A More Secure Web / SEOCamp Paris
HTTPS The Road To A More Secure Web / SEOCamp ParisHTTPS The Road To A More Secure Web / SEOCamp Paris
HTTPS The Road To A More Secure Web / SEOCamp Paris
 
Google AMP 1 an après : quel bilan, quelles perspectives ?
Google AMP 1 an après : quel bilan, quelles perspectives ?Google AMP 1 an après : quel bilan, quelles perspectives ?
Google AMP 1 an après : quel bilan, quelles perspectives ?
 
Seo camp paris - A chaque enjeu, sa stratégie - Tips & REX
Seo camp paris - A chaque enjeu, sa stratégie - Tips & REX Seo camp paris - A chaque enjeu, sa stratégie - Tips & REX
Seo camp paris - A chaque enjeu, sa stratégie - Tips & REX
 
Measuring Content Marketing
Measuring Content MarketingMeasuring Content Marketing
Measuring Content Marketing
 
Organiser un projet à l’international : un Pari Fou
Organiser un projet à l’international : un Pari FouOrganiser un projet à l’international : un Pari Fou
Organiser un projet à l’international : un Pari Fou
 
Seo camp2017 Marguerite Leenhardt
Seo camp2017 Marguerite LeenhardtSeo camp2017 Marguerite Leenhardt
Seo camp2017 Marguerite Leenhardt
 
Pourquoi mes clients n'appliquent pas mes recommandations SEO (mais pas que ...)
Pourquoi mes clients n'appliquent pas mes recommandations SEO (mais pas que ...)Pourquoi mes clients n'appliquent pas mes recommandations SEO (mais pas que ...)
Pourquoi mes clients n'appliquent pas mes recommandations SEO (mais pas que ...)
 
Mots-clés, au delà du volume de recherche
Mots-clés, au delà du volume de rechercheMots-clés, au delà du volume de recherche
Mots-clés, au delà du volume de recherche
 
Tendances Social Media 2017
Tendances Social Media 2017Tendances Social Media 2017
Tendances Social Media 2017
 
12 secrets et astuces pour Booster votre visibilité sur Twitter & Facebook - ...
12 secrets et astuces pour Booster votre visibilité sur Twitter & Facebook - ...12 secrets et astuces pour Booster votre visibilité sur Twitter & Facebook - ...
12 secrets et astuces pour Booster votre visibilité sur Twitter & Facebook - ...
 
Marketing d’influence au travers de la communication de la génération z
Marketing d’influence au travers de la communication de la génération zMarketing d’influence au travers de la communication de la génération z
Marketing d’influence au travers de la communication de la génération z
 
Make your website load really really fast - seo campus 2017
Make your website load really really fast  - seo campus 2017Make your website load really really fast  - seo campus 2017
Make your website load really really fast - seo campus 2017
 
Enquête emploi SEO Camp 2017
Enquête emploi SEO Camp 2017Enquête emploi SEO Camp 2017
Enquête emploi SEO Camp 2017
 
L’impact du Big Data et Machine Learning sur le marketing en ligne
L’impact du Big Data et Machine Learning sur le marketing en ligneL’impact du Big Data et Machine Learning sur le marketing en ligne
L’impact du Big Data et Machine Learning sur le marketing en ligne
 

Similaire à La mise en cache et ses secrets

Optimiser WordPress
Optimiser WordPressOptimiser WordPress
Optimiser WordPressChi Nacim
 
Le SEO JavaScript démystifié
Le SEO JavaScript démystifiéLe SEO JavaScript démystifié
Le SEO JavaScript démystifiéAdrien Russo
 
Améliorer les performances de vos sites web une priorité pour 2018 - Petit dé...
Améliorer les performances de vos sites web une priorité pour 2018 - Petit dé...Améliorer les performances de vos sites web une priorité pour 2018 - Petit dé...
Améliorer les performances de vos sites web une priorité pour 2018 - Petit dé...Peak Ace
 
Breizhcamp 2014 : Une partie de Cache-Cache
Breizhcamp 2014 : Une partie de Cache-CacheBreizhcamp 2014 : Une partie de Cache-Cache
Breizhcamp 2014 : Une partie de Cache-CacheFrederic Bouchery
 
Kiwiparty 2011 - Optimisation des sites internet
Kiwiparty 2011 - Optimisation des sites internetKiwiparty 2011 - Optimisation des sites internet
Kiwiparty 2011 - Optimisation des sites internetDevclic
 
Optimisez la vitesse de chargement de votre site
Optimisez la vitesse de chargement de votre siteOptimisez la vitesse de chargement de votre site
Optimisez la vitesse de chargement de votre siteWebxFrance
 
Morning tech #2 - Démarche performance slides
Morning tech #2 - Démarche performance slidesMorning tech #2 - Démarche performance slides
Morning tech #2 - Démarche performance slidesOxalide
 
Oxalide Morning tech #2 - démarche performance
Oxalide Morning tech #2 - démarche performanceOxalide Morning tech #2 - démarche performance
Oxalide Morning tech #2 - démarche performanceLudovic Piot
 
Un site web rapide ?
Un site web rapide ? Un site web rapide ?
Un site web rapide ? haricot
 
Comment Rue Du Commerce est devenu le site e-commerce le plus rapide de France ?
Comment Rue Du Commerce est devenu le site e-commerce le plus rapide de France ?Comment Rue Du Commerce est devenu le site e-commerce le plus rapide de France ?
Comment Rue Du Commerce est devenu le site e-commerce le plus rapide de France ?Fasterize
 
Javascript as a first programming language : votre IC prête pour la révolution !
Javascript as a first programming language : votre IC prête pour la révolution !Javascript as a first programming language : votre IC prête pour la révolution !
Javascript as a first programming language : votre IC prête pour la révolution !VISEO
 
HTTP2 : ce qui va changer par Julien Landuré
HTTP2 : ce qui va changer par Julien LanduréHTTP2 : ce qui va changer par Julien Landuré
HTTP2 : ce qui va changer par Julien LanduréZenika
 
LoadTime & SEO - Erlé Alberton
LoadTime & SEO - Erlé AlbertonLoadTime & SEO - Erlé Alberton
LoadTime & SEO - Erlé AlbertonWeLoveSEO
 
We❤️SEO 2019 : WebPerf et SEO
We❤️SEO 2019 : WebPerf et SEOWe❤️SEO 2019 : WebPerf et SEO
We❤️SEO 2019 : WebPerf et SEOErlé Alberton
 
[FR] Les requêtes HTTP de l'extrême
[FR] Les requêtes HTTP de l'extrême[FR] Les requêtes HTTP de l'extrême
[FR] Les requêtes HTTP de l'extrêmeOVHcloud
 
PHP/ExtJs experience feedback - IAV case - 1
PHP/ExtJs experience feedback - IAV case - 1PHP/ExtJs experience feedback - IAV case - 1
PHP/ExtJs experience feedback - IAV case - 1fayway
 
Core Web Vitals : Comprendre, Mesurer, Optimiser
Core Web Vitals : Comprendre, Mesurer, OptimiserCore Web Vitals : Comprendre, Mesurer, Optimiser
Core Web Vitals : Comprendre, Mesurer, OptimiseriProspect France
 
Evolutions et nouveaux outils SEO
Evolutions et nouveaux outils SEOEvolutions et nouveaux outils SEO
Evolutions et nouveaux outils SEODimitri Brunel
 

Similaire à La mise en cache et ses secrets (20)

Optimiser WordPress
Optimiser WordPressOptimiser WordPress
Optimiser WordPress
 
Optimiser wordpress
Optimiser wordpressOptimiser wordpress
Optimiser wordpress
 
Le SEO JavaScript démystifié
Le SEO JavaScript démystifiéLe SEO JavaScript démystifié
Le SEO JavaScript démystifié
 
Améliorer les performances de vos sites web une priorité pour 2018 - Petit dé...
Améliorer les performances de vos sites web une priorité pour 2018 - Petit dé...Améliorer les performances de vos sites web une priorité pour 2018 - Petit dé...
Améliorer les performances de vos sites web une priorité pour 2018 - Petit dé...
 
Breizhcamp 2014 : Une partie de Cache-Cache
Breizhcamp 2014 : Une partie de Cache-CacheBreizhcamp 2014 : Une partie de Cache-Cache
Breizhcamp 2014 : Une partie de Cache-Cache
 
Kiwiparty 2011 - Optimisation des sites internet
Kiwiparty 2011 - Optimisation des sites internetKiwiparty 2011 - Optimisation des sites internet
Kiwiparty 2011 - Optimisation des sites internet
 
Optimisez la vitesse de chargement de votre site
Optimisez la vitesse de chargement de votre siteOptimisez la vitesse de chargement de votre site
Optimisez la vitesse de chargement de votre site
 
Morning tech #2 - Démarche performance slides
Morning tech #2 - Démarche performance slidesMorning tech #2 - Démarche performance slides
Morning tech #2 - Démarche performance slides
 
Oxalide Morning tech #2 - démarche performance
Oxalide Morning tech #2 - démarche performanceOxalide Morning tech #2 - démarche performance
Oxalide Morning tech #2 - démarche performance
 
Un site web rapide ?
Un site web rapide ? Un site web rapide ?
Un site web rapide ?
 
Optimisation de son site web
Optimisation de son site webOptimisation de son site web
Optimisation de son site web
 
Comment Rue Du Commerce est devenu le site e-commerce le plus rapide de France ?
Comment Rue Du Commerce est devenu le site e-commerce le plus rapide de France ?Comment Rue Du Commerce est devenu le site e-commerce le plus rapide de France ?
Comment Rue Du Commerce est devenu le site e-commerce le plus rapide de France ?
 
Javascript as a first programming language : votre IC prête pour la révolution !
Javascript as a first programming language : votre IC prête pour la révolution !Javascript as a first programming language : votre IC prête pour la révolution !
Javascript as a first programming language : votre IC prête pour la révolution !
 
HTTP2 : ce qui va changer par Julien Landuré
HTTP2 : ce qui va changer par Julien LanduréHTTP2 : ce qui va changer par Julien Landuré
HTTP2 : ce qui va changer par Julien Landuré
 
LoadTime & SEO - Erlé Alberton
LoadTime & SEO - Erlé AlbertonLoadTime & SEO - Erlé Alberton
LoadTime & SEO - Erlé Alberton
 
We❤️SEO 2019 : WebPerf et SEO
We❤️SEO 2019 : WebPerf et SEOWe❤️SEO 2019 : WebPerf et SEO
We❤️SEO 2019 : WebPerf et SEO
 
[FR] Les requêtes HTTP de l'extrême
[FR] Les requêtes HTTP de l'extrême[FR] Les requêtes HTTP de l'extrême
[FR] Les requêtes HTTP de l'extrême
 
PHP/ExtJs experience feedback - IAV case - 1
PHP/ExtJs experience feedback - IAV case - 1PHP/ExtJs experience feedback - IAV case - 1
PHP/ExtJs experience feedback - IAV case - 1
 
Core Web Vitals : Comprendre, Mesurer, Optimiser
Core Web Vitals : Comprendre, Mesurer, OptimiserCore Web Vitals : Comprendre, Mesurer, Optimiser
Core Web Vitals : Comprendre, Mesurer, Optimiser
 
Evolutions et nouveaux outils SEO
Evolutions et nouveaux outils SEOEvolutions et nouveaux outils SEO
Evolutions et nouveaux outils SEO
 

Plus de Aymeric Bouillat

SEO Lanta : gagnez l'aventure des SERP
SEO Lanta : gagnez l'aventure des SERPSEO Lanta : gagnez l'aventure des SERP
SEO Lanta : gagnez l'aventure des SERPAymeric Bouillat
 
Dans la jungle des sites mobiles - comment les rendre (vraiment) SEO-friendly ?
Dans la jungle des sites mobiles  - comment les rendre (vraiment) SEO-friendly ?Dans la jungle des sites mobiles  - comment les rendre (vraiment) SEO-friendly ?
Dans la jungle des sites mobiles - comment les rendre (vraiment) SEO-friendly ?Aymeric Bouillat
 
Screaming frog - l'outil ne fait pas l'artisan
Screaming frog - l'outil ne fait pas l'artisanScreaming frog - l'outil ne fait pas l'artisan
Screaming frog - l'outil ne fait pas l'artisanAymeric Bouillat
 
Mystères et associés dans les résultats de Google
Mystères et associés dans les résultats de GoogleMystères et associés dans les résultats de Google
Mystères et associés dans les résultats de GoogleAymeric Bouillat
 
Migration seo - astuces techniques pour améliorer votre trafic
Migration seo - astuces techniques pour améliorer votre traficMigration seo - astuces techniques pour améliorer votre trafic
Migration seo - astuces techniques pour améliorer votre traficAymeric Bouillat
 
Seo mobile - bonnes pratiques
Seo mobile -  bonnes pratiquesSeo mobile -  bonnes pratiques
Seo mobile - bonnes pratiquesAymeric Bouillat
 
Site mobile et SEO - les erreurs à ne pas commettre
Site mobile et SEO - les erreurs à ne pas commettreSite mobile et SEO - les erreurs à ne pas commettre
Site mobile et SEO - les erreurs à ne pas commettreAymeric Bouillat
 

Plus de Aymeric Bouillat (8)

SEO Lanta : gagnez l'aventure des SERP
SEO Lanta : gagnez l'aventure des SERPSEO Lanta : gagnez l'aventure des SERP
SEO Lanta : gagnez l'aventure des SERP
 
Dans la jungle des sites mobiles - comment les rendre (vraiment) SEO-friendly ?
Dans la jungle des sites mobiles  - comment les rendre (vraiment) SEO-friendly ?Dans la jungle des sites mobiles  - comment les rendre (vraiment) SEO-friendly ?
Dans la jungle des sites mobiles - comment les rendre (vraiment) SEO-friendly ?
 
Screaming frog - l'outil ne fait pas l'artisan
Screaming frog - l'outil ne fait pas l'artisanScreaming frog - l'outil ne fait pas l'artisan
Screaming frog - l'outil ne fait pas l'artisan
 
Mystères et associés dans les résultats de Google
Mystères et associés dans les résultats de GoogleMystères et associés dans les résultats de Google
Mystères et associés dans les résultats de Google
 
Migration seo - astuces techniques pour améliorer votre trafic
Migration seo - astuces techniques pour améliorer votre traficMigration seo - astuces techniques pour améliorer votre trafic
Migration seo - astuces techniques pour améliorer votre trafic
 
Netlinking en 2015
Netlinking en 2015Netlinking en 2015
Netlinking en 2015
 
Seo mobile - bonnes pratiques
Seo mobile -  bonnes pratiquesSeo mobile -  bonnes pratiques
Seo mobile - bonnes pratiques
 
Site mobile et SEO - les erreurs à ne pas commettre
Site mobile et SEO - les erreurs à ne pas commettreSite mobile et SEO - les erreurs à ne pas commettre
Site mobile et SEO - les erreurs à ne pas commettre
 

La mise en cache et ses secrets

  • 1. 1#seocamp La mise en cache et ses secrets Aymeric Bouillat, Benoit Chevillot
  • 2. 2#seocamp Le cache? Mais je ne fais que du SEO moi!
  • 3. 3#seocamp Le cache client Sommaire ▪ Les caches ▪ Fonctionnement ▪ Les limites : connexion et navigateur ▪ Les limites: serveur ▪ Cache et SEO ▪ Les en-têtes de cache ▪ TTL ▪ Le cache anticipé
  • 4. 4#seocamp “Tu as vidé ton cache?!” Oui!!! Mais tu parles de quell cache? Cache du Navigateur FAI: Proxy cache DNS cache Serveur HTTP PHP: APC / Cache d'OPCodes SQL: Cache des requêtes Applicatif: Cache disque, cache CMS Cache serveur / reverse proxy (ex: Varnish) Coté serveur Coté client
  • 5. 5#seocamp ▪ Vous pouvez charger plusieurs fois des ressources identiques (images d’habillage,CSS,JS,…)  Ces resources sont souvent demandées  Elles ne changent pas souvent…  Elles peuvent induire une charge serveur importante ! (ex: #soldes) Quand vous surfez…mieux vaut cacher Tel un cliqueur fou
  • 6. 6#seocamp Comment ça marche? Cache Client vs cache serveur Client Cache navigateur Serveur Client Cache navigateur Client Cache navigateur
  • 7. 7#seocamp Comment ça marche? Cache Client vs cache serveur Client Cache navigateur Serveur de cache Serveur Client Cache navigateur Client Cache navigateur
  • 8. 8#seocamp  Hausse du nombre de JS, CSS, images et fonts… 2013 88 requêtes 1270 Kb 2014 93 requêtes 1703 Kb 2015 100 requêtes 2087 Kb 2016 108 requêtes 2426 Kb Nombre de requêtes Desktop par page Source: http://httparchive.org/trends.php
  • 9. 9#seocamp A vous de jouer! Quel est le temps de chargement moyen d’une page web mobile complète ? 5,4 sec. 9 sec. 13,6 sec. 22 sec. https://think.storage.googleapis.com/docs/mobile-page-speed-new-industry-benchmarks.pdf
  • 10. 10#seocamp Le poids et les limites de votre connexion… Edge, 2G, 3G, 4G, Wifi & co
  • 11. 11#seocamp Les limites du navigateur…Max Parallel HTTP connections Entre 2 à 8 connexions TCP simultanées /nom d’hôte (en moyenne, depend des navigateurs)
  • 12. 12#seocamp JS synchrone qui bloque le rendu Mise en attente du rendu CSS/HTML, au cas où le JS interviendrait… sur ce même rendu Les limites du navigateur…
  • 13. 13#seocamp ▪ Réduire la bande passante sur le serveur ▪ Réduire la latence ▪ Réduire la charge serveur ▪ Cacher les plantages! A quoi sert le cache pour le serveur? La performance intimement liée au SEO
  • 14. 14#seocamp Et ça donne quoi dans GSC? La performance intimmement liée au SEO
  • 15. 15#seocamp En rapport avec le SEO! La performance intimmement liée au SEO Facteur de ranking Crawl budget Rebond UX
  • 17. 17#seocamp Comment savoir ce qui est caché? No comment 
  • 18. 18#seocamp Comment savoir ce qui est caché?
  • 19. 19#seocamp • Votre navigateur mettra en cache ce qu’il pourra, en fonction des en-tête HTTP C’est dans l’en-tête que ça se passe
  • 20. 20#seocamp Expires • 0 requête intermédiaire par la suite, mais… • Modification de fichier original ne mettra pas à jour le cache pendant 1 an dans cet exemple • Dépend de la date et l’heure du serveur Protocole HTTP 1.0 et expiration Accept-Language: fr-FR,fr; Accept-Encoding: gzip, deflate User-Agent: Mozilla/5.0 (Linux ; Android 6.0.1... HTTP/1.0 200 OK Date: Thu, 04 Jun 2015 20:39:14 GMT Expires: Thu, 04 Jun 2016 20:49:14 GMT 269Ko
  • 21. 21#seocamp Cache-Control • Un contrôle du cache au plus fin! • Gestion des proxies: Cache-Control: private, public • De nombreux paramètres possibles, mais un peu complexes! (public, private, no-cache, no-store, no-transform, max-age, must-revalidate, proxy-revalidate, …) Protocole HTTP 1.1 et expiration Accept-Language: fr-FR,fr; Accept-Encoding: gzip, deflate User-Agent: Mozilla/5.0 (Linux ; Android 6.0.1... HTTP/1.0 200 OK Date: Thu, 04 Jun 2015 20:39:14 GMT Cache-Control: public; max- age=31536000 269Ko
  • 22. 22#seocamp Et si le fichier change?
  • 23. 23#seocamp ▪ Ajout d’une chaîne de paramètres à l’URL du fichier (appel du même fichier, URL différente) ▪ Ex: /javascript-cms.js?v=2.3 ▪ Également appelé versionning Cache busting is the key La performance intimement liée au SEO
  • 24. 24#seocamp Last-modified • Consommation d’une requête seulement • On ne renvoie qu'une réponse partielle HEAD -> 304 Protocole HTTP 1.0 et validation Accept-Language: fr-FR,fr; Accept-Encoding: gzip, deflate User-Agent: Mozilla/5.0 (Linux ; Android 6.0.1... HTTP/1.1 200 OK Date: Thu, 04 Jun 2015 20:39:14 GMT Last-Modified: Thu, 02 Jun 2015 17:32:03 Accept-Language: fr-FR,fr; Accept-Encoding: gzip, deflate User-Agent: User-Agent: Mozilla/5.0 (Linux ; Android 6.0.1... If-Modified-Since: Thu, 02 Jun 2015 17:32:03 HTTP/1.1 304 not modified Date: Thu, 04 Jun 2015 20:39:14 GMT Last-Modified: Thu, 02 Jun 2015 17:32:03 269Ko 1 Ko
  • 25. 25#seocamp EntityTag • Etag = empreinte du fichier • Utile si un Last-Modified correspondant à une date de billet est renvoyée, et que le contenu autour a changé (ex: widgets, pub & co) Protocole HTTP 1.1 et validation Accept-Language: fr-FR,fr; Accept-Encoding: gzip, deflate User-Agent: Mozilla/5.0 (Linux ; Android 6.0.1... HTTP/1.1 200 OK Date: Thu, 04 Jun 2015 20:39:14 GMT ETag: "UreJ2g" Accept-Language: fr-FR,fr; Accept-Encoding: gzip, deflate User-Agent: Mozilla/5.0 (Linux ; Android 6.0.1... If-None-Match: "UreJ2g" HTTP/1.1 304 not modified Date: Thu, 04 Jun 2015 20:39:14 GMT ETag: "UreJ2g" 269Ko 1 Ko
  • 27. 27#seocamp Attention, le cycle de vie des ressources dépend des sites et de vos besoins: c’est un ordre de grandeur… HTML JS CSS Images PDF, fonts TTL Minutes/ Heures Jours/Mois Jour/mois Mois/année Mois/Année Commentaires Dépend des contenus de la page Versionning si besoin Versionning si besoin Renommer les fichiers si besoin - Durée de vie des ressources Ça depend, ça depasse!
  • 28. 28#seocamp ▪ Balises de pagination <link rel=next….> ▪ Balise prefetch (slides, carousel, habitudes des utilisateurs) <link rel="prefetch" href="/autre_page.html"> Le cache par anticipation La performance intimement liée au SEO
  • 29. 29#seocamp Les caches serveur Sommaire ▪ C'est quoi un cache serveur ? ▪ Pourquoi cache-t-on ? ▪ Quels sont les différents types de cache coté serveur ? ▪ Que cache-t-on et pour combien de temps ? ▪ Qu'est ce qu'on ne cache pas ? ▪ Cas concrets : avant / après ▪ Quels sont les effets de bords d’un reverse proxy ? ▪ Astuces, légendes urbaines et pièges à éviter
  • 30. 30#seocamp Un cache serveur est un mécanisme de stockage des ressources (page html, image, fichier javascript, fichier css, ...) de manière statique, le serveur génère la ressource, la stocke ‘en dur’ puis la sert ensuite au client avec une date de péremption. Lorsque la date de péremption est atteinte le serveur régénère la ressource à la première sollicitation, c’est à dire au premier visiteur qui la demande (humain ou bot). C'est quoi un cache serveur ? Quelques précisions https://www.smashingmagazine.com/2016/05/modern-wordpress-server-stack/
  • 31. 31#seocamp  La mise en cache coté serveur permet de soulager énormément la charge du serveur et de grandement améliorer la vitesse de ‘livraison’ des ressources.  Une ressource en cache ne nécessite qu’une action de lecture sur le disque dur ou sur la mémoire vive du serveur.  Une ressource non cachée sollicite le serveur web, le langage de script associé (php, js, python, …), la base de donnée. Pourquoi cache-t-on ? Pour gagner du temps
  • 32. 32#seocamp  Un cache efficace coté serveur permet de multiplier le nombre de visiteurs simultanés sans changer d’infrastructure.  Un cache efficace coté serveur permet d’améliorer l’expérience utilisateur.  Un cache efficace permet d’accélérer le crawl par les bots. Pourquoi cache-t-on ? Pour gagner de l’argent
  • 33. 33#seocamp  Reverse proxy (le graal)  Permet de soulager l’intégralité du serveur car le cache est puisé directement en mémoire serveur sans intermédiaire applicatif.  Permet d’agir également en load balancer.  Peut être difficile a mettre en place et a maintenir Les types de cache Quels sont les différents types de cache coté serveur ?
  • 34. 34#seocamp  Cache de code (APC, ...) permet de compiler le code  Evite la phase de compilation du script  Cache de ressource (Memcache, ...)  Intervient en milieu de chaine, cache d’objets, soulage essentiellement la BDD Cache applicatif Quels sont les différents types de cache coté serveur ?
  • 35. 35#seocamp  Cache de page CMS (smarty, WPRocket, WPTotalcache, …)  Intervient en fin de chaine, cache de ressources.  Permet de piloter simplement Varnish et de s’assurer que les 2 caches sont synchronisés. Cache CMS Quels sont les différents types de cache coté serveur ?
  • 36. 36#seocamp  Permet de soulager la base de donnée sur les requêtes coûteuses et récurrentes, par exemple les facettes les plus consultées d’un ecommerce. (query cache + 238 % d’apres mysql sur les select)  Généralement à implémenter au niveau du code ou de l’ORM  Si vous utilisez massivement le cache de requêtes pour la recherche alors vous devriez surement déporter votre fonctionnalité recherche sur une technologie dédié à cela : elasticsearch Cache base de donnée Quels sont les différents types de cache coté serveur ?
  • 37. 37#seocamp  Tout ce qui transite par http peut être caché : pages html, javascript, css, images, pdf, …  La durée de vie (date de péremption) de chaque ressources peut être différente, elle dépend avant tout de vos besoins. Par exemple les pages produit d’un site ecommerce peuvent avoir une durée de vie de 1h alors que la page home peut avoir une durée de vie de 3h ou plus. To cache ? Que cache-t-on et pour combien de temps ?
  • 38. 38#seocamp  ATTENTION : ne pas confondre la durée de vie d’une ressource coté serveur et les entêtes de cache (Expires et Cache-control). En effet une ressource peut tout a fait être régénérée coté serveur avant son expiration coté client, ou inversement. To cache ? Que cache-t-on et pour combien de temps ?
  • 39. 39#seocamp  Les pages hautement personnalisées.  Les pages qui enregistre des données (formulaires)  De manière générale toutes les requêtes POST, les back- offices, les tunnels de conversion, les espaces perso. Or not to cache ? Qu'est ce qu'on ne cache pas ?
  • 40. 40#seocamp Carla-bikini.com sur prestashop 1.6 multiboutique et https Avant : devais doubler son d’infrastructure pour accompagner sa croissance, TTFB : 1,2s Après : pas besoin de faire évoluer l’infrastructure, TTFB : 0,4s code promo NET10 -10 % hors points rouge Cas concrets Varnish : avant / après Des chiffres
  • 41. 41#seocamp Lemoncurve.com sur prestashop 1.4 (avant mars 2017, racheté et migré par shopinvest depuis) Avant : 1500€ d’infrastructure par mois + des sueurs froides lors des soldes, TTFB : 2s Après : 700€ d’infrastructure par mois, plus de sueurs froides lors des soldes ou passage TV, TTFB : 0,2s Cas concrets Varnish : avant / après Des chiffres
  • 42. 42#seocamp  Besoin de développements complémentaires dans certains cas pour garder un certain dynamisme des pages tout en gardant un cache efficace. (ajax ou ESI pour les zones panier Prestashop par exemple)  Besoin de faire des concessions pour avoir le cache le plus performant possible (ou pas au détriment du cache), par exemple afficher tous les prix en TTC sur une boutique quelque soit le pays de l’ip du visiteur. Si on souhaite afficher du HT pour les pays etranger alors on maintiendra 2 caches différents. Effets de bords Quels sont les effets de bords d’un reverse proxy ?
  • 43. 43#seocamp  Un mauvais réglage de cache peut s’avérer catastrophique.  Pensez a auditer soigneusement le site et ses réglages métier avant la mise en place et la configuration d’un reverse proxy comme Varnish.  On ne peut pas mettre en place Varnish sur Prestashop → FAUX  On ne peut pas mettre en place Varnish avec https → FAUX  Utiliser un réchauffeur de cache  Réglez soigneusement vos entêtes d’expiration Astuces et pièges Astuces, légendes urbaines et pièges à éviter