Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

The State of Performance in the WordPress Ecosystem

555 views

Published on

In this talk we will be using these tools to focus on the state of performance in the WordPress ecosystem; is it faster, and more importantly, why or why not?

Published in: Internet
  • Be the first to comment

The State of Performance in the WordPress Ecosystem

  1. 1. The State of Performance In the WordPress Ecosystem Rick Viscomi rviscomi@google.com
  2. 2. 2 Oh, hello ● Developer Programs Engineer ● Web transparency advocate ● Made YouTube fast ™ ● Cowrote “Using WebPageTest” Rick Viscomi rviscomi@google.com
  3. 3. 3“The Performance Golden Rule” by Steve Souders, 2012 80%of the end-user response time is spent on the front end
  4. 4. 4 Why does web performance matter?
  5. 5. 5wpostats.comWPO Stats: Case studies correlating performance and conversions
  6. 6. 6wpostats.comWPO Stats: Case studies correlating performance and conversions “Rebuilding Pinterest pages for performance resulted in a 40% decrease in wait time, a 15% increase in SEO traffic and a 15% increase in conversion rate to signup.”
  7. 7. 7bit.ly/2tKmMnIThink with Google: Revenue Impact Calculator
  8. 8. 8bit.ly/2Dt5PlzGoogle Webmaster Central Blog "Today we’re announcing that starting in July 2018, page speed will be a ranking factor for mobile searches."
  9. 9. 9bit.ly/2HjmjdUMalte Ubl, TL of AMP "Objective metrics collected through public data sets like the Chrome User Experience Report can provide for objective performance and UX data independent of technology."
  10. 10. 10Source: “The New Bar for Web Experiences” at Chrome Dev Summit 2017 60%of mobile connections worldwide are 2G
  11. 11. 11Source: https://httparchive.org/reports/state-of-the-web#bytesTotal
  12. 12. 12Source: DoubleClick - The need for mobile speed, September 2016 53%of users abandon sites that take longer than 3 seconds to load
  13. 13. 13Source: https://httparchive.org/reports/chrome-ux-report?start=latest
  14. 14. 14Source: https://httparchive.org/reports/chrome-ux-report?start=2018_04_01 35% desktop > 3s 52% mobile > 3s
  15. 15. 15 How do we measure performance? Lab vs Field Personal vs Public
  16. 16. 16 Lab Field Mine Ours WebPageTest RUM Analytics Chrome UX ReportHTTP Archive
  17. 17. 17 Lab Analyzes how a website is built ● is it built on WordPress? ● how many bytes does it load? ● does it use a CDN? ● are images optimized?
  18. 18. 18 Field Represents real user experiences ● desktop or mobile? ● wifi or 3G? ● fast or slow page load? ● which pages were viewed?
  19. 19. 19 Personal Tools that tell us about particular websites ● Chrome Developer Tools ● WebPageTest ● Google Analytics
  20. 20. 20 Personal + Lab: WebPageTest
  21. 21. 21 Personal + Lab: WebPageTest
  22. 22. 22 Personal + Lab: WebPageTest
  23. 23. 23 Personal + Lab: WebPageTest
  24. 24. 24 Personal + Field: Google Analytics
  25. 25. 25 Personal + Field: Google Analytics
  26. 26. 26 Public Tools that tell us about the state of the web ● HTTP Archive ● Chrome UX Report
  27. 27. 27 Public + Lab: HTTP Archive
  28. 28. 28 Public + Lab: HTTP Archive
  29. 29. 29 500K GCS BQ Biweekly 134 Public + Lab: HTTP Archive
  30. 30. 30 Public + Field: Chrome UX Report
  31. 31. 31 Public + Field: Chrome UX Report Aggregate ● Form factor ● Effective connection type ● Geography ● UX performance Analyze ● Raw data on BigQuery ● URL resolution on PageSpeed Insights ● Mobile Speed Scorecard ● Third party integrations Anonymize ● Publicly indexable ● Origin rollup ● Unique user threshold ● Normalized to 100%
  32. 32. 32 Public + Field: Chrome UX Report First Paint First Contentful Paint DOM Content Loaded Onload
  33. 33. 33 How does WordPress perform? in HTTP Archive
  34. 34. 34
  35. 35. 35 WordPress sites detected as of April 15, 2018 199,022
  36. 36. 36 Median Page Weight 1921.8 KB ▲ 190.8 KB 👉 lots more stuff to load
  37. 37. 37 Median Page Weight Growth since January 2016 +19.1% ▼ 0.4 pp 👉 slightly slower growth
  38. 38. 38 Median CSS Weight 69.3 KB ▲ 16.3 KB 👉 much more CSS
  39. 39. 39 Median CSS Weight Growth since January 2016 +60.0% ▲ 29.5 pp 👉 growing twice as fast
  40. 40. 40 Median JavaScript Requests 24 ▲ 4 👉 slightly more requests
  41. 41. 41 Median JavaScript Weight 397.5 KB ▲ 26.8 KB 👉 heavier scripts
  42. 42. 42 Median JavaScript Weight Growth since January 2016 +22.5% ▼ 4.8 pp 👉 not growing as quickly (always been heavy)
  43. 43. 43 Median Gzip Savings 4.5 KB ▼ 0.4 KB 👉 not taking full advantage of gzip compression
  44. 44. 44 Median Gzip Savings Improvement since January 2016 79.5% ▲ 7.2 pp 👉 more improvement
  45. 45. 45 Median Image Requests 40 ▲ 1 👉 roughly the same number of images
  46. 46. 46 Median Image Weight 957.6 KB ▲ 96.3 KB 👉 much heavier images
  47. 47. 47 Median Image Weight Growth since January 2016 +15.6% ▼ 1.4 pp 👉 not growing as quickly (always been heavy)
  48. 48. 48 Median Image Savings 67.5 KB ▲ 8.4 KB 👉 not taking full advantage of image optimization
  49. 49. 49 Median Image Savings Improvement since January 2016 49.5% ▲ 26.3 pp 👉 halved savings, double improvement
  50. 50. 50 Median Video Weight Growth since January 2016 👉 much better than before, but very long tail
  51. 51. 51 Median Video Weight 2140.6 KB ▼ 282.1 KB 👉 less video
  52. 52. 52 Median Video Weight Growth since January 2016 +1020.7% ▲ 50.1 pp 👉 explosive, faster growth
  53. 53. 53 Median Video Weight Growth since January 2016 👉 recent phenomenon, long tail (10 MB)
  54. 54. 54 How does WordPress perform? in the Chrome UX Report
  55. 55. 55 WordPress sites detected as of January 1, 2018 785,733
  56. 56. 56 Average First Contentful Paint Time 👉 FCP skews slower
  57. 57. 57 Average DOM Content Loaded Time 👉 DCL skews slower
  58. 58. 58 Average Onload Time 👉 OL skews slower
  59. 59. 59 How do we perform?
  60. 60. 60 85 attendees 36 companies
  61. 61. 61 27 companies in CrUX
  62. 62. 62 First Contentful Paint
  63. 63. 63 DOM Content Loaded
  64. 64. 64 Onload
  65. 65. 65 First Contentful Paint and Page Weight
  66. 66. 66 First Contentful Paint and Page Weight
  67. 67. 67 First Contentful Paint and JavaScript Weight
  68. 68. 68 First Contentful Paint and Image Weight
  69. 69. 69 559 VIP websites managed by attendees
  70. 70. 70 216 VIP websites in CrUX
  71. 71. 71 Average First Contentful Paint
  72. 72. 72 First Contentful Paint per Site
  73. 73. 73 Fast First Contentful Paint and Page Weight
  74. 74. 74 How do we move the ecosytem forward?
  75. 75. 75 Monitor performance ● track improvements ● flag regressions
  76. 76. 76 Celebrate performance ● culture of performance ● publish case studies
  77. 77. 77 Reward performance ● praise in public ● incentivize developers
  78. 78. 78 Work with developers ● document best practices ● performance hackathon
  79. 79. 79 Performance is just one part of the UX picture. Accessibility Security Discoverability Design Interactivity Localization ...and many more
  80. 80. 80 Thanks! Rick Viscomi rviscomi@google.com ● HTTP Archive httparchive.org ● Chrome UX Report bit.ly/chrome-ux-report ● WebPageTest webpagetest.org ● Revenue Impact Calculator thinkwithgoogle.com/feature/mobile/ ● These slides bit.ly/wp-vip-perf

×