Measuring web performance

  • 5,092 views
Uploaded on

Things to be aware of when you are measuring the performance of your web sites (both synthetic testing and Real User Monitoring).

Things to be aware of when you are measuring the performance of your web sites (both synthetic testing and Real User Monitoring).

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
5,092
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
96
Comments
0
Likes
7

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Measuring Web Performance Patrick Meenan pmeenan@webpagetest.org @patmeenan
  • 2. Types of Measurement velocityconf.com/velocity2011/public/schedule/detail/18039
  • 3. Measuring Web PerformanceSYNTHETIC TESTING
  • 4. Active Testing• Consistent results – Good for detecting and diagnosing issues that are 100% repeatable and on pages you are monitoring• Lots of detail• Availability monitoring• Not representative of actual end-user performance – Usually tested from data centers – Sometimes co-located with CDN provider equipment
  • 5. Bandwidth/Latency Impact(Fixed 60ms RTT) (Fixed 5Mbps Bandwidth) 5 www.belshe.com/2010/05/24/more-bandwidth-doesnt-matter-much/
  • 6. US Broadband Latency WebPagetest DSL WebPagetest Cable WebPagetest FIOS Backbone 6www.fcc.gov/document/measuring-broadband-america-report-consumer-broadband-performance-us
  • 7. Actual UsersBackboneTesting 7
  • 8. DSL – Back-End: 17% Backbone – Back-End: 52% 8
  • 9. Mac Traffic Shaping OS X Lion + Xcode 4.1 Cable, DSL, 3G, Edge, WiFi and Custom GUI for dummynet (which has been available for a while)osxdaily.com/2011/08/10/simulate-internet-connectivity-bandwidth-speeds-network-link-conditioner/
  • 10. Synthetic Browsers• Know HOW your active testing is done – Some only test the base page – Synthetic browsers usually not reflective of real browser – Real browser testing – Connectivity (backbone, last-mile)• www.engadget.com – Synthetic Browser: 447 requests – IE 8: 241 requests
  • 11. Measuring Web PerformanceREAL USER MONITORING (RUM)
  • 12. Real User Monitoring (RUM)• Full coverage on all pages visited by users• Real performance information for end-user experience• No availability monitoring• No competitive reference• Limited detail – … but getting better
  • 13. Navigation Timingwindow.performance.timing IE 9+ Chrome Firefox 9+ Android 4+ Front-End Back-End 13 dvcs.w3.org/hg/webperf/raw-file/tip/specs/NavigationTiming/Overview.html
  • 14. Resource Timing (draft) Timing for every network-loaded resource w3c-test.org/webperf/specs/ResourceTiming/
  • 15. Back-End Only
  • 16. Access Logs• Overall Response Times - %D (Apache)• Custom variables (app-specific timings)• Logster + graphite = graphs• Lots of data-mining opportunities – Broken links/content (404’s with useful referer information)• Mike Brittain (Etsy) Presentation – http://www.slideshare.net/mikebrittain/web-performance-culture- and-tools-at-etsy-11159635
  • 17. Measuring Web PerformanceTHE METRICS
  • 18. When is “Done”?Easy answer is onLoad But…
  • 19. When is “Done”?Twitter onLoad (2.4s) Twitter end of activity (8.2s)
  • 20. 2 Pages, Identical Performance …
  • 21. http://youtu.be/Ipk1k_IobYg
  • 22. Start Render Identical
  • 23. Load TimeIdentical
  • 24. Last Visual Change Identical
  • 25. Visual “Completeness”
  • 26. Measuring Web PerformanceINTRODUCING…
  • 27. The Speed IndexThe user experience of A was 7.4 times faster than B sites.google.com/a/webpagetest.org/docs/using-webpagetest/metrics/speed-index
  • 28. Amazon.com vs. Twitter …
  • 29. Amazon vs. Twitter Amazon Twitter Speed Index 1501 6014 (+300%) onload 2.4 2.4 Fully Loaded 6.4 8.2 (+28%)www.webpagetest.org/video/view.php?id=120414_22f2206da973b41621c499e2be01d555cdac6ab0&bare=1
  • 30. Measuring Web PerformanceWHAT’S NEW IN WEBPAGETEST
  • 31. New Waterfall UI Nav Timing – domContentLoaded (Firefox/Chrome) Nav Timing – load event (Firefox/Chrome) Pop-up request details
  • 32. Dependencies (Chrome)Line of code thatTriggered request
  • 33. Response Bodies
  • 34. Dev Tools Timeline (Chrome)
  • 35. Dev Tools Timeline (Chrome)
  • 36. Creating Videos
  • 37. Creating Videos (cont)Customize:- End Point/Times- Specific Run- First/Repeat View- Labels www.webpagetest.org/video/compare.php?tests=120416_QX_3ZKFP%2C120416_DR_3ZKFJ&bare=1
  • 38. SPOF Demonstratingwww.webpagetest.org/video/view.php?id=120416_d635d742a17d7eecf57df6282bcea87f5de2322c&bare=1
  • 39. Custom viewport size Chrome/Firefox
  • 40. EC2 AMIsIE 7 m1.small orIE 8 c1.mediumIE 9, Chrome, Firefox (single image)
  • 41. News/Updates• Twitter: @patmeenan• Google+ PatMeenan@gmail.com WebPagetest• WebPagetest Forums http://www.webpagetest.org/forums/