Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Performance and User Experience
Search
Jonathan Klein
October 01, 2013
Technology
0
78
Performance and User Experience
A talk I gave at UX Fest 2013 at the offices of Fresh Tilled Soil in Boston, Massachusetts
Jonathan Klein
October 01, 2013
Tweet
Share
More Decks by Jonathan Klein
See All by Jonathan Klein
Cognitive Biases in Engineering Organizations - Craft Conf
jklein
15
320
Demystifying SPDY and HTTP/2
jklein
1
520
Demystifying SPDY and HTTP/2
jklein
2
880
Cognitive Biases in Engineering Organizations
jklein
4
1.8k
Composer: From Beginner to Expert
jklein
1
710
Upgrading the Web: Boston Web Performance Meetup
jklein
1
240
Upgrading the Web: Driving Support For New Standards
jklein
1
660
Northeastern Lunch and Learn
jklein
0
180
Profiling PHP With XHProf
jklein
1
940
Other Decks in Technology
See All in Technology
NgRx Signal Store
rainerhahnekamp
0
150
GraphQL 成熟度モデルの紹介と、プロダクトに当てはめた事例 / GraphQL maturity model
mh4gf
7
1.3k
JAWS-UG Bedrock Claude Night
yamahiro
3
540
最近たまに見かけるTiDBってなんだ? - Findy
pingcap0315
2
760
Postman v10リリース後を振り返る
nagix
0
170
20240416_devopsdaystokyo
kzkmaeda
1
220
ChatGPT for IT Service Management (IT Pro)
dahatake
7
1.5k
VSCodeの拡張機能を作っている話
ebarakazuhiro
1
240
Terraformあれやこれ/terraform-this-and-that
emiki
8
1.3k
コードを書く隙間を見つけて生きていく技術/Findy 思考の現在地
fujiwara3
27
5.8k
自己改善からチームを動かす! 「セルフエンジニアリングマネージャー」のすゝめ
shoota
6
260
日本におけるデータエンジニアリングのこれまでとこれから
foursue
16
4.2k
Featured
See All Featured
Web development in the modern age
philhawksworth
202
10k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
14
1.5k
Music & Morning Musume
bryan
41
5.6k
[RailsConf 2023] Rails as a piece of cake
palkan
23
3.9k
Optimising Largest Contentful Paint
csswizardry
8
2.4k
We Have a Design System, Now What?
morganepeng
43
6.7k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
60
14k
Why You Should Never Use an ORM
jnunemaker
PRO
51
8.6k
Designing the Hi-DPI Web
ddemaree
276
33k
Art, The Web, and Tiny UX
lynnandtonic
289
19k
Typedesign – Prime Four
hannesfritz
36
2.1k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
17
1.4k
Transcript
RUM Distillation 101 UX Fest 2013 Jonathan Klein @jonathanklein Tuesday,
October 1, 13
Some Etsy Stats • Handmade marketplace • 1.5 billion page
views/month • Almost $1B in sales last year Tuesday, October 1, 13
Tuesday, October 1, 13
What We Focus On Tuesday, October 1, 13
Metrics We Care About Tuesday, October 1, 13
Metrics We Care About • Backend Load Time Tuesday, October
1, 13
Metrics We Care About • Backend Load Time • SEO,
capacity, impacts first paint Tuesday, October 1, 13
Metrics We Care About • Backend Load Time • SEO,
capacity, impacts first paint • Time to first paint Tuesday, October 1, 13
Metrics We Care About • Backend Load Time • SEO,
capacity, impacts first paint • Time to first paint • Rendering Performance Tuesday, October 1, 13
Metrics We Care About • Backend Load Time • SEO,
capacity, impacts first paint • Time to first paint • Rendering Performance Tuesday, October 1, 13
Time to First Paint Tuesday, October 1, 13
Tuesday, October 1, 13
Blocked By Tuesday, October 1, 13
Blocked By • Base HTML Page Tuesday, October 1, 13
Blocked By • Base HTML Page • CSS Tuesday, October
1, 13
Blocked By • Base HTML Page • CSS • JavaScript
Tuesday, October 1, 13
Solutions Tuesday, October 1, 13
Solutions • Small CSS (can inline) Tuesday, October 1, 13
Solutions • Small CSS (can inline) • Defer JavaScript Tuesday,
October 1, 13
Solutions • Small CSS (can inline) • Defer JavaScript •
Fast backend Tuesday, October 1, 13
Solutions • Small CSS (can inline) • Defer JavaScript •
Fast backend • CDN Tuesday, October 1, 13
Rendering Performance Tuesday, October 1, 13
60 FPS Tuesday, October 1, 13
16.6 ms Tuesday, October 1, 13
Tuesday, October 1, 13
Jank Tuesday, October 1, 13
http://jankfree.org/jank-busters-io-2013/template.html#15 Tuesday, October 1, 13
Why Do We Care? Tuesday, October 1, 13
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
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
Solutions Tuesday, October 1, 13
Tuesday, October 1, 13
jankfree.org Tuesday, October 1, 13
Etsy Studies Tuesday, October 1, 13
Improved Performance Tuesday, October 1, 13
Improved Performance • Went from 4 sharded domains to two
Tuesday, October 1, 13
Improved Performance • Went from 4 sharded domains to two
• 500ms load time improvement on mobile Tuesday, October 1, 13
Improved Performance • Went from 4 sharded domains to two
• 500ms load time improvement on mobile • 30-50ms on desktop Tuesday, October 1, 13
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
Increased Page Weight Tuesday, October 1, 13
Increased Page Weight • Added ~160k more bytes on mobile
Tuesday, October 1, 13
Increased Page Weight • Added ~160k more bytes on mobile
• 12% increase in bounce rate Tuesday, October 1, 13
Tradeoffs Tuesday, October 1, 13
Test Everything Tuesday, October 1, 13
Listen to the Customer Tuesday, October 1, 13
Faster is Better Tuesday, October 1, 13