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.

JS Fest 2018. Harry Roberts. Why Fast Matters

466 views

Published on

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.

Published in: Education
  • Be the first to comment

  • Be the first to like this

JS Fest 2018. Harry Roberts. Why Fast Matters

  1. 1. WHY FAST MATTERS Harry Roberts | infoShare, Gdańsk | May 2017
  2. 2. HI, I’M HARRY Consultant Performance Engineer Leeds, UK @csswizardry csswizardry.com
  3. 3. THE TRAINLINE REDUCED LATENCY BY 0.3 SECONDS […] AND CUSTOMERS SPENT AN EXTRA £8.1M A YEAR
  4. 4. NETFLIX SAW A 43% DECREASE IN THEIR BANDWIDTH BILL AFTER TURNING ON GZIP
  5. 5. GQ CUT LOAD TIME BY 80% AND SAW AN 80% INCREASE IN TRAFFIC. MEDIAN TIME SPENT ON THE SITE INCREASED BY 32%
  6. 6. WPOSTATS.COM
  7. 7. 1. IT WILL MAKE YOU MONEY 2. IT WILL SAVE YOU MONEY 3. IT MAKES USERS HAPPIER
  8. 8. IT’S NOT JUST FINANCIAL…
  9. 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.”
  10. 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.”
  11. 11. THE NEXT BILLION USERS
  12. 12. qz.com/on/the-next-billion
  13. 13. csswz.it/2pa7bX0
  14. 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)*
  15. 15. 34× MORE MOBILE THAN BROADBAND
  16. 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)*
  17. 17. 58× MORE MOBILE THAN BROADBAND
  18. 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)*
  19. 19. 70× MORE MOBILE THAN BROADBAND
  20. 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)*
  21. 21. 121× MORE MOBILE THAN BROADBAND
  22. 22. ! " # $ 3,537.5KBPS AVERAGE SPEED 20.1% OF PEOPLE ARE ONLINE 1.45% HAVE BROADBAND 90.35% ON CELLULAR
  23. 23. % 14,936KBPS AVERAGE SPEED 92% OF PEOPLE ARE ONLINE 37.7% HAVE BROADBAND 125.8% ON CELLULAR
  24. 24. & 12,754KBPS AVERAGE SPEED 68.0% OF PEOPLE ARE ONLINE 19.5% HAVE BROADBAND 148.7% ON CELLULAR
  25. 25. WHAT DOES THIS TELL US?
  26. 26. WE’RE BUILDING FOR A TOTALLY DIFFERENT PROFILE OF USER
  27. 27. HOW FAST IS FAST ENOUGH?
  28. 28. HOW FAST IS FAST ENOUGH? It’s hard to say… You can run benchmarking Get a feel for things over time
  29. 29. JUST BE FASTER THAN YOUR NEAREST COMPETITOR…
  30. 30. dareboost.com
  31. 31. speedcurve.com
  32. 32. GETTING THERE
  33. 33. STEP 0: WANT A FAST WEBSITE
  34. 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
  35. 35. STEP 1: UNDERSTAND THE PROBLEM
  36. 36. …PROPERLY UNDERSTAND IT
  37. 37. charlesproxy.com
  38. 38. IT’S NOT JUST CONNECTION SPEED ANYMORE…
  39. 39. geekaphone.com
  40. 40. csswz.it/2pL4MlZ
  41. 41. THERE’S NO REPLACEMENT FOR REAL DEVICES
  42. 42. BUILD UP AN IDEA OF REALISTIC CONDITIONS
  43. 43. STEP 2: KNOW WHAT’S GOING ON
  44. 44. WHAT DOES THIS SCRIPT DO? WHICH TEAM IS IN CHARGE OF THIS THING? ARE WE EVEN USING THIS?
  45. 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
  46. 46. CALL MEETINGS Work out what everything is Who is using it Do they need it What can you do about it
  47. 47. csswz.it/2qdCJzg
  48. 48. KNOW YOUR LIABILITIES…
  49. 49. Performance » Bottom-Up » Group By Domain
  50. 50. IDENTIFYING THIRD PARTIES
  51. 51. BEING VULNERABLE
  52. 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
  53. 53. DON’T PRIORITISE YOUR OWN METRICS OVER YOUR USERS’ EXPERIENCES
  54. 54. STEP 3: MEASURE EVERYTHING
  55. 55. HOW DO WE KNOW:
 1) WHAT’S WRONG? 
 2) WHEN IT’S RIGHT?
  56. 56. jana.com/insights
  57. 57. BUDGETING
  58. 58. 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
  59. 59. Not the most complex site in the world But fairly typical Plenty going on CSSWIZARDRY.COM
  60. 60. CLOSING…
  61. 61. CLOSING Care: Actually prioritise, consider, and champion performance Understand: Your customers, the problem, the landscape Measure: Everything you can, before and after
  62. 62. STATISTICS AND DATA Tim Kadlec, Tammy Everts * World DataBank † Akamai State of the Internet ‡ ITU Measuring the Information Society Report
  63. 63. THANK YOU Harry Roberts @csswizardry csswizardry@gmail.com speakerdeck.com/csswizardry

×