SlideShare une entreprise Scribd logo
SOYEZ RAPIDES.
OU CHANGEZ DE JOB.
COUCOU C’EST NOUS (Netalis) : Opérateur & Hébergeur
● Société (SAS) fondée par une équipe de spécialistes des
infrastructures THD et services Internet (+10 ans d’expérience)
● Proximité : Siège social en région, à Besançon
● Équipe à taille humaine, support technique de proximité
● Spécialité : TPE, PME, ETI et collectivités locales
● Plateforme technique (Data Center) à Besançon et Paris : Vos
données transitent et restent en France
www.netalis.fr
Constat : ça rame !
● En 20 ans : on passe
de 56 kbps à 1G (!) en
FttH
● On passe de la 2G à
la 5G
● L’utilisateur est
impatient nativement
● Il faut délivrer (très)
vite les
contenus/services
Pourquoi ça rame ?
● Vieux matériels
● Vieux OS pas mis à
jour
● Vieux navigateurs
web
● LAN : CPL, WiFi …
● Débit connexion
● DNS FAI trop lent
● Peering saturé…
● Code pourri
● Hébergeur low cost...
LA #WEBPERF
● Sur le web, la
performance doit être la
clé de la réussite d’une
stratégie
● Un développeur qui
omet de rendre une app
réactive et rapide :
changez de job !
Source : https://blog.clever-age.com/fr/2012/07/31/webperf-a-
quelle-vitesse-ma-page-se-charge-t-elle/
Le SEO c’est has been : La WebPerf est LE point critique
● 100 ms de perdues = 1% de CA en moins (Amazon)
● 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
C’est Google qui le dit…
Mobile first : C’est pas gagné…
● Poids du mobile croissant sur les sites : pensez au responsive… et
ses conséquences sur la performance du site en mobilité !
● Taux de transformation sur le mobile fortement impacté par de
mauvais temps de réponse : Connexion 3G/4G pas toujours bonne
● Google Speed Update : « Si t’es pas rapide, tu grimpes pas »
● Web App ou Native app : that is the question ! (mais le besoin de
perf reste le même)
Transformez-vous en utilisateur final (aka Mme Michu)
● Passer d’une vision performance
infrastructure « IT » à une vision
performance vue du Client (marketing)
● Si vous n’avez pas de mesure de la
performance vue du client de bout en
bout sur le mobile et sur le Desktop :
FAUTE (et corrigez ça grâce au Real
User Monitoring)
C’est la cata sur le taux de rebond
La WebPerf : mix d’IT et de marketing web
• Des objectifs de perf partagés par le métier et l’IT, le
marketing, la créa… : Amélioration de plusieurs secondes
du temps d’affichage partout (web, mobile)
• S’adosser à un partenaire expert pour toutes les actions
possibles à externaliser
• Travailler plus en profondeur le code pour aller chercher
des améliorations supplémentaires
La WebPerf : C’est aussi pour l’artistique
● Utilisez des outils de monitoring pour avoir une vision
identique à celle du Client (Dynatrace, Dareboost…)
● Le travail de la webperf est un travail qui doit se faire
main dans la main avec les créatifs : UX/UI, suivi des
temps de réponses des partenaires sur le site
(webpagetest)
Les termes essentiels de la WebPerf
● TTFB (Time to First Byte)
● Start Render
● Speed Index
● First Interactive
● Backend
● CDN
● FEO
● …
Les métriques techniques à surveiller
● Temps de réponse serveur
● TTFB
● DomContentLoaded (=
DomReady)
● Onload
Waterfall WebPageTest.org
Métriques UX à surveiller
• Start Render
• Speed Index
• First ContentFul Paint
• First Interactive
• Visually Complete
Attention aux outils tiers !
• Publicités
• Scripts tiers
(analytics, etc)
Faites chauffer le cache (et pas le ca$h)
Un seul but : répondre plus vite et au plus près de l’internaute
● Cache local
○ plusieurs types : Block / FullPage / APC / HTTP
○ protège et soulage les backends
● CDN (Réseau de distribution de contenus) : Cache distribué
○ Ne répond pas à toutes les situations
○ tout n’est pas cachable (mais ESI/Ajax)
● Le monde est vaste et les latences réseaux peuvent être importantes : optez pour le multi-CDN avec
un bon aiguilleur de trafic (Cedexis) !
La WebPerf, c’est la micro-chirurgie du web
Source : Fasterize
WebPerf : Une attention particulière pour…
● 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
○ Gérer les pays compliqués : Asie, Brésil, Turquie, Russie, Inde
On résume ?
● Développer et tester en continu : La préprod est indispensable avec un
environnement stable
● Héberger avec des serveurs web modernes et des applicatifs optimisés
(Nginx, etc) : pensez au Cloud (IaaS) pour gérer les pics de charge
● Mettre en place une stratégie FEO automatisée
● Réaliser des tests de montée en charge AVANT de passer en prod
● Utiliser un ou plusieurs caches / CDN pour délivrer le contenu au plus
proche de l’utilisateur en soulageant la plateforme d’origine (hébergeur)
Quelques conseils en plus…
● Même si le FEO est automatisé, toujours suivre et traiter le sujet en
permanence avec des outils spécialisés et agir de suite en cas de
dégradation du temps de chargement !
● La performance est un sujet de tous les jours, et nécessite un suivi
régulier, des optimisations et une prise en compte dès la conception
des contraintes techniques
Les outils indispensables
● Testez : www.webpagetest.org
● Testez (bis) : www.dareboost.com
● Tout péter : www.cloudnetcare.com
● Monitorez : New Relic, Cedexis Radar, Witbe,…
● Accélérez : Fasterize, Cloudflare, Cedexis…
Merci de votre attention !

