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
92
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
330
Demystifying SPDY and HTTP/2
jklein
1
540
Demystifying SPDY and HTTP/2
jklein
2
950
Cognitive Biases in Engineering Organizations
jklein
4
1.8k
Composer: From Beginner to Expert
jklein
1
800
Upgrading the Web: Boston Web Performance Meetup
jklein
1
250
Upgrading the Web: Driving Support For New Standards
jklein
1
720
Northeastern Lunch and Learn
jklein
0
190
Profiling PHP With XHProf
jklein
1
960
Other Decks in Technology
See All in Technology
リクルート新人研修2024 テキスト生成AI活用
recruitengineers
PRO
10
420
Bidirectional Quadratic Voting Leveraging Issue-Based Matching
kentaro
2
170
エンジニア採用を起点に取り組む組織の改善活動と課題、中長期のタスク管理/ #HRmethod
nishiuma
4
3.3k
実践的なバグバウンティ入門
scgajge12
4
2.1k
Estrategias de escalabilidade para projetos web
jessilyneh
1
160
React Aria で実現する次世代のアクセシビリティ
ryo_manba
3
320
waitany と waitall を作った話
mrkn
0
110
FastlyとfalcoでNode.jsレスな Webサーバー構築 : IPTV版 ABEMAアプリインフラ刷新 / Building web server using Fastly and falco without Node.js for IPTV ABEMA app
nodaguti
0
240
SHIFTの課題と目指したい組織像 / 20240827 Rinto Ikenoue
shift_evolve
0
140
Building Static Websites with Sculpin
opdavies
0
1.4k
HolidayJp.jl を作りました
mrkn
0
110
ログラスが面白いと思う理由をマネージャーがエモく語ってみる / 20240829 vs LT
yoshikiiida
1
520
Featured
See All Featured
ParisWeb 2013: Learning to Love: Crash Course in Emotional UX Design
dotmariusz
109
6.9k
Web Components: a chance to create the future
zenorocha
308
41k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
34
1.9k
Why You Should Never Use an ORM
jnunemaker
PRO
53
8.9k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
354
29k
BBQ
matthewcrist
83
9.1k
Optimising Largest Contentful Paint
csswizardry
28
2.7k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
22
580
Java REST API Framework Comparison - PWX 2021
mraible
PRO
27
7.4k
Building Your Own Lightsaber
phodgson
101
5.9k
From Idea to $5000 a Month in 5 Months
shpigford
378
46k
The Cult of Friendly URLs
andyhume
76
5.9k
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