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
   

   View Slide

2. FREEFOLDING.ETSY.COM
   

   View Slide

3. “We build for the long term.”
   

   View Slide

4. Without a performance culture,
   performance is not sustainable.
   

   View Slide

5. PIEINTHESKYCRAFTS.ETSY.COM
   

   View Slide

6. Getting buy-in
   Understanding performance
   Empowering teams
   To infinity and beyond
   AGENDA
   SORADESIGNS.ETSY.COM
   

   View Slide

7. LINMREGEL.ETSY.COM
   

   View Slide

8. LIXXIEBERRY.ETSY.COM
   

   View Slide

9. Getting buy-in for performance
   

   View Slide

10. SCANDIPRINTSTUDIO.ETSY.COM
    GETTING BUY-IN
    • Performance work isn’t given priority
    • At your company
    • On your team
    

    View Slide

11. Time, resources, and support
    necessary for performance work
    GETTING BUY-IN FROM

    YOUR BOSS
    

    View Slide

12. Makes performance work
    sustainable by involving creators
    GETTING BUY-IN FROM

    YOUR COWORKERS
    

    View Slide

13. SEWCADENCE.ETSY.COM
    Which business metrics are
    most important for your company?
    

    View Slide

14. Link performance to
    business metrics
    

    View Slide

15. 160 KB
    added images
    12%
    increase in

    bounce rate
    MOLLYMCSHABBY.ETSY.COM
    

    View Slide

16. MOUNTAINMOLEHILL.ETSY.COM
    

    View Slide

17. www.wpostats.com
    

    View Slide

18. www.wpostats.com
    

    View Slide

19. performance
    business
    

    View Slide

20. But those sites were slow.
    Our site isn’t slow!
    Very Important Person,
    Your Company
    

    View Slide

21. SALOMIJOUBERT.ETSY.COM
    

    View Slide

22. But those sites were slow.
    Our site isn’t slow!
    Very Important Person,
    Your Company
    

    View Slide

23. Show, don’t tell
    

    View Slide

24. View Slide

25. View Slide

26. Be accountable to your users
    

    View Slide

27. Site Performance Report
    

    View Slide

28. 
    Site Performance Report
    

    View Slide

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
    

    View Slide

30. Understanding performance
    

    View Slide

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)
    

    View Slide

32. JEANLUCBEGHINPRINTS.ETSY.COM
    

    View Slide

33. ❤ Metrics ❤
    • How is my site’s performance?
    • How is my site’s performance changing?
    • Where are performance issues coming from?
    

    View Slide

34. Metrics
    • How is my site’s performance?
    • How is my site’s performance changing?
    • Where are performance issues coming from?
    
    
    
    

    View Slide

35. Synthetic
    Real User
    Monitoring (RUM)
    

    View Slide

36. Synthetic
    • Artificial page loads
    • Controlled, consistent environment
    XRAYANN.ETSY.COM
    “Why does my site

    perform this way?”
    

    View Slide

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?”
    

    View Slide

38. DEFINITELY BOTH
    DEFINITELY BOTH
    DEFINITELY BOTH
    

    View Slide

39. Empower teams
    

    View Slide

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
    

    View Slide

41. Integrate performance into

    product workflows
    

    View Slide

42. ❤ Graphs ❤
    

    View Slide

43. View Slide

44. View Slide

45. View Slide

46. View Slide

47. View Slide

48. View Slide

49. NAUSICAADISTRIBUTION.ETSY.COM
    

    View Slide

50. Always be
    
    A/B testing!
    NAUSICAADISTRIBUTION.ETSY.COM
    

    View Slide

51. ADRAGONFLYSVINTAGE.ETSY.COM
    ?
    

    View Slide

52. 50%
    

    View Slide

53. 100%
    50%
    

    View Slide

54. Always be
    
    integrating!
    NAUSICAADISTRIBUTION.ETSY.COM
    

    View Slide

55. Sonic
    Search experience performance improvements
    2
    Make the market page more shiny
    Pages impacted A/B test
    Negatively impacting
    1 page
    

    View Slide

56. Sonic
    Make the homepage more shiny
    market
    variant
    control
    

    View Slide

57. Help teams understand why
    performance is changing
    

    View Slide

58. Synthetic
    XRAYANN.ETSY.COM
    “Why does my site

    perform this way?”
    

    View Slide

59. View Slide

60. View Slide

61. Teach tools and practices
    

    View Slide

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
    

    View Slide

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
    
    

    View Slide

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!
    
    

    View Slide

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
    
    

    View Slide

66. Make informed decisions

    about tradeoffs
    PERFORMANCE BUDGETS
    

    View Slide

67. To infinity and beyond
    

    View Slide

68. Expand
    

    View Slide

69. You don’t have to start
    measuring everything all at once
    TO INFINITY AND BEYOND
    

    View Slide

70. Iterate
    

    View Slide

71. Maintain expertise
    

    View Slide

72. Celebrate performance
    

    View Slide

73. View Slide

74. CREATE A CULTURE THAT
    values performance
    AND empowers teams
    

    View Slide

75. THANK YOU!
    

    View Slide