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

Performance and User Experience

Avatar for Jonathan Klein Jonathan Klein
October 01, 2013
Technology
0
140

Performance and User Experience

A talk I gave at UX Fest 2013 at the offices of Fresh Tilled Soil in Boston, Massachusetts

Avatar for Jonathan Klein

Jonathan Klein

October 01, 2013
Tweet

More Decks by Jonathan Klein

See All by Jonathan Klein
Cognitive Biases in Engineering Organizations - Craft Conf
Avatar for Jonathan Klein jklein
15
450
Demystifying SPDY and HTTP/2
Avatar for Jonathan Klein jklein
1
640
Demystifying SPDY and HTTP/2
Avatar for Jonathan Klein jklein
2
1.1k
Cognitive Biases in Engineering Organizations
Avatar for Jonathan Klein jklein
4
2k
Composer: From Beginner to Expert
Avatar for Jonathan Klein jklein
1
1k
Upgrading the Web: Boston Web Performance Meetup
Avatar for Jonathan Klein jklein
1
310
Upgrading the Web: Driving Support For New Standards
Avatar for Jonathan Klein jklein
1
820
Northeastern Lunch and Learn
Avatar for Jonathan Klein jklein
0
260
Profiling PHP With XHProf
Avatar for Jonathan Klein jklein
1
1k

Other Decks in Technology

See All in Technology
Perlブートキャンプ
Avatar for Hatena hatena
0
270
QAを"自動化する"ことの本質
Avatar for Keisuke Shinozaki kshino
1
140
機密情報の漏洩を防げ！ Webフロントエンド開発で意識すべき漏洩パターンとその対策
Avatar for mizdra mizdra
PRO
10
3.6k
Capitole du Libre 2025 - Keynote - Cloud du Coeur
Avatar for Julien Briault ju_hnny5
0
120
プロジェクトの空気を読んで開発してくれるPerlのAIツールがほしい
Avatar for Kenta Kobayashi kfly8
2
100
Axon Frameworkのイベントストアを独自拡張した話
Avatar for ZOZO Developers zozotech
PRO
0
190
「データ無い！ 腹立つ！ 推論する！」から 「データ無い！ 腹立つ！ データを作る」へ チームでデータを作り、育てられるようにするまで / How can we create, use, and maintain data ourselves?
Avatar for moznion moznion
8
4.5k
ステートレスなLLMでステートフルなAI agentを作る - YAPC::Fukuoka 2025
Avatar for FUJI Goro gfx
8
1.3k
FFMとJVMの実装から学ぶJavaのインテグリティ
Avatar for Kenji Kazumura kazumura
0
130
第65回コンピュータビジョン勉強会
Avatar for TSUKAMOTO Kenji tsukamotokenji
0
150
AI × クラウドで シイタケの収穫時期を判定してみた
Avatar for Lamaglama39 lamaglama39
1
360
AIエージェントによるエンタープライズ向けスライド検索！
Avatar for shibuiwilliam shibuiwilliam
4
560

Featured

See All Featured
Building an army of robots
Avatar for Kyle Neath kneath
306
46k
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
5.9k
Designing Experiences People Love
Avatar for Jonathan Moore moore
142
24k
It's Worth the Effort
Avatar for 3n 3n
187
28k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
10
670
Thoughts on Productivity
Avatar for Jon Yablonski jonyablonski
73
4.9k
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
140
7.2k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
55
3.1k
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
65
8k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
46
7.8k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
225
10k
Become a Pro
Avatar for Speaker Deck speakerdeck
PRO
29
5.6k

Transcript

  1. RUM Distillation 101 UX Fest 2013 Jonathan Klein @jonathanklein Tuesday,

    October 1, 13

  2. Some Etsy Stats • Handmade marketplace • 1.5 billion page

    views/month • Almost $1B in sales last year Tuesday, October 1, 13

  3. Tuesday, October 1, 13

  4. What We Focus On Tuesday, October 1, 13

  5. Metrics We Care About Tuesday, October 1, 13

  6. Metrics We Care About • Backend Load Time Tuesday, October

    1, 13

  7. Metrics We Care About • Backend Load Time • SEO,

    capacity, impacts first paint Tuesday, October 1, 13

  8. Metrics We Care About • Backend Load Time • SEO,

    capacity, impacts first paint • Time to first paint Tuesday, October 1, 13

  9. Metrics We Care About • Backend Load Time • SEO,

    capacity, impacts first paint • Time to first paint • Rendering Performance Tuesday, October 1, 13

  10. Metrics We Care About • Backend Load Time • SEO,

    capacity, impacts first paint • Time to first paint • Rendering Performance Tuesday, October 1, 13

  11. Time to First Paint Tuesday, October 1, 13

  12. Tuesday, October 1, 13

  13. Blocked By Tuesday, October 1, 13

  14. Blocked By • Base HTML Page Tuesday, October 1, 13

  15. Blocked By • Base HTML Page • CSS Tuesday, October

    1, 13

  16. Blocked By • Base HTML Page • CSS • JavaScript

    Tuesday, October 1, 13

  17. Solutions Tuesday, October 1, 13

  18. Solutions • Small CSS (can inline) Tuesday, October 1, 13

  19. Solutions • Small CSS (can inline) • Defer JavaScript Tuesday,

    October 1, 13

  20. Solutions • Small CSS (can inline) • Defer JavaScript •

    Fast backend Tuesday, October 1, 13

  21. Solutions • Small CSS (can inline) • Defer JavaScript •

    Fast backend • CDN Tuesday, October 1, 13

  22. Rendering Performance Tuesday, October 1, 13

  23. 60 FPS Tuesday, October 1, 13

  24. 16.6 ms Tuesday, October 1, 13

  25. Tuesday, October 1, 13

  26. Jank Tuesday, October 1, 13

  27. http://jankfree.org/jank-busters-io-2013/template.html#15 Tuesday, October 1, 13

  28. Why Do We Care? Tuesday, October 1, 13

  29. Facebook artificially slowed down frame rate on iOS and Android

    to 30 FPS, and “engagement collapsed” - Shane O'Sullivan, Edge London 2013 Tuesday, October 1, 13

  30. Etsy tested pre-fetching JS on our search results page, which

    caused jank as the JS finished downloading. All business metrics we monitored got much worse. - Me, right now Tuesday, October 1, 13

  31. Solutions Tuesday, October 1, 13

  32. Tuesday, October 1, 13

  33. jankfree.org Tuesday, October 1, 13

  34. Etsy Studies Tuesday, October 1, 13

  35. Improved Performance Tuesday, October 1, 13

  36. Improved Performance • Went from 4 sharded domains to two

    Tuesday, October 1, 13

  37. Improved Performance • Went from 4 sharded domains to two

    • 500ms load time improvement on mobile Tuesday, October 1, 13

  38. Improved Performance • Went from 4 sharded domains to two

    • 500ms load time improvement on mobile • 30-50ms on desktop Tuesday, October 1, 13

  39. Improved Performance • Went from 4 sharded domains to two

    • 500ms load time improvement on mobile • 30-50ms on desktop • 0.27% increase in page views per visit Tuesday, October 1, 13

  40. Increased Page Weight Tuesday, October 1, 13

  41. Increased Page Weight • Added ~160k more bytes on mobile

    Tuesday, October 1, 13

  42. Increased Page Weight • Added ~160k more bytes on mobile

    • 12% increase in bounce rate Tuesday, October 1, 13

  43. Tradeoffs Tuesday, October 1, 13

  44. Test Everything Tuesday, October 1, 13

  45. Listen to the Customer Tuesday, October 1, 13

  46. Faster is Better Tuesday, October 1, 13