Contenu connexe

Tendances

Industrialiser votre maintenance sous WordPress
Industrialiser votre maintenance sous WordPressIndustrialiser votre maintenance sous WordPress
Industrialiser votre maintenance sous WordPressAurélien Denis
 
Présentation welcom la webperf by object23
Présentation welcom la webperf by object23Présentation welcom la webperf by object23
Présentation welcom la webperf by object23Brigitte Marandon
 
PrestaShop Day Paris - le futur de PrestaShop
PrestaShop Day Paris - le futur de PrestaShopPrestaShop Day Paris - le futur de PrestaShop
PrestaShop Day Paris - le futur de PrestaShopPrestaShop
 
JCertif 2013 - Vers un web moderne pour l'Afrique ?
JCertif 2013 - Vers un web moderne pour l'Afrique ?JCertif 2013 - Vers un web moderne pour l'Afrique ?
JCertif 2013 - Vers un web moderne pour l'Afrique ?Rossi Oddet
 
ENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidement
ENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidementENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidement
ENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidementHoracio Gonzalez
 
Webperf et SEO : quelles métriques suivre ? Quelles optimisations privilégier ?
Webperf et SEO : quelles métriques suivre ? Quelles optimisations privilégier ?Webperf et SEO : quelles métriques suivre ? Quelles optimisations privilégier ?
Webperf et SEO : quelles métriques suivre ? Quelles optimisations privilégier ?Fasterize
 
TechDays - Développer une single page application HTML5 - Version longue
TechDays - Développer une single page application HTML5 - Version longueTechDays - Développer une single page application HTML5 - Version longue
TechDays - Développer une single page application HTML5 - Version longueTouchify
 
Faut-il passer à Prestashop version 1.7 ?
Faut-il passer à Prestashop version 1.7 ?Faut-il passer à Prestashop version 1.7 ?
Faut-il passer à Prestashop version 1.7 ?Jean-François Viguier
 
Edge SEO & Cloud SEO : Comment faire du SEO dans le cloud quand tout le reste...
Edge SEO & Cloud SEO : Comment faire du SEO dans le cloud quand tout le reste...Edge SEO & Cloud SEO : Comment faire du SEO dans le cloud quand tout le reste...
Edge SEO & Cloud SEO : Comment faire du SEO dans le cloud quand tout le reste...Fasterize
 
WordPress & WooCommerce, une révolution ?
WordPress & WooCommerce, une révolution ?WordPress & WooCommerce, une révolution ?
WordPress & WooCommerce, une révolution ?Aurélien Denis
 

Tendances (11)

Industrialiser votre maintenance sous WordPress
Industrialiser votre maintenance sous WordPressIndustrialiser votre maintenance sous WordPress
Industrialiser votre maintenance sous WordPress
 
Présentation welcom la webperf by object23
Présentation welcom la webperf by object23Présentation welcom la webperf by object23
Présentation welcom la webperf by object23
 
PrestaShop Day Paris - le futur de PrestaShop
PrestaShop Day Paris - le futur de PrestaShopPrestaShop Day Paris - le futur de PrestaShop
PrestaShop Day Paris - le futur de PrestaShop
 
