Web perf et rdc par Stephane Rios

104
Make It Fast, Keep It Fast OUAT Conf Nantes 30/11/2011 Stéphane RIOS - Fasterize - @stefounet

description

Stephane Rios, ex-CTO de Rue du Commerce et CEO/CTO à Fasterize, présentait à la Cantine numérique de Nantes son parcours, sa vision et les enjeux de la Web Performance.

Transcript of Web perf et rdc par Stephane Rios

Page 1: Web perf et rdc par Stephane Rios

Make It Fast, Keep It Fast

OUAT Conf Nantes30/11/2011

Stéphane RIOS - Fasterize - @stefounet

Page 2: Web perf et rdc par Stephane Rios

Quelques précautions

Page 3: Web perf et rdc par Stephane Rios

Agenda • Mon parcours

• Un peu de Lean, d’Agile, voire de DevOps

• WebPerf

• enjeux et contexte

• technologies, règles, outils

• fasterize

• futur

Page 4: Web perf et rdc par Stephane Rios
Page 5: Web perf et rdc par Stephane Rios

N.talgie ...• ZX Spectrum en 1982, VIC20, C64, consoles, etc ...

• (des études)

• Gopher, Veronica, www en mode 3270 en1993

• première page HTML en 1994 (NCSA Mosaic)

• serveur Web en 1994 sur windows 3.11

• Webnet (“webagency”) en 1996

• RueDuCommerce en 2000

Page 6: Web perf et rdc par Stephane Rios

Chasseur d’octet et de ms• démarrage à une époque où les ressources sont rares et

limitées (on optimise au maximum ce dont on dispose)

• premier site : intranet compta France Telecom, 90% des pages < 5ko, 16 couleurs

• toujours à traquer l’octet en trop, la requête qui met trop de temps

Page 7: Web perf et rdc par Stephane Rios

RueDuCommerce.com• “leader du eCommerce en France”

• distribution classique (depuis aout 1999)

• galerie marchande (août 2007)

• 370 M€ de volume d’affaire

• 8 millions de visiteurs / mois

• 100 millions de pages vues /mois

• plusieurs milliards de hits / mois

• pure player

• croissance rentable

Page 8: Web perf et rdc par Stephane Rios

Startup “fourmi”• “vieille startup” (pas vraiment hackathon ...)

• d’abord CTO Adjoint puis CTO

• premier chantier : optimisation

• réécriture d’une bonne partie du site 3 frontaux jusqu'en 2004

• pas dans l'esprit : “on a qu'à rajouter des serveurs, CPU, RAM, disque”

• optimisation à fond des ressources (meilleure scalabilité)

Page 9: Web perf et rdc par Stephane Rios

Un peu de technique • 3 datacenters, 200 serveurs, 2 CDN

• Load balancing local & global (F5, LVS)

• Base de données SQL Server 2000 / 2005 / 2008 & MySQL

• Réplication dans tous les sens

• Coeur de réseau fibre optique éclairée

• PHP5, ColdFusion5

• Moteur de recherche : Sinequa Intuition

• Cache à tous les étages !

Page 10: Web perf et rdc par Stephane Rios

Du trafic !

Page 11: Web perf et rdc par Stephane Rios

Volumétrie • 10 millions de users

• 20 millions d’offres

• des tables plusieurs centaines de millions d’enregistrements

• 5000 hits/s

• 15 millions de pages indexées dans Google

• chaque octet compte !

Page 12: Web perf et rdc par Stephane Rios

Résultat

Page 13: Web perf et rdc par Stephane Rios

Et après ?• la perf est un état d’esprit global (et peu de personnes

l’ont)

• CTO c’est quand même la meilleure place

• le “one-again” (ie à l’arrache) ne tient pas dans la durée

• développer le moins possible

• mettre en place une usine de dev

• tester

• passer aux méthodes Agile !

• comprendre la technique et le business est un atout majeur

Page 14: Web perf et rdc par Stephane Rios

Slide qui tue• Lean

