Building Performance for the Long Term

Performance matters to your users. And the importance of performance doesn't dim over time - if anything, users expect better performance this year than they experienced last year. Performance is important for the long-term. While your company's aims and structure may change, its commitment to performance should not.

This talk provides strategies that build performance culture from the long term. From starting a performance culture at your company to educating and empowering teams to understand and own their products' performance, this talk presents tools and strategies that you can use to make performance last at your company.

Smashing Conference London, 2018

Transcript

1. KSPRATTART.ETSY.COM Building Performance FOR THE LONG TERM ALLISON MCKNIGHT @aemcknig Smashing Conference London 2018
2. FREEFOLDING.ETSY.COM
3. “We build for the long term.”
4. Without a performance culture, performance is not sustainable.
5. PIEINTHESKYCRAFTS.ETSY.COM
6. Getting buy-in Understanding performance Empowering teams To infinity and beyond AGENDA SORADESIGNS.ETSY.COM
7. LINMREGEL.ETSY.COM
8. LIXXIEBERRY.ETSY.COM
9. Getting buy-in for performance
10. SCANDIPRINTSTUDIO.ETSY.COM GETTING BUY-IN • Performance work isn’t given priority • At your company • On your team
11. Time, resources, and support necessary for performance work GETTING BUY-IN FROM
 YOUR BOSS
12. Makes performance work sustainable by involving creators GETTING BUY-IN FROM
 YOUR COWORKERS
13. SEWCADENCE.ETSY.COM Which business metrics are most important for your company?
14. Link performance to business metrics
15. 160 KB added images 12% increase in
 bounce rate MOLLYMCSHABBY.ETSY.COM
16. MOUNTAINMOLEHILL.ETSY.COM
17. www.wpostats.com
18. www.wpostats.com
19. performance business
20. But those sites were slow. Our site isn’t slow! Very Important Person, Your Company
21. SALOMIJOUBERT.ETSY.COM
22. But those sites were slow. Our site isn’t slow! Very Important Person, Your Company
23. Show, don’t tell
26. Be accountable to your users
27. Site Performance Report
28. Site Performance Report
29. “Load time is important, the quicker, the better!” “Looks like great improvements to me! Can’t wait to see how other features are going to be optimized! Thanks for working so hard engineering team!” “Cool! Keep up the good work.” Comments
30. Understanding performance
31. SCANDIPRINTSTUDIO.ETSY.COM UNDERSTANDING PERFORMANCE • You don’t know how fast (or slow) your users’ experiences are • You don’t know why your users’ experiences are fast (or slow)
32. JEANLUCBEGHINPRINTS.ETSY.COM
33. ❤ Metrics ❤ • How is my site’s performance? • How is my site’s performance changing? • Where are performance issues coming from?
34. Metrics • How is my site’s performance? • How is my site’s performance changing? • Where are performance issues coming from?
35. Synthetic Real User Monitoring (RUM)
36. Synthetic • Artificial page loads • Controlled, consistent environment XRAYANN.ETSY.COM “Why does my site
 perform this way?”
37. XRAYANN.ETSY.COM Real User Monitoring (RUM) • Timing from real users • Represents your user base “How is my site performing for my real users?”
38. DEFINITELY BOTH DEFINITELY BOTH DEFINITELY BOTH
39. Empower teams
40. SCANDIPRINTSTUDIO.ETSY.COM • Your organization understands the value of performance • You have built infrastructure that helps you understand your site’s performance EMPOWERING TEAMS
41. Integrate performance into
 product workflows
42. ❤ Graphs ❤
49. NAUSICAADISTRIBUTION.ETSY.COM
50. Always be A/B testing! NAUSICAADISTRIBUTION.ETSY.COM
51. ADRAGONFLYSVINTAGE.ETSY.COM ?
52. 50%
53. 100% 50%
54. Always be integrating! NAUSICAADISTRIBUTION.ETSY.COM
55. Sonic Search experience performance improvements 2 Make the market page more shiny Pages impacted A/B test Negatively impacting 1 page
56. Sonic Make the homepage more shiny market variant control
57. Help teams understand why performance is changing
58. Synthetic XRAYANN.ETSY.COM “Why does my site
 perform this way?”
61. Teach tools and practices
62. Performance Budgets Metric How to measure Target Total page load time RUM, 95th percentile 2 seconds Speed Index WebPagetest (Dulles, Cable) 1,200 Total page weight - web WebPagetest (signed in) 2000 KB Total page weight - mobile WebPagetest (signed in) 1000 KB
63. Performance Budgets Metric How to measure Target Total page load time RUM, 95th percentile 2 seconds Speed Index WebPagetest (Dulles, Cable) 1,200 Total page weight - web WebPagetest (signed in) 2000 KB Total page weight - mobile WebPagetest (signed in) 1000 KB Current performance Understanding of performance/ business metric link
64. Performance Budgets Metric How to measure Target Total page load time RUM, 95th percentile 2 seconds Speed Index WebPagetest (Dulles, Cable) 1,200 Total page weight - web WebPagetest (signed in) 2000 KB Total page weight - mobile WebPagetest (signed in) 1000 KB Be specific!
65. Performance Budgets • Make optimizations to the new feature to get within budget • Optimize or remove an existing feature to make space • Don’t include the new feature this is okay
66. Make informed decisions
 about tradeoffs PERFORMANCE BUDGETS
67. To infinity and beyond
68. Expand
69. You don’t have to start measuring everything all at once TO INFINITY AND BEYOND
70. Iterate
71. Maintain expertise
72. Celebrate performance
74. CREATE A CULTURE THAT values performance AND empowers teams
75. THANK YOU!