JCertif 2013 - Vers un web moderne pour l'Afrique ?
JCertif 2013 - Vers un web moderne pour l'Afrique ?JCertif 2013 - Vers un web moderne pour l'Afrique ?
JCertif 2013 - Vers un web moderne pour l'Afrique ?
 
Cv kahla wathek
Cv kahla wathekCv kahla wathek
Cv kahla wathek
 
ENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidement
ENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidementENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidement
ENIB 2013-2014 - CAI Web #3: J’ai besoin d’une appli web rapidement
 
Webperf et SEO : quelles métriques suivre ? Quelles optimisations privilégier ?
Webperf et SEO : quelles métriques suivre ? Quelles optimisations privilégier ?Webperf et SEO : quelles métriques suivre ? Quelles optimisations privilégier ?
Webperf et SEO : quelles métriques suivre ? Quelles optimisations privilégier ?
 
TechDays - Développer une single page application HTML5 - Version longue
TechDays - Développer une single page application HTML5 - Version longueTechDays - Développer une single page application HTML5 - Version longue
TechDays - Développer une single page application HTML5 - Version longue
 
Faut-il passer à Prestashop version 1.7 ?
Faut-il passer à Prestashop version 1.7 ?Faut-il passer à Prestashop version 1.7 ?
Faut-il passer à Prestashop version 1.7 ?
 
Edge SEO & Cloud SEO : Comment faire du SEO dans le cloud quand tout le reste...
Edge SEO & Cloud SEO : Comment faire du SEO dans le cloud quand tout le reste...Edge SEO & Cloud SEO : Comment faire du SEO dans le cloud quand tout le reste...
Edge SEO & Cloud SEO : Comment faire du SEO dans le cloud quand tout le reste...
 
WordPress & WooCommerce, une révolution ?
WordPress & WooCommerce, une révolution ?WordPress & WooCommerce, une révolution ?
WordPress & WooCommerce, une révolution ?
 

Similaire à Web perf Silicon Comte

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
 
FinistJUG - J’ai besoin d’une appli web rapidement
FinistJUG -   J’ai besoin d’une appli web rapidementFinistJUG -   J’ai besoin d’une appli web rapidement
FinistJUG - J’ai besoin d’une appli web rapidementHoracio Gonzalez
 
Saas Libre
Saas LibreSaas Libre
Saas Libregrolland
 
Kiwiparty 2011 - Optimisation des sites internet
Kiwiparty 2011 - Optimisation des sites internetKiwiparty 2011 - Optimisation des sites internet
Kiwiparty 2011 - Optimisation des sites internetDevclic
 
Webperf et SEO : les Mythes et la Réalité
Webperf et SEO : les Mythes et la RéalitéWebperf et SEO : les Mythes et la Réalité
Webperf et SEO : les Mythes et la RéalitéFasterize
 
Webperf & SEO : les mythes et la réalité
Webperf & SEO : les mythes et la réalitéWebperf & SEO : les mythes et la réalité
Webperf & SEO : les mythes et la réalitéFasterize
 
Méthodes agiles, frameworks javascript: optimisez votre time to market
Méthodes agiles, frameworks javascript: optimisez votre time to marketMéthodes agiles, frameworks javascript: optimisez votre time to market
Méthodes agiles, frameworks javascript: optimisez votre time to marketmichael_bailly
 
"Performance Web : vers la Speed Update, un pas après l’autre", Boris Schapir...
"Performance Web : vers la Speed Update, un pas après l’autre", Boris Schapir..."Performance Web : vers la Speed Update, un pas après l’autre", Boris Schapir...
"Performance Web : vers la Speed Update, un pas après l’autre", Boris Schapir...Boris SCHAPIRA
 
Comment integrer les applications de votre Systeme Information entre elles ?
Comment integrer les applications de votre Systeme Information entre elles ?Comment integrer les applications de votre Systeme Information entre elles ?
Comment integrer les applications de votre Systeme Information entre elles ?Stéphane Traumat
 
20120402 nantes gtug - app engine
20120402   nantes gtug - app engine20120402   nantes gtug - app engine
20120402 nantes gtug - app engineGDG Nantes
 
Webinar - Construire le cahier des charges de son site web.pdf
Webinar - Construire le cahier des charges de son site web.pdfWebinar - Construire le cahier des charges de son site web.pdf
Webinar - Construire le cahier des charges de son site web.pdfJulien Dereumaux
 
