Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Why Fast Matters

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.

Harry Roberts

May 17, 2017
Tweet

More Decks by Harry Roberts

Other Decks in Technology

Transcript

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  6. WPOSTATS.COM

    View full-size slide

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

    View full-size slide

  8. IT’S NOT JUST FINANCIAL…

    View full-size slide

  9. — 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 full-size slide

  10. — 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 full-size slide

  11. THE NEXT BILLION USERS

    View full-size slide

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

    View full-size slide

  13. csswz.it/2pa7bX0

    View full-size slide

  14. 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 full-size slide

  15. 34× MORE MOBILE
    THAN BROADBAND

    View full-size slide

  16. 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 full-size slide

  17. 58× MORE MOBILE
    THAN BROADBAND

    View full-size slide

  18. 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 full-size slide

  19. 70× MORE MOBILE
    THAN BROADBAND

    View full-size slide

  20. 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 full-size slide

  21. 121× MORE MOBILE
    THAN BROADBAND

    View full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  25. WHAT DOES THIS TELL US?

    View full-size slide

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

    View full-size slide

  27. HOW FAST IS FAST ENOUGH?

    View full-size slide

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

    View full-size slide

  29. JUST BE FASTER THAN YOUR
    NEAREST COMPETITOR…

    View full-size slide

  30. dareboost.com

    View full-size slide

  31. speedcurve.com

    View full-size slide

  32. GETTING THERE

    View full-size slide

  33. STEP 0: WANT A FAST WEBSITE

    View full-size slide

  34. 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 full-size slide

  35. STEP 1: UNDERSTAND THE
    PROBLEM

    View full-size slide

  36. …PROPERLY UNDERSTAND IT

    View full-size slide

  37. charlesproxy.com

    View full-size slide

  38. IT’S NOT JUST CONNECTION
    SPEED ANYMORE…

    View full-size slide

  39. geekaphone.com

    View full-size slide

  40. csswz.it/2pL4MlZ

    View full-size slide

  41. THERE’S NO REPLACEMENT
    FOR REAL DEVICES

    View full-size slide

  42. BUILD UP AN IDEA OF
    REALISTIC CONDITIONS

    View full-size slide

  43. STEP 2: KNOW WHAT’S GOING ON

    View full-size slide

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

    View full-size slide

  45. 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 full-size slide

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

    View full-size slide

  47. csswz.it/2qdCJzg

    View full-size slide

  48. KNOW YOUR LIABILITIES…

    View full-size slide

  49. Performance » Bottom-Up » Group By Domain

    View full-size slide

  50. IDENTIFYING THIRD PARTIES

    View full-size slide

  51. BEING VULNERABLE

    View full-size slide

  52. ##
    # 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 full-size slide

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

    View full-size slide

  54. STEP 3: MEASURE EVERYTHING

    View full-size slide

  55. HOW DO WE KNOW:

    1) WHAT’S WRONG?

    2) WHEN IT’S RIGHT?

    View full-size slide

  56. jana.com/insights

    View full-size slide

  57. 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 full-size slide

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

    View full-size slide

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

    View full-size slide

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

    View full-size slide

  61. THANK YOU
    Harry Roberts
    @csswizardry
    [email protected]
    speakerdeck.com/csswizardry

    View full-size slide