Download as PDF, PPTX
Uploaded byKaliop-slide
Web performance optimization
The document focuses on web performance optimization, highlighting key factors such as front-end and back-end performance, real-life concerns, and various metrics to address. It emphasizes the importance of DevOps culture in deploying and fine-tuning services, as well as monitoring actual user experiences with tools like Real User Monitoring (RUM). The discussion also covers specific performance issues, best practices, and considerations for optimizing website performance across different environments.
More Related Content
Similar to Web performance optimization
![[webinar du 26/02/2015] Magento / Prestashop : bien choisir sa solution e-com...](https://cdn.slidesharecdn.com/ss_thumbnails/kaliopwebinare-commerce26022014-151119140201-lva1-app6892-thumbnail.jpg?width=640&height=640&fit=bounds)
![[Webinar du 6/11/2014] Réussir son projet E-commerce en mode agile](https://cdn.slidesharecdn.com/ss_thumbnails/kaliopwebinaragile1411061-151119135052-lva1-app6891-thumbnail.jpg?width=640&height=640&fit=bounds)
![[Webinar du 17/06/2014] Bien intégrer sa boutique e-Commerce à son système d'...](https://cdn.slidesharecdn.com/ss_thumbnails/webinare-commerce17062014kaliop28129-151119111225-lva1-app6892-thumbnail.jpg?width=640&height=640&fit=bounds)
Web performance optimization
- 1.
- 2. HOSTING SERVICES CODE XHTML CRON3-PARTS CSS JavaScript AJAXcalls DNS Medias OS I/O perf CPU RAM Network Sizing Backup ... Back-end Front-end DEVELOPER SYS. ADMIN FRONT-END END-USER CUSTOMER DIGITAL MARKETING ? No 404 or 500 ? Not so bad ? Responsive ? SEO ? Elegant ? Fast ? Slow ? No alerts ? Doesn’t burn ? something to care ? Real life performance : concerns ? NFS SMTP APIs Drupal tasks Sys. tasks DELIVERY
- 3. HOSTING SERVICES CODE XHTML CSS JavaScript AJAXcalls Medias OS I/O perf CPU RAM Network Sizing Backup ... APIs Drupal tasks Sys. tasks Back-end Front-end Real life performance : common issues ? DNS CRON3-PARTS NFS SMTP DELIVERY Ok, you mean devOps... Ok, you mean devOps...
- 4. devOps culture ? SERVICES Servicesconfig & finetune : Who is supposed to setup Varnish ? Is there some finetuning for memcached ? Where can i read the services configs ?
- 5. Metrics : Which metricsto collect ? My customer ask for some metrics !? Is possible to collect slow pages / SQL / Solr ? devOps culture ?
- 6. Metrics : Which metricsto collect ? My customer ask for some metrics !? Is possible to collect slow pages / SQL / Solr ? devOps culture ?
- 7. Metrics : Which metricsto collect ? My customer ask for some metrics !? Is possible to collect slow pages / SQL / Solr ? devOps culture ?
- 8. Metrics : Which metricsto collect ? My customer ask for some metrics !? Is possible to collect slow pages / SQL / Solr ? … Apache, nginx, elasticsearch, solr, haproxy, memcached, redis, APC, mongoDB, postgre... devOps culture ?
- 9. Metrics : Which metricsto collect ? My customer ask for some metrics !? Is possible to collect slow pages / SQL / Solr ? devOps culture ?
- 10. Load test : Whichuser stories to use ? How to link the load & code impact ? devOps culture ?
- 11. devOps culture ? SERVICES Deployment: How to deploy a Varnish+code improvement ? How to purge selective cache ? cURL purges...
- 12. devOps culture ? SERVICES CI/ testing / local dev : How to trig performances regressions ? Can i run/test the whole stack locally ? Deployment
- 13.
- 14. modern application ? HEADER FOOTER breadcrumb UserprofilingContent listContent list ANONYMOUS ANONYMOUS ANONYMOUS USER GROUP USER HTTP Cache ESI Processing http://foshttpcachebundle.readthedocs.org/en/latest/
- 15. HOSTING SERVICES CODE XHTML CSS JavaScript AJAXcalls Medias OS I/O perf CPU RAM Network Sizing Backup ... APIs Drupal tasks Sys. tasks Back-end Front-end Real life performance : common issues ? DNS CRON3-PARTS NFS SMTP DELIVERY Why so big ?
- 16. front-end Optim. XHTML CSS JavaScript AJAX calls Medias DNS Why so big? Because it is the big part ! 98%Nothing how they know ?
- 17. Front-end Optimization Find some front-endbest practices to reduce the load time ? But, not those proposed by YSlow / Google Page Speed ?
- 18. front-end Optim. Real life performance: RUM (Real User Monitoring) W3C // Navigation timing API https://dvcs.w3.org/hg/webperf/raw-file/tip/specs/NavigationTiming/Overview.html
- 19. front-end Optim. Real life performance: RUM (Real User Monitoring) http://caniuse.com/#feat=nav-timing
- 20. front-end Optim. Real life performance: RUM (Real User Monitoring) http://caniuse.com/#feat=nav-timing
- 21. front-end Optim. Real life performance: RUM (Real User Monitoring)
- 22. front-end Optim. Real life performance: RUM (Real User Monitoring)
- 23. front-end Optim. Real life performance: RUM (Real User Monitoring)
- 24. front-end Optim. Real life performance: RUM (Real User Monitoring) DomComplete ~20 sec of nothing !?
- 25. Tricky use-case ~50% oftaric come from backlinks (newsletter, socials, apps...) What about RUM ? Do i have to care about DNS lookup ? Do i have to care about browser ? Do i have to care about domReady ? Newsletter backlink website Article CN/Asia HTTP 302 CN/Irland HTTP 302 CN/Irland HTTPS 302 SSL CNCN Need SSL SSL Smooth login ? Tracking
- 26. Tricky use-case ~50% oftaric come from backlinks (newsletter, socials, apps...) What about RUM ? RUM can not track HTTP redirections RUM does not work with IE8 Newsletter backlink website Article CN/Asia HTTP 302 CN/Irland HTTP 302 CN/Irland HTTPS 302 SSL CNCN Need SSL SSL Smooth login ? Tracking
- 27. Tricky use-case ~50% oftaric come from backlinks (newsletter, socials, apps...) Do i have to care about DNS lookup ? YES ! Especially with china / india, etc. Think about DNS-Prefetch Newsletter backlink website Article CN/Asia HTTP 302 CN/Irland HTTP 302 CN/Irland HTTPS 302 SSL CNCN Need SSL SSL Smooth login ? Tracking <link rel="dns-prefetch" href="http://www.mydomain.com/">
- 28. Tricky use-case ~50% oftaric come from backlinks (newsletter, socials, apps...) Do i have to care about browser ? Do i have to care about domReady ? YES ! IE8 is still the 1st browser in china IE8 does not support ASYNC JavaScript (domready killer) IE8 Selectivizr is a perf killer (avoid) Do you know 360 Browser & WeChat apps ? Newsletter backlink website Article CN/Asia HTTP 302 CN/Irland HTTP 302 CN/Irland HTTPS 302 SSL CNCN Need SSL SSL Smooth login ? Tracking
- 29. front-end Optim. Real life performance: RUM (Real User Monitoring) DomComplete ~20 sec of nothing !?
- 30. Tricky use-case ~50% oftaric come from backlinks (newsletter, socials, apps...) Newsletter backlink website Article CN/Asia HTTP 302 CN/Irland HTTP 302 CN/Irland HTTPS 302 SSL CNCN Need SSL SSL Smooth login ? Tracking ?
- 32.
- 33. HOSTING SERVICES CODE XHTML CRON3-PARTS CSS JavaScript AJAXcalls DNS Medias OS I/O perf CPU RAM Network Sizing Backup ... Back-end Front-end YOU YOU YOU YOU YOU YOU YOU YOU No 404 or 500 ? Not so bad ? Responsive ? SEO ? Elegant ? Fast ? Slow ? No alerts ? Doesn’t burn ? something to care ? Advices / approach ? NFS SMTP APIs Drupal tasks Sys. tasks DELIVERY Is “perf master” a new job ? Rebirth of “fullstack developer ?”
- 34. Question ? Gilles Guirand KaliopCTO @gandbox