RennesJS Talk webperf by Dareboost
RennesJS Talk webperf by DareboostRennesJS Talk webperf by Dareboost
RennesJS Talk webperf by DareboostDamien Jubeau
 
Techniques d'accélération des pages web
Techniques d'accélération des pages webTechniques d'accélération des pages web
Techniques d'accélération des pages webJean-Pierre Vincent
 
Cours Devops Sparks.pptx.pdf
Cours Devops Sparks.pptx.pdfCours Devops Sparks.pptx.pdf
Cours Devops Sparks.pptx.pdfboulonvert
 
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
 
Gérer l'inconnu avec peu de moyens par le développement itératif - L'agili...
Gérer l'inconnu avec peu de moyens par le développement itératif - L'agili...Gérer l'inconnu avec peu de moyens par le développement itératif - L'agili...
Gérer l'inconnu avec peu de moyens par le développement itératif - L'agili...Benoit St-André
 
Customer Show case : Mise en place d’une solution de gestion de projet avec l...
Customer Show case : Mise en place d’une solution de gestion de projet avec l...Customer Show case : Mise en place d’une solution de gestion de projet avec l...
Customer Show case : Mise en place d’une solution de gestion de projet avec l...Microsoft Ideas
 
Exemple de mise en place d'une solution EPM 2013
Exemple de mise en place d'une solution EPM 2013Exemple de mise en place d'une solution EPM 2013
Exemple de mise en place d'une solution EPM 2013Charbel Abdo
 

Similaire à Web perf Silicon Comte (20)

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 ?
 
FinistJUG - J’ai besoin d’une appli web rapidement
FinistJUG -   J’ai besoin d’une appli web rapidementFinistJUG -   J’ai besoin d’une appli web rapidement
FinistJUG - J’ai besoin d’une appli web rapidement
 
Saas Libre
Saas LibreSaas Libre
Saas Libre
 
Kiwiparty 2011 - Optimisation des sites internet
Kiwiparty 2011 - Optimisation des sites internetKiwiparty 2011 - Optimisation des sites internet
Kiwiparty 2011 - Optimisation des sites internet
 
Webperf et SEO : les Mythes et la Réalité
Webperf et SEO : les Mythes et la RéalitéWebperf et SEO : les Mythes et la Réalité
Webperf et SEO : les Mythes et la Réalité
 
Webperf & SEO : les mythes et la réalité
Webperf & SEO : les mythes et la réalitéWebperf & SEO : les mythes et la réalité
Webperf & SEO : les mythes et la réalité
 
Méthodes agiles, frameworks javascript: optimisez votre time to market
Méthodes agiles, frameworks javascript: optimisez votre time to marketMéthodes agiles, frameworks javascript: optimisez votre time to market
Méthodes agiles, frameworks javascript: optimisez votre time to market
 
"Performance Web : vers la Speed Update, un pas après l’autre", Boris Schapir...
"Performance Web : vers la Speed Update, un pas après l’autre", Boris Schapir..."Performance Web : vers la Speed Update, un pas après l’autre", Boris Schapir...
"Performance Web : vers la Speed Update, un pas après l’autre", Boris Schapir...
 
Forum PHP 2014 day 1
Forum PHP 2014 day 1Forum PHP 2014 day 1
Forum PHP 2014 day 1
 
Comment integrer les applications de votre Systeme Information entre elles ?
Comment integrer les applications de votre Systeme Information entre elles ?Comment integrer les applications de votre Systeme Information entre elles ?
Comment integrer les applications de votre Systeme Information entre elles ?
 
20120402 nantes gtug - app engine
20120402   nantes gtug - app engine20120402   nantes gtug - app engine
20120402 nantes gtug - app engine
 
Webinar - Construire le cahier des charges de son site web.pdf
Webinar - Construire le cahier des charges de son site web.pdfWebinar - Construire le cahier des charges de son site web.pdf
Webinar - Construire le cahier des charges de son site web.pdf
 
RennesJS Talk webperf by Dareboost
RennesJS Talk webperf by DareboostRennesJS Talk webperf by Dareboost
RennesJS Talk webperf by Dareboost
 
Techniques d'accélération des pages web
Techniques d'accélération des pages webTechniques d'accélération des pages web
Techniques d'accélération des pages web
 
Cours Devops Sparks.pptx.pdf
Cours Devops Sparks.pptx.pdfCours Devops Sparks.pptx.pdf
Cours Devops Sparks.pptx.pdf
 
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
 
