Why Fast Matters

We’re all—I hope!—well aware that performance is important; it’s great for business and it’s great for our users. But things are still not fast enough. With more and more emerging markets coming online, and more and more apps moving to the web platform, we’re reaching an intersection where connections are getting slower and websites are getting heavier. In this talk, we’ll learn just what these emerging markets mean to us, and how we can begin to move in the right direction.

Transcript

1. WHY FAST MATTERS
   Harry Roberts | infoShare, Gdańsk | May 2017
   

   View Slide

2. HI, I’M HARRY
   Consultant Performance Engineer
   Leeds, UK
   @csswizardry
   csswizardry.com
   

   View Slide

3. View Slide

4. THE TRAINLINE REDUCED
   LATENCY BY 0.3 SECONDS […]
   AND CUSTOMERS SPENT AN
   EXTRA £8.1M A YEAR
   

   View Slide

5. NETFLIX SAW A 43% DECREASE
   IN THEIR BANDWIDTH BILL AFTER
   TURNING ON GZIP
   

   View Slide

6. GQ CUT LOAD TIME BY 80% AND
   SAW AN 80% INCREASE IN
   TRAFFIC. MEDIAN TIME SPENT ON
   THE SITE INCREASED BY 32%
   

   View Slide

7. WPOSTATS.COM
   

   View Slide

8. 1. IT WILL MAKE YOU MONEY
   2. IT WILL SAVE YOU MONEY
   3. IT MAKES USERS HAPPIER
   

   View Slide

9. IT’S NOT JUST FINANCIAL…
   

   View Slide

10. — My Buddy Warren
    “Sorry I didn’t reply to your email mate… I could see it but
    couldn’t open it because the internet out [in Thailand] is s—t.”
    

    View Slide

11. — Anon
    “I am currently at my parents’ place in Rawatbhata,
    Rajasthan [India]. Since my parents don’t have a computer
    they only consume internet through their
    smartphone […] providers which in our town are still 2G.
    Right now I have connected my laptop via WiFi hotspot.
    Opening Gmail in basic HTML version takes 30s to a minute.”
    

    View Slide

12. View Slide

13. THE NEXT BILLION USERS
    

    View Slide

14. qz.com/on/the-next-billion
    

    View Slide

15. csswz.it/2pa7bX0
    

    View Slide

16. BANGLADESH !
    Average connection: 3,634kbps†
    14.4% of the country is online*
    3.9m broadband subscriptions (2.4 per 100 people)*
    133.7m cellular subscriptions (83.4 per 100 people)*
    

    View Slide

17. 34× MORE MOBILE
    THAN BROADBAND
    

    View Slide

18. INDIA "
    Average connection: 3,465kbps†
    26% of the country is online*
    17.1m broadband subscriptions (1.3 per 100 people)*
    1b cellular subscriptions (78.8 per 100 people)*
    

    View Slide

19. 58× MORE MOBILE
    THAN BROADBAND
    

    View Slide

20. PAKISTAN #
    Average connection: 2,508kbps†
    18% of the country is online*
    1.8m broadband subscriptions (1 per 100 people)*
    125.9m cellular subscriptions (66.9 per 100 people)*
    

    View Slide

21. 70× MORE MOBILE
    THAN BROADBAND
    

    View Slide

22. INDONESIA $
    Average connection: 4,543kbps†
    22% of the country is online*
    2.8m broadband subscriptions (1.1 per 100 people)*
    338.4m cellular subscriptions (132.3 per 100 people)*
    

    View Slide

23. 121× MORE MOBILE
    THAN BROADBAND
    

    View Slide

24. ! " # $
    3,537.5KBPS AVERAGE SPEED
    20.1% OF PEOPLE ARE ONLINE
    1.45% HAVE BROADBAND
    90.35% ON CELLULAR
    

    View Slide

25. %
    14,936KBPS AVERAGE SPEED
    92% OF PEOPLE ARE ONLINE
    37.7% HAVE BROADBAND
    125.8% ON CELLULAR
    

    View Slide

26. &
    12,754KBPS AVERAGE SPEED
    68.0% OF PEOPLE ARE ONLINE
    19.5% HAVE BROADBAND
    148.7% ON CELLULAR
    

    View Slide

27. WHAT DOES THIS TELL US?
    

    View Slide

28. WE’RE BUILDING FOR A TOTALLY
    DIFFERENT PROFILE OF USER
    

    View Slide

29. HOW FAST IS FAST ENOUGH?
    

    View Slide