• Agile

• DevOps

• Lean Startup

Page 15: Web perf et rdc par Stephane Rios

Développement Agile• Approche prédictive vs Approche adaptative (itération)

• 3 choses qu’on tient pour vrai :

• le “client” sait ce qu’il veut

• le développeur sait comment le construire

• surtout rien ne change en cours de route !

• mais nous devons plutôt vivre avec :

• le client découvre ce qu’il veut

• le développeur découvre comment le construire

• le monde change !

Page 16: Web perf et rdc par Stephane Rios

Coût du changement

Page 17: Web perf et rdc par Stephane Rios

Valeurs

Page 18: Web perf et rdc par Stephane Rios

Valeurs• Keep It Smart & Simple

Page 19: Web perf et rdc par Stephane Rios

Valeurs• Keep It Smart & Simple

• Build quality in

Page 20: Web perf et rdc par Stephane Rios

Valeurs• Keep It Smart & Simple

• Build quality in

• Eliminate waste, remove impediments

Page 21: Web perf et rdc par Stephane Rios

Valeurs• Keep It Smart & Simple

• Build quality in

• Eliminate waste, remove impediments

• Go fast / Fail Fast

Page 22: Web perf et rdc par Stephane Rios

Valeurs• Keep It Smart & Simple

• Build quality in

• Eliminate waste, remove impediments

• Go fast / Fail Fast

• Measure all

Page 23: Web perf et rdc par Stephane Rios

Valeurs• Keep It Smart & Simple

• Build quality in

• Eliminate waste, remove impediments

• Go fast / Fail Fast

• Measure all

• Respect people !

Page 24: Web perf et rdc par Stephane Rios

Valeurs• Keep It Smart & Simple

• Build quality in

• Eliminate waste, remove impediments

• Go fast / Fail Fast

• Measure all

• Respect people !

• Transparency

Page 25: Web perf et rdc par Stephane Rios

Valeurs• Keep It Smart & Simple

• Build quality in

• Eliminate waste, remove impediments

• Go fast / Fail Fast

• Measure all

• Respect people !

• Transparency

• Embrace failure

Page 26: Web perf et rdc par Stephane Rios

Valeurs• Keep It Smart & Simple

• Build quality in

• Eliminate waste, remove impediments

• Go fast / Fail Fast

• Measure all

• Respect people !

• Transparency

• Embrace failure

• Automate all U can

Page 27: Web perf et rdc par Stephane Rios

Valeurs• Keep It Smart & Simple

• Build quality in

• Eliminate waste, remove impediments

• Go fast / Fail Fast

• Measure all

• Respect people !

• Transparency

• Embrace failure

• Automate all U can

• JFDI

Page 28: Web perf et rdc par Stephane Rios

Valeurs• Keep It Smart & Simple

• Build quality in

• Eliminate waste, remove impediments

• Go fast / Fail Fast

• Measure all

• Respect people !

• Transparency

• Embrace failure

• Automate all U can

• JFDI Just Fucking ItDo

Page 29: Web perf et rdc par Stephane Rios

Make It Fast, Keep It Fast

De la Webperf !(enfin)

Page 30: Web perf et rdc par Stephane Rios

De nombreuses études réalisées par Amazon [1],

Google[2], Yahoo[3], AOL[4], Bing[5] ou bien Shopzilla[6]

ont montré que la performance Web avait un

impact direct et fort sur le business des sites Web

Les enje3

Page 31: Web perf et rdc par Stephane Rios

Les enje3• Sur le chiffre d’affaire [1] : chez Amazon,100 ms de temps

de chargement en plus provoque une baisse de 1% de chiffre d’affaire

• Sur le référencement naturel [7] : selon la communauté des webmasters, au delà de 4s, Google modifie son classement

• Sur le trafic [3] : selon Yahoo, une page plus lente de 400ms provoque une baisse de trafic d’environ 10% sur cette page

Page 32: Web perf et rdc par Stephane Rios

Bing• p