Gérer l'inconnu avec peu de moyens par le développement itératif - L'agili...
Gérer l'inconnu avec peu de moyens par le développement itératif - L'agili...Gérer l'inconnu avec peu de moyens par le développement itératif - L'agili...
Gérer l'inconnu avec peu de moyens par le développement itératif - L'agili...
 
Customer Show case : Mise en place d’une solution de gestion de projet avec l...
Customer Show case : Mise en place d’une solution de gestion de projet avec l...Customer Show case : Mise en place d’une solution de gestion de projet avec l...
Customer Show case : Mise en place d’une solution de gestion de projet avec l...
 
Exemple de mise en place d'une solution EPM 2013
Exemple de mise en place d'une solution EPM 2013Exemple de mise en place d'une solution EPM 2013
Exemple de mise en place d'une solution EPM 2013
 

Plus de Silicon Comté

Digital Apéro - Lancer la V1 de son app sans coder grâce au No Code - Fatouma...
Digital Apéro - Lancer la V1 de son app sans coder grâce au No Code - Fatouma...Digital Apéro - Lancer la V1 de son app sans coder grâce au No Code - Fatouma...
Digital Apéro - Lancer la V1 de son app sans coder grâce au No Code - Fatouma...Silicon Comté
 
Digital Apéro - Le SEO en 2020
Digital Apéro - Le SEO en 2020Digital Apéro - Le SEO en 2020
Digital Apéro - Le SEO en 2020Silicon Comté
 
Retour d'expérience : gérer des flux vidéos multiples de manière optimisée
Retour d'expérience :  gérer des flux vidéos multiples de manière optimiséeRetour d'expérience :  gérer des flux vidéos multiples de manière optimisée
Retour d'expérience : gérer des flux vidéos multiples de manière optimiséeSilicon Comté
 
Vente en ligne et données personnelles, les règles actuelles / Digital Apéro ...
Vente en ligne et données personnelles, les règles actuelles / Digital Apéro ...Vente en ligne et données personnelles, les règles actuelles / Digital Apéro ...
Vente en ligne et données personnelles, les règles actuelles / Digital Apéro ...Silicon Comté
 
[22/03/2016] Conférence : Blockchain, disruption & révolution
[22/03/2016] Conférence : Blockchain, disruption & révolution[22/03/2016] Conférence : Blockchain, disruption & révolution
[22/03/2016] Conférence : Blockchain, disruption & révolutionSilicon Comté
 
Docker ! De la découverte à la mise en production / Digital apéro [19/03/2015]
Docker ! De la découverte à la mise en production / Digital apéro [19/03/2015]Docker ! De la découverte à la mise en production / Digital apéro [19/03/2015]
Docker ! De la découverte à la mise en production / Digital apéro [19/03/2015]Silicon Comté
 