30. HOW FAST IS FAST ENOUGH?
    It’s hard to say…
    You can run benchmarking
    Get a feel for things over time
    

    View Slide

31. JUST BE FASTER THAN YOUR
    NEAREST COMPETITOR…
    

    View Slide

32. dareboost.com
    

    View Slide

33. speedcurve.com
    

    View Slide

34. GETTING THERE
    

    View Slide

35. STEP 0: WANT A FAST WEBSITE
    

    View Slide

36. WANT A FAST WEBSITE
    Do not underestimate the importance of this step
    Things get markedly easier if you actually try
    Make sure it’s a business goal/priority
    Ensure that people are putting effort into performance
    

    View Slide

37. STEP 1: UNDERSTAND THE
    PROBLEM
    

    View Slide

38. …PROPERLY UNDERSTAND IT
    

    View Slide

39. View Slide

40. charlesproxy.com
    

    View Slide

41. IT’S NOT JUST CONNECTION
    SPEED ANYMORE…
    

    View Slide

42. View Slide

43. View Slide

44. geekaphone.com
    

    View Slide

45. csswz.it/2pL4MlZ
    

    View Slide

46. View Slide

47. THERE’S NO REPLACEMENT
    FOR REAL DEVICES
    

    View Slide

48. View Slide

49. View Slide

50. BUILD UP AN IDEA OF
    REALISTIC CONDITIONS
    

    View Slide

51. STEP 2: KNOW WHAT’S GOING ON
    

    View Slide

52. WHAT DOES THIS SCRIPT DO?
    WHICH TEAM IS IN CHARGE OF
    THIS THING?
    ARE WE EVEN USING THIS?
    

    View Slide

53. KNOW WHAT’S GOING ON
    Other people/teams add things to your site all the time
    Tag managers, social widgets, tracking scripts, analytics
    Schrödinger effect: measuring/optimising has its own overhead
    

    View Slide

54. CALL MEETINGS
    Work out what everything is
    Who is using it
    Do they need it
    What can you do about it
    

    View Slide

55. View Slide

56. csswz.it/2qdCJzg
    

    View Slide

57. KNOW YOUR LIABILITIES…
    

    View Slide

58. View Slide

59. Performance » Bottom-Up » Group By Domain
    

    View Slide

60. View Slide

61. IDENTIFYING THIRD PARTIES
    

    View Slide

62. View Slide

63. View Slide

64. View Slide

65. BEING VULNERABLE
    

    View Slide

66. View Slide

67. View Slide

68. ##
    # SPoF Spoofing
    #
    # Point third-party domains at WPT’s blackhole server.
    ##
    72.66.115.13 platform.twitter.com
    72.66.115.13 connect.facebook.net
    72.66.115.13 fonts.googleapis.com
    72.66.115.13 assets.adobedtm.com
    72.66.115.13 fast.fonts.net
    

    View Slide

69. DON’T PRIORITISE
    YOUR OWN METRICS OVER
    YOUR USERS’ EXPERIENCES
    

    View Slide

70. STEP 3: MEASURE EVERYTHING
    

    View Slide

71. HOW DO WE KNOW:

    1) WHAT’S WRONG?
    

    2) WHEN IT’S RIGHT?
    

    View Slide

72. View Slide

73. View Slide

74. View Slide

75. View Slide

76. jana.com/insights
    

    View Slide

77. View Slide

78. View Slide

79. View Slide

80. View Slide

81. BUDGETING
    

    View Slide

82. PERFORMANCE BUDGETS
    Basically just monitoring with alerts
    After a while, you’ll begin to know how fast you should be
    Set budgets and tolerances
    Endeavour to stay within those limits
    

    View Slide

83. View Slide

84. Not the most complex site in the world
    But fairly typical
    Plenty going on
    CSSWIZARDRY.COM
    

    View Slide

85. View Slide

86. View Slide

87. View Slide

88. View Slide

89. View Slide

90. View Slide

91. View Slide

92. CLOSING…
    

    View Slide

93. CLOSING
    Care: Actually prioritise, consider, and champion performance
    Understand: Your customers, the problem, the landscape
    Measure: Everything you can, before and after
    

    View Slide

94. STATISTICS AND DATA
    Tim Kadlec, Tammy Everts
    * World DataBank
    † Akamai State of the Internet
    ‡ ITU Measuring the Information Society Report
    

    View Slide

95. THANK YOU
    Harry Roberts
    @csswizardry
    csswizardry@gmail.com
    speakerdeck.com/csswizardry
    

    View Slide