Page 33: Web perf et rdc par Stephane Rios

AOL• Les  pages  les  plus  lentes  sont  celles  qui  ont  le  moins  de  trafic

Page 34: Web perf et rdc par Stephane Rios

Pub• A user who has to endure an 8-second download delay

spends only 1% of their total viewing time looking at the featured promotional space on a landing page.

In contrast, a user who receives instantaneous page rendering spends 20% of viewing time within the promotional area.

Page 35: Web perf et rdc par Stephane Rios
Page 36: Web perf et rdc par Stephane Rios

Perception• L’ analyse des ondes cérébrales révèle que les internautes

doivent se concentrer jusqu'à 50% de plus lors de l'utilisation de sites Web répondant mal.

• Un internaute perçoit un site environ 15% plus lent qu’il n’est réellement. Quand il en parle, il annonce 35% de plus !

• Ce sont les premiers éléments d’une page qui comptent le plus

Page 37: Web perf et rdc par Stephane Rios

Perception

!"#

$%"#&&"#

&'"#

!"#

$"#

%!"#

%$"#

&!"#

&$"#

'!"#

'$"#

(!"#

&#)#(#*+,-./+*# &#)#0#*+,-./+*# &#)#1#*+,-./+*# &#)#%!#*+,-./+*#

"#()*+,-./

0*12

/#(+

#0*+3#()*4*

/(2/

#

56*/,.-./0#(*/7#8.#0.-97#(.#:6*;,.-./0#

Page 38: Web perf et rdc par Stephane Rios
Page 39: Web perf et rdc par Stephane Rios

Les enje3• Les internautes ne veulent plus attendre ! [12]

!"#$%&'($#" )"#$%&'($#" *"#$%&'($#" +"!"

#"

$"

%"

&"

'"

("

)"

*"

+"

#+++" $!!(" $!!+" $!#$"

,$-.#"-/01-2-"(3/4$'5$"./6"2'"1'5$6'/25$"

Page 40: Web perf et rdc par Stephane Rios

Règle d’or

Page 41: Web perf et rdc par Stephane Rios

Règle d’or• 10 Golden Principles for Building Successful Web

Applications

• 1. Speed

• “First and foremost, we believe that speed is more than a feature. Speed is the most important feature. If your application is slow, people won’t use it.”

Page 42: Web perf et rdc par Stephane Rios

Règle d’or• 10 Golden Principles for Building Successful Web

Applications

• 1. Speed

• “First and foremost, we believe that speed is more than a feature. Speed is the most important feature. If your application is slow, people won’t use it.”

• Fred Wilson (Entrepreneur, Twitter, del.icio.us ..)

Page 43: Web perf et rdc par Stephane Rios
Page 44: Web perf et rdc par Stephane Rios

Tous Googlisés !

Page 45: Web perf et rdc par Stephane Rios

Tous Googlisés !• Google est (ultra)rapide

Page 46: Web perf et rdc par Stephane Rios

Tous Googlisés !• Google est (ultra)rapide

• Amazon est rapide

Page 47: Web perf et rdc par Stephane Rios

Tous Googlisés !• Google est (ultra)rapide

• Amazon est rapide

• Facebook est rapide

Page 48: Web perf et rdc par Stephane Rios

Tous Googlisés !• Google est (ultra)rapide

• Amazon est rapide

• Facebook est rapide

• Un seul Internet

Page 49: Web perf et rdc par Stephane Rios

Tous Googlisés !• Google est (ultra)rapide

• Amazon est rapide

• Facebook est rapide

• Un seul Internet

• Du point de vue des internautes, il n’y a pas de raison à ce que votre site soit plus lent que la recherche Google ou que le site d'Amazon.

Page 50: Web perf et rdc par Stephane Rios

Le cont4te• Les performances d’un site Web dépendent [13] :

• du temps de réponse du serveur (~20% du total)

• du temps de chargement des pages HTML (~80% du total)

• Les pages sont devenues (hyper)complexes

• Pourtant on a l’ADSL non ?

• la latence n’est (presque) pas une une question de débit !

• users don’t leave in datacenters !

Page 51: Web perf et rdc par Stephane Rios

Compl4ité!"#$$%! &'##!

&!()(*(+,-!#!./*01+!#'!21)/34,(-!

$%!()(*(+,-!#&!./*01+-!56'!21)/34,(-!

2 éléments, 1 domaine, 10 Ko

96 éléments, 12 domaines, 530 Ko

Page 52: Web perf et rdc par Stephane Rios

Compl4ité

DES PAGES DE PLUS EN PLUS COMPLEXES

~15ko2,3 objets

~498ko75 objets

~700Ko83 objets

Page 53: Web perf et rdc par Stephane Rios
Page 54: Web perf et rdc par Stephane Rios

5ird Party• Widget “sociaux”

• facebook, google+, twitter

• disqus, addthis

• Pub

• les pires ...

• Analytics

• Autre

• retargeting

• cross-selling

• etc ...

Page 55: Web perf et rdc par Stephane Rios

Waterfall

Page 56: Web perf et rdc par Stephane Rios

Waterfall !

Page 57: Web perf et rdc par Stephane Rios

Waterfall ?

Page 58: Web perf et rdc par Stephane Rios
Page 59: Web perf et rdc par Stephane Rios

Organisation• Les organisations sont complexes

• les acteurs sont multiples

• les sources de contenu sont multiples

• pas prioritaire longtemps

• et surtout pas orientées pour générer de la perf

• Accélérer c’est possible pour tout le monde

• S’organiser pour aller vite constamment demande un peu plus de travail !

• VelocityConf ≠ SpeedConf

Page 60: Web perf et rdc par Stephane Rios
Page 61: Web perf et rdc par Stephane Rios

Un chantier sans fin

Page 62: Web perf et rdc par Stephane Rios

Les tables de la Loi1. Make Fewer HTTP Requests

2. Use a Content Delivery Network

3. Add an Expires Header

4. Gzip Components

5. Put Stylesheets at the Top

6. Put Scripts at the Bottom

7. Avoid CSS Expressions

8. Make JavaScript and CSS External

9. Reduce DNS Lookups

10. Minify JavaScript

11. Avoid Redirects

12. Remove Duplicate Scripts

13. Configure ETags

14. Make AJAX Cacheable

Page 63: Web perf et rdc par Stephane Rios

Le No7eau Testament• Async Loading JS / CSS

• Sprites

• Lazy Loading

• SPDY

• Domain Sharding

• Cookieless domain

• prefetch / prerender

• dns prefetch

• Cache

Page 64: Web perf et rdc par Stephane Rios

Et le mobile ?• C’est pire !

• browser moins puissant

• machines moins puissantes

• le fonctionnement du réseau est différent

• Les règles sont soit complètement différentes, soit encore plus importantes

• Solution : un site mobile différent du site “desktop” !

• problème de maintenance

• les utilisateurs préfèrent le “vrai” site, ils attendent la même expérience

Page 65: Web perf et rdc par Stephane Rios

Résumé• Les organisations sont complexes

• Les règles sont complexes

• Elle nécessite des expertises fortes et multiples (de TCP/IP à CSS3 !)

• C’est un domaine en évolution constante (IE6 à Chrome 15 !)

• C’est un chantier sans fin ...

• ... qui finit par ne plus être prioritaire

Page 66: Web perf et rdc par Stephane Rios

Les outils• Monitoring

• IPLabel, Gomez, Keynote, ...

• Check “one shot”

• Yslow

• Page Speed

• WebPageTest (webpagetest.org ou wpt.fasterize.com)

• Dynatrace

• Optimizers de composants

• SpriteMe

• SmushIt

• Closure Compiler

Page 67: Web perf et rdc par Stephane Rios

Les métriques• Note globale

• TTFB

• Start Render

• AFT

• Page Load Time

• Nb de requêtes

• Poids, complexité du DOM

• Time To First Click (© stefounet)

• technique

• business

Page 68: Web perf et rdc par Stephane Rios

DIY vs Automate

Page 69: Web perf et rdc par Stephane Rios

DIY vs Automate

Page 70: Web perf et rdc par Stephane Rios

WPOA• Software

• mod_pagespeed

• plugins pour certains CMS

• Hardware

• Strangeloop

• “Cloud”

• yottaa, torbit, strangeloop, cloudflare, blaze

• Fasterize !

Page 71: Web perf et rdc par Stephane Rios

Faster8e• Fasterize est un accélérateur de site Web en mode SaaS

• Fasterize intervient sur le temps de chargement des pages HTML et simplifie la mise en oeuvre de ces optimisations

• Une équipe de geeks

• Des fondateurs reconnus pour leur expérience

• Stéphane RIOS, CEO

• Vincent Voyer, expert Web Performance

• Advisory Board : ex-CTO de Dailymotion, CEO de Viavoo, ...

Page 72: Web perf et rdc par Stephane Rios

Notre offre• Une optimisation en temps réel du temps de chargement

des pages HTML

• Une offre SaaS (Software as a Service)

• sous forme d’abonnement mensuel

• un tarif en fonction du nombre de pages vues / mois

• Sans contraintes

• pas de coûts d’investissements, pas d’engagement (SaaS)

• intégration et évolutions transparentes (matérielle, logicielle, process),

• Transfert de compétences en option (audit, conseil)

Page 73: Web perf et rdc par Stephane Rios

Comment ça marche ?

Page 74: Web perf et rdc par Stephane Rios

Comment ça marche ?

,$-%'./$ )*+

('$#'image

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"!

G ogle

web html

o

scriptimage

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"!

script

CSS

Sans Fasterize : les pages sont lourdes et lentes à charger

Page 75: Web perf et rdc par Stephane Rios

Comment ça marche ?

Google

)*+

!"#$%&'$#'

html

,$-%'./$ script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"!

web

Page 76: Web perf et rdc par Stephane Rios

Comment ça marche ?

Google

)*+

!"#$%&'$#'

html

,$-%'./$ script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"!

web

Compression

Page 77: Web perf et rdc par Stephane Rios

Comment ça marche ?

Google

)*+

!"#$%&'$#'

html

,$-%'./$ script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"!

web

CompressionConcaténation

Page 78: Web perf et rdc par Stephane Rios

Comment ça marche ?

Google

)*+

!"#$%&'$#'

html

,$-%'./$ script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"!

web

CompressionConcaténation

Optimisation du cache

Page 79: Web perf et rdc par Stephane Rios

Comment ça marche ?

Google

)*+

!"#$%&'$#'

html

,$-%'./$ script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"!

web

CompressionConcaténation

Optimisation du cacheRéorganisation du code

Page 80: Web perf et rdc par Stephane Rios

Comment ça marche ?

Google

)*+