Introduction à Docker et utilisation en production /Digital apéro Besançon [1...
Introduction à Docker et utilisation en production /Digital apéro Besançon [1...Introduction à Docker et utilisation en production /Digital apéro Besançon [1...
Introduction à Docker et utilisation en production /Digital apéro Besançon [1...Silicon Comté
 
Développeurs, gagnez du temps avec le cloud / Digital apéro [07/04/2015]
Développeurs, gagnez du temps avec le cloud / Digital apéro [07/04/2015]Développeurs, gagnez du temps avec le cloud / Digital apéro [07/04/2015]
Développeurs, gagnez du temps avec le cloud / Digital apéro [07/04/2015]Silicon Comté
 
Introduction au langage de programmation Lua / Digital apéro [03/12/2014]
Introduction au langage de programmation Lua / Digital apéro [03/12/2014]Introduction au langage de programmation Lua / Digital apéro [03/12/2014]
Introduction au langage de programmation Lua / Digital apéro [03/12/2014]Silicon Comté
 
La fibre optique (FTTH) à Besançon, point sur le déploiement / Digital apéro ...
La fibre optique (FTTH) à Besançon, point sur le déploiement / Digital apéro ...La fibre optique (FTTH) à Besançon, point sur le déploiement / Digital apéro ...
La fibre optique (FTTH) à Besançon, point sur le déploiement / Digital apéro ...Silicon Comté
 
Liste des bénéficiaires de fonds européens en Franche-Comté (TIC)
Liste des bénéficiaires de fonds européens en Franche-Comté (TIC)Liste des bénéficiaires de fonds européens en Franche-Comté (TIC)
Liste des bénéficiaires de fonds européens en Franche-Comté (TIC)Silicon Comté
 
Evaluation TIC 2015 (annexes techniques)
Evaluation TIC 2015 (annexes techniques)Evaluation TIC 2015 (annexes techniques)
Evaluation TIC 2015 (annexes techniques)Silicon Comté
 
FEDER - Rapport d'évaluation TIC 2015 (phase 1)
FEDER - Rapport d'évaluation TIC 2015 (phase 1)FEDER - Rapport d'évaluation TIC 2015 (phase 1)
FEDER - Rapport d'évaluation TIC 2015 (phase 1)Silicon Comté
 
FEDER - Rapport final d'évaluation TIC 2015 (phase 2)
FEDER - Rapport final d'évaluation TIC 2015 (phase 2)FEDER - Rapport final d'évaluation TIC 2015 (phase 2)
FEDER - Rapport final d'évaluation TIC 2015 (phase 2)Silicon Comté
 
SGAR Franche-Comté - Évaluation tic synthèse (version juin 2009)
SGAR Franche-Comté - Évaluation tic synthèse (version juin 2009)SGAR Franche-Comté - Évaluation tic synthèse (version juin 2009)
SGAR Franche-Comté - Évaluation tic synthèse (version juin 2009)Silicon Comté
 
Mission d’évaluation et d’expertise du programme Pratic
Mission d’évaluation et d’expertise du programme PraticMission d’évaluation et d’expertise du programme Pratic
Mission d’évaluation et d’expertise du programme PraticSilicon Comté
 
CESR - Avis sur Aménagement du territoire (2012)
CESR - Avis sur Aménagement du territoire (2012)CESR - Avis sur Aménagement du territoire (2012)
CESR - Avis sur Aménagement du territoire (2012)Silicon Comté
 
SDTAN du Jura (synthèse)
SDTAN du Jura (synthèse)SDTAN du Jura (synthèse)
SDTAN du Jura (synthèse)Silicon Comté
 

Plus de Silicon Comté (20)

Digital Apéro - Lancer la V1 de son app sans coder grâce au No Code - Fatouma...
Digital Apéro - Lancer la V1 de son app sans coder grâce au No Code - Fatouma...Digital Apéro - Lancer la V1 de son app sans coder grâce au No Code - Fatouma...
Digital Apéro - Lancer la V1 de son app sans coder grâce au No Code - Fatouma...
 
Digital Apéro - Le SEO en 2020
Digital Apéro - Le SEO en 2020Digital Apéro - Le SEO en 2020
Digital Apéro - Le SEO en 2020
 
20200219 dasc
20200219 dasc20200219 dasc
20200219 dasc
 
Retour d'expérience : gérer des flux vidéos multiples de manière optimisée
Retour d'expérience :  gérer des flux vidéos multiples de manière optimiséeRetour d'expérience :  gérer des flux vidéos multiples de manière optimisée
Retour d'expérience : gérer des flux vidéos multiples de manière optimisée
 
Vente en ligne et données personnelles, les règles actuelles / Digital Apéro ...
Vente en ligne et données personnelles, les règles actuelles / Digital Apéro ...Vente en ligne et données personnelles, les règles actuelles / Digital Apéro ...
Vente en ligne et données personnelles, les règles actuelles / Digital Apéro ...
 
[22/03/2016] Conférence : Blockchain, disruption & révolution
[22/03/2016] Conférence : Blockchain, disruption & révolution[22/03/2016] Conférence : Blockchain, disruption & révolution
[22/03/2016] Conférence : Blockchain, disruption & révolution
 
Docker ! De la découverte à la mise en production / Digital apéro [19/03/2015]
Docker ! De la découverte à la mise en production / Digital apéro [19/03/2015]Docker ! De la découverte à la mise en production / Digital apéro [19/03/2015]
Docker ! De la découverte à la mise en production / Digital apéro [19/03/2015]
 
Introduction à Docker et utilisation en production /Digital apéro Besançon [1...
Introduction à Docker et utilisation en production /Digital apéro Besançon [1...Introduction à Docker et utilisation en production /Digital apéro Besançon [1...
Introduction à Docker et utilisation en production /Digital apéro Besançon [1...
 
Développeurs, gagnez du temps avec le cloud / Digital apéro [07/04/2015]
Développeurs, gagnez du temps avec le cloud / Digital apéro [07/04/2015]Développeurs, gagnez du temps avec le cloud / Digital apéro [07/04/2015]
Développeurs, gagnez du temps avec le cloud / Digital apéro [07/04/2015]
 
Introduction au langage de programmation Lua / Digital apéro [03/12/2014]
Introduction au langage de programmation Lua / Digital apéro [03/12/2014]Introduction au langage de programmation Lua / Digital apéro [03/12/2014]
Introduction au langage de programmation Lua / Digital apéro [03/12/2014]
 
La fibre optique (FTTH) à Besançon, point sur le déploiement / Digital apéro ...
La fibre optique (FTTH) à Besançon, point sur le déploiement / Digital apéro ...La fibre optique (FTTH) à Besançon, point sur le déploiement / Digital apéro ...
La fibre optique (FTTH) à Besançon, point sur le déploiement / Digital apéro ...
 
Liste des bénéficiaires de fonds européens en Franche-Comté (TIC)
Liste des bénéficiaires de fonds européens en Franche-Comté (TIC)Liste des bénéficiaires de fonds européens en Franche-Comté (TIC)
Liste des bénéficiaires de fonds européens en Franche-Comté (TIC)
 
Evaluation TIC 2015 (annexes techniques)
Evaluation TIC 2015 (annexes techniques)Evaluation TIC 2015 (annexes techniques)
Evaluation TIC 2015 (annexes techniques)
 
FEDER - Rapport d'évaluation TIC 2015 (phase 1)
FEDER - Rapport d'évaluation TIC 2015 (phase 1)FEDER - Rapport d'évaluation TIC 2015 (phase 1)
FEDER - Rapport d'évaluation TIC 2015 (phase 1)
 
FEDER - Rapport final d'évaluation TIC 2015 (phase 2)
FEDER - Rapport final d'évaluation TIC 2015 (phase 2)FEDER - Rapport final d'évaluation TIC 2015 (phase 2)
FEDER - Rapport final d'évaluation TIC 2015 (phase 2)
 
SGAR Franche-Comté - Évaluation tic synthèse (version juin 2009)
SGAR Franche-Comté - Évaluation tic synthèse (version juin 2009)SGAR Franche-Comté - Évaluation tic synthèse (version juin 2009)
SGAR Franche-Comté - Évaluation tic synthèse (version juin 2009)
 
Mission d’évaluation et d’expertise du programme Pratic
Mission d’évaluation et d’expertise du programme PraticMission d’évaluation et d’expertise du programme Pratic
Mission d’évaluation et d’expertise du programme Pratic
 
CESR - Avis sur Aménagement du territoire (2012)
CESR - Avis sur Aménagement du territoire (2012)CESR - Avis sur Aménagement du territoire (2012)
CESR - Avis sur Aménagement du territoire (2012)
 
SDTAN Jura
SDTAN JuraSDTAN Jura
SDTAN Jura
 
SDTAN du Jura (synthèse)
SDTAN du Jura (synthèse)SDTAN du Jura (synthèse)
SDTAN du Jura (synthèse)
 

Web perf Silicon Comte

  • 2. COUCOU C’EST NOUS (Netalis) : Opérateur & Hébergeur ● Société (SAS) fondée par une équipe de spécialistes des infrastructures THD et services Internet (+10 ans d’expérience) ● Proximité : Siège social en région, à Besançon ● Équipe à taille humaine, support technique de proximité ● Spécialité : TPE, PME, ETI et collectivités locales ● Plateforme technique (Data Center) à Besançon et Paris : Vos données transitent et restent en France www.netalis.fr
  • 3. Constat : ça rame ! ● En 20 ans : on passe de 56 kbps à 1G (!) en FttH ● On passe de la 2G à la 5G ● L’utilisateur est impatient nativement ● Il faut délivrer (très) vite les contenus/services
  • 4. Pourquoi ça rame ? ● Vieux matériels ● Vieux OS pas mis à jour ● Vieux navigateurs web ● LAN : CPL, WiFi … ● Débit connexion ● DNS FAI trop lent ● Peering saturé… ● Code pourri ● Hébergeur low cost...
  • 5. LA #WEBPERF ● Sur le web, la performance doit être la clé de la réussite d’une stratégie ● Un développeur qui omet de rendre une app réactive et rapide : changez de job ! Source : https://blog.clever-age.com/fr/2012/07/31/webperf-a- quelle-vitesse-ma-page-se-charge-t-elle/
  • 6. Le SEO c’est has been : La WebPerf est LE point critique ● 100 ms de perdues = 1% de CA en moins (Amazon) ● 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
  • 7. C’est Google qui le dit…
  • 8. Mobile first : C’est pas gagné… ● Poids du mobile croissant sur les sites : pensez au responsive… et ses conséquences sur la performance du site en mobilité ! ● Taux de transformation sur le mobile fortement impacté par de mauvais temps de réponse : Connexion 3G/4G pas toujours bonne ● Google Speed Update : « Si t’es pas rapide, tu grimpes pas » ● Web App ou Native app : that is the question ! (mais le besoin de perf reste le même)
  • 9. Transformez-vous en utilisateur final (aka Mme Michu) ● Passer d’une vision performance infrastructure « IT » à une vision performance vue du Client (marketing) ● Si vous n’avez pas de mesure de la performance vue du client de bout en bout sur le mobile et sur le Desktop : FAUTE (et corrigez ça grâce au Real User Monitoring)
  • 10. C’est la cata sur le taux de rebond
  • 11. La WebPerf : mix d’IT et de marketing web • Des objectifs de perf partagés par le métier et l’IT, le marketing, la créa… : Amélioration de plusieurs secondes du temps d’affichage partout (web, mobile) • S’adosser à un partenaire expert pour toutes les actions possibles à externaliser • Travailler plus en profondeur le code pour aller chercher des améliorations supplémentaires
  • 12. La WebPerf : C’est aussi pour l’artistique ● Utilisez des outils de monitoring pour avoir une vision identique à celle du Client (Dynatrace, Dareboost…) ● Le travail de la webperf est un travail qui doit se faire main dans la main avec les créatifs : UX/UI, suivi des temps de réponses des partenaires sur le site (webpagetest)
  • 13. Les termes essentiels de la WebPerf ● TTFB (Time to First Byte) ● Start Render ● Speed Index ● First Interactive ● Backend ● CDN ● FEO ● …
  • 14. Les métriques techniques à surveiller ● Temps de réponse serveur ● TTFB ● DomContentLoaded (= DomReady) ● Onload Waterfall WebPageTest.org
  • 15. Métriques UX à surveiller • Start Render • Speed Index • First ContentFul Paint • First Interactive • Visually Complete
  • 16. Attention aux outils tiers ! • Publicités • Scripts tiers (analytics, etc)
  • 17. Faites chauffer le cache (et pas le ca$h) Un seul but : répondre plus vite et au plus près de l’internaute ● Cache local ○ plusieurs types : Block / FullPage / APC / HTTP ○ protège et soulage les backends ● CDN (Réseau de distribution de contenus) : Cache distribué ○ Ne répond pas à toutes les situations ○ tout n’est pas cachable (mais ESI/Ajax) ● Le monde est vaste et les latences réseaux peuvent être importantes : optez pour le multi-CDN avec un bon aiguilleur de trafic (Cedexis) !
  • 18. La WebPerf, c’est la micro-chirurgie du web Source : Fasterize
  • 19. WebPerf : Une attention particulière pour… ● 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 ○ Gérer les pays compliqués : Asie, Brésil, Turquie, Russie, Inde
  • 20. On résume ? ● Développer et tester en continu : La préprod est indispensable avec un environnement stable ● Héberger avec des serveurs web modernes et des applicatifs optimisés (Nginx, etc) : pensez au Cloud (IaaS) pour gérer les pics de charge ● Mettre en place une stratégie FEO automatisée ● Réaliser des tests de montée en charge AVANT de passer en prod ● Utiliser un ou plusieurs caches / CDN pour délivrer le contenu au plus proche de l’utilisateur en soulageant la plateforme d’origine (hébergeur)
  • 21. Quelques conseils en plus… ● Même si le FEO est automatisé, toujours suivre et traiter le sujet en permanence avec des outils spécialisés et agir de suite en cas de dégradation du temps de chargement ! ● La performance est un sujet de tous les jours, et nécessite un suivi régulier, des optimisations et une prise en compte dès la conception des contraintes techniques
  • 22. Les outils indispensables ● Testez : www.webpagetest.org ● Testez (bis) : www.dareboost.com ● Tout péter : www.cloudnetcare.com ● Monitorez : New Relic, Cedexis Radar, Witbe,… ● Accélérez : Fasterize, Cloudflare, Cedexis…
  • 23. Merci de votre attention !