8. 100 ms = 1% de CA en moins
• 57 % des visiteurs quittent un site e-commerce s'il met plus
de 4 secondes à s'afficher
• 26 % des visiteurs quittent un site e-commerce s'il met plus
de 2 secondes à s'afficher
• 60% des mobinautes s'attendent à un chargement de 3s
maximum pour un site mobile
• ... Et 74% quittent une page après 5 secondes d'attente
9. Des attentes fortes
• 71% des mobinautes s’attendent à ce qu’une page web se
charge au moins aussi rapidement sur mobile que sur
ordinateur (contre 58% en 2009)
• 46% estiment que les sites se chargent généralement plus
lentement sur mobile que sur ordinateur
• Pour 60% des mobinautes, une page web doit se charger en
moins de 3 secondes sur un mobile
14. « On a la 4G non ? »
• “Facebook … will give
employees an
opportunity to see
what using the app
with an incredibly slow
connection feels like
and help close the
"empathy gap"
between Silicon Valley
and emerging
markets.”
15. « Il a Free, il a tout compris »
37% des possesseurs de
smartphone atteignent la
limite de leur forfait data
au moins une fois.
Bien 15% disent que ça
arrive « fréquemment » !
23. Mobile vs Desktop
• Taux de conversion mobile meilleurs si site plus rapide !
24. Impact SEO
• Google tient compte du
temps de réponse dans son
classement
• Google expérimente un
label “Slow” sur ses résultats
• Attention au HTTPS !
32. Métriques business
• Temps pour interagir avec la page (TTFC, TTI)
• Temps de parcours
• trouver un produit
• mettre un produit dans le panier
• finaliser une commande
33. Quel site web mobile ?
• m.monsite.fr
• double maintenance
• redirections pénalisantes
• Responsive
• la fausse bonne idée
• Adaptatif
• une URL, des contenus différents
34. Cache & CDN
• But : répondre plus vite et au plus près de l’internaute
• Cache
• plusieurs types (Varnish le plus connu)
• protège et soulage les backends
• CDN = Cache distribué
• Ne répond pas à toutes les situations
• tout n’est pas cachable (mais ESI/Ajax)
• le monde est vaste
• les latences réseaux peuvent être importantes
36. Third-Parties
• Plus de la moitié des requêtes et du
poids des pages mobiles !
• Beaucoup de redirections, de
résolutions DNS …
• … pour du contenu pas toujours
visible
• Attention au nombre mais surtout à
la façon de les charger !
38. Passer en HTTP2
• SPDY = pré-HTTP2
• Une seule connexion et
des requêtes multiplexées
(streams)
• Beaucoup de requêtes en
parallèles
• Compression des headers
• Server Push
39. Passer à AMP ?
• Accelerated Mobile Page
• Contraintes (très) fortes de webperf
• pages cachables
• chargement limité des scripts, widgets, etc …
• Limitations dans les fonctionnalités (pas de cart par ex)
• a démarré pour les sites de contenu
• seulement du parcours de catalogue aujourd’hui
• Activable facilement avec un CMS
40. En résumé
• Site adpatatif
• Cache & CDN
• Réduire le poids des pages
• compression, Gzip, minification
• Faire moins de requêtes
• concaténation, inlining, lazyloading
• Remplir la page au dessus de la ligne de flottaison
• lazyloading, deferJS, CSS le plus haut possible et inliné, progressive JPEG, Ajax
• Passer au HTTP2 ...
• ... et plus encore
• prefetching/preloading, sharding/unsharding, URL versionning, font async loading
41.
42. Fasterize
• Startup française indépendante créée il y a 5 ans
• Leader européen du FEO (Front End Optimization)
• Plus de 250 Millions de pages vues traitées par mois
• Présence internationale : Europe, Asie (Chine continentale),
Amérique du Nord, Amérique Latine
• Lauréat de nombreux concours : EBG, SFR, Ville de Paris,
Eurocloud
45. Use case
• Améliorer les temps de chargement
• taux de transfo
• SEO
• nb de pages vues / visites
• Absorber les pics de charge
• soldes
• passage TV
• ventes privées
• Mise en place de CDN / multi-CDN
• internationalisation
• Asie, Brésil, Turquie, Russie, Inde
50. Concrètement ?
• Pas de modification de code / pas de modification
d’infrastructure
• Etapes
• fiche technique à remplir
• mini audit + personnalisation de la configuration
• recette en mode « preview »
• mise en place tests A/B
• ajout d’un CNAME au niveau de l’enregistrement DNS ...
• Pas de mode projet
• Planning prévisionnel : 10/15 jours