!"#$%&'$#'

html

,$-%'./$ script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"!

web

CompressionConcaténation

Optimisation du cacheRéorganisation du code

...

Page 81: Web perf et rdc par Stephane Rios

Comment ça marche ?

Google

)*+

!"#$%&'$#'

html

,$-%'./$ script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"! script

imageCSS

Datas

!""!!"!""!"!!!"!!!"""""!"!"""!"!!""!!""!"""!!!"!"!!!"""!!"!"!!!""""!!"!!!"!"!!""""!!"!!"!"!

web

CompressionConcaténation

Optimisation du cacheRéorganisation du code

...Avec Fasterize : des pages optimisées et rapides à charger

Page 82: Web perf et rdc par Stephane Rios

Les bénéfices business• Augmentation du taux de transformation

• Augmentation du trafic

• pages vues

• temps passé par visite

• Augmentation de la satisfaction utilisateur

• Amélioration de l’image

• Amélioration du référencement naturel

Page 83: Web perf et rdc par Stephane Rios

Les bénéfices IT• Des équipes IT focus sur le développement de nouvelles

fonctionnalités (productivité)

• Le manque de ressources techniques ne pénalise pas les performances du site

• Un impact immédiat, sans attendre des semaines de développements

• Des économies de bande passante et de matériel

Page 84: Web perf et rdc par Stephane Rios

Fonctionnalités

• Perception (start render)

• async loading js

• lazy loading images

• Optimisation de contenu

• minification JS / CSS

• concaténation JS / CSS

• compression (gzip, images)

• Gestion de cache

• optimisation des TTL

• URL versionning

• Réseau

• domain sharding

• cookie-less domains

• Le moteur de Fasterize intervient à plusieurs niveaux

Page 85: Web perf et rdc par Stephane Rios
Page 86: Web perf et rdc par Stephane Rios
Page 87: Web perf et rdc par Stephane Rios

Mise en oe7re• Pas de modification de code et d’infrastructure

• Pas de paramétrages spécifiques

• Possibilité de tester dans un environnement séparé mais identique à la production (plateforme de staging)

• Sans danger

• plateforme hautement tolérante aux pannes, validée par des tests de charge, architecture distribuée

• autoscaling (ajout de serveurs automatiquement en fonction de la charge)

• coupe circuit via un opérateur indépendant : en cas de problème grave sur l’infrastructure de Fasterize, le trafic est routé vers les serveurs d’origine

Page 88: Web perf et rdc par Stephane Rios

Mise en oe7re • Le site Web dispose déjà d’un CDN ?

• configuration de l’origine des CDN en origin.monsite.com.fasterized.com

• c’est parti !

• Le site Web ne dispose pas d’un CDN ?

• configuration de plusieurs CDN choisis par Fasterize

• configuration de l’origine des CDN

• c’est parti !

• CDN = Content Delivery Network (Akamaï, Cotendo, CloudFront, etc ...)

Page 89: Web perf et rdc par Stephane Rios

Mise en oe7re• Possibilité de tester en live les résultats d’une optimisation

pour le site entier

• Nécessite peu de préparatif et de configuration (DNS)

• Aucune préparation de la part du site testé

Page 90: Web perf et rdc par Stephane Rios

Futur

Page 91: Web perf et rdc par Stephane Rios

Futur • Browser : disparition d’IE6/IE7/IE8, HTML5, accélération

matérielle

Page 92: Web perf et rdc par Stephane Rios

Futur • Browser : disparition d’IE6/IE7/IE8, HTML5, accélération

matérielle

• Google Instant Pages

• utilisation du prerendering

• déjà actif avec Chrome, sur les premiers résultats de la page de recherche

Page 93: Web perf et rdc par Stephane Rios

Futur • Browser : disparition d’IE6/IE7/IE8, HTML5, accélération

matérielle

• Google Instant Pages

• utilisation du prerendering

• déjà actif avec Chrome, sur les premiers résultats de la page de recherche

• Amazon Silk

• dynamic split of rendering in the Cloud

Page 94: Web perf et rdc par Stephane Rios

Futur • Browser : disparition d’IE6/IE7/IE8, HTML5, accélération

matérielle

• Google Instant Pages

• utilisation du prerendering

• déjà actif avec Chrome, sur les premiers résultats de la page de recherche

• Amazon Silk

• dynamic split of rendering in the Cloud

!"#$%&'()*+&,(

Kindle Fire EC2

Page 95: Web perf et rdc par Stephane Rios

Futur • Browser : disparition d’IE6/IE7/IE8, HTML5, accélération

matérielle

• Google Instant Pages

• utilisation du prerendering

• déjà actif avec Chrome, sur les premiers résultats de la page de recherche

• Amazon Silk

• dynamic split of rendering in the Cloud

!"#$%&'()*+&,(

Kindle Fire EC2

!"#$%&'()*+&,(

Kindle Fire EC2

Page 96: Web perf et rdc par Stephane Rios

Futur • Browser : disparition d’IE6/IE7/IE8, HTML5, accélération

matérielle

• Google Instant Pages

• utilisation du prerendering

• déjà actif avec Chrome, sur les premiers résultats de la page de recherche

• Amazon Silk

• dynamic split of rendering in the Cloud

!"#$%&'()*+&,(

Kindle Fire EC2

!"#$%&'()*+&,(

Kindle Fire EC2

!"#$%&'()*+&,(

Kindle Fire EC2

Page 97: Web perf et rdc par Stephane Rios

Conclusion• Cdiscount vs RueDuCommerce

Page 98: Web perf et rdc par Stephane Rios

Conclusion• Cdiscount vs RueDuCommerce

Page 99: Web perf et rdc par Stephane Rios

Conclusion bonus

Page 100: Web perf et rdc par Stephane Rios

Sources• [1] http://glinden.blogspot.com/2006/11/marissa-mayer-at-web-20.html et https://sites.google.com/site/

glinden/Home/StanfordDataMining.2006-11-28.ppt?attredirects=0

• [2] Google, Bing : http://en.oreilly.com/velocity2009/public/schedule/detail/8523

• [3 ]Yahoo! : http://www.slideshare.net/stoyan/yslow-20-presentation

• [4] AOL: http://en.oreilly.com/velocity2009/public/schedule/detail/7579

• [5] Bing : http://www.watchingwebsites.com/archives/proof-that-speeding-up-websites-improves-online-business

• [6] Shopzilla : http://en.oreilly.com/velocity2009/public/schedule/detail/7709

• [7] http://www.seroundtable.com/page-load-time-google-ranking-factor-2011-12825.html et http://www.webmasterworld.com/google/4254879.htm

• [8] http://www.useit.com/alertbox/response-times.html

• [9] Stoyan Stefanov : http://www.phpied.com/psychology-of-performance/

• [10] Adwords : http://adwords.google.com/support/aw/bin/answer.py?hl=en&answer=87144

• [11] RueDuCommerce : http://www.journaldunet.com/ebusiness/commerce/rue-du-commerce-performant-a-noel.shtml

• [12] http://blog.smartbear.com/post/09-10-14/5-10-15-seconds-How-Long-Will-You-Wait-For-a-Web-Page-to-Load/

• [13] http://developer.yahoo.com/blogs/ydn/posts/2007/03/high_performance/

Page 101: Web perf et rdc par Stephane Rios

Références• Fred Wilson’s 10 Golden Principles of Successful Web Apps :

http://thinkvitamin.com/web-apps/fred-wilsons-10-golden-principles-of-successful-web-apps/

• http://agilesoftwaredevelopment.com/leanprinciples

• http://blog.davidsingleton.org/mobiletcp

• http://www.measureworks.nl/en/

• http://www.webperformancetoday.com/

• http://www.strangeloopnetworks.com/web-performance-optimization-hub/

• http://www.paperplanes.de/2011/7/25/web_operations_101_for_developers.html

Page 102: Web perf et rdc par Stephane Rios

Lectures• Implementing Lean Software Development : from Concept to Cash - Mary

& Tom Poppendieck

• Le But - Eliyahu M. Goldratt

• Hors piste - Pierre Letourneur (ouvrage collectif)

• Hors de la crise - W. Edwards Deming

• Scrum And XP from the trenches - Henry Kniberg

• Building Scalable Websites - Cal Henderson

• High Performances WebSite - Steve Souders

• Even Faster WebSite - Steve Souders & Al

• L’art de démotiver ses collaborateurs et de saborder son entreprise - François Bocquet

• Partageons ce qui nous départage - ouvrage collectif (Octo)

Page 103: Web perf et rdc par Stephane Rios

• Je suis à votre disposition !

• mail : [email protected]

• twitter : http://twitter.com/fasterize

• site web : http://www.fasterize.com

• linkedin : http://www.linkedin.com/company/fasterize

• téléphone : +33 6 30 26 44 80

Contacts

Page 104: Web perf et rdc par Stephane Rios