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
110
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
370
Demystifying SPDY and HTTP/2
jklein
1
590
Demystifying SPDY and HTTP/2
jklein
2
1k
Cognitive Biases in Engineering Organizations
jklein
4
1.9k
Composer: From Beginner to Expert
jklein
1
860
Upgrading the Web: Boston Web Performance Meetup
jklein
1
270
Upgrading the Web: Driving Support For New Standards
jklein
1
770
Northeastern Lunch and Learn
jklein
0
220
Profiling PHP With XHProf
jklein
1
990
Other Decks in Technology
See All in Technology
Swiftの “private” を テストする / Testing Swift "private"
yutailang0119
0
130
レビューを増やしつつ 高評価維持するテクニック
tsuzuki817
1
710
Amazon S3 Tablesと外部分析基盤連携について / Amazon S3 Tables and External Data Analytics Platform
nttcom
0
130
Building Products in the LLM Era
ymatsuwitter
10
5.4k
トラシューアニマルになろう ~開発者だからこそできる、安定したサービス作りの秘訣~
jacopen
2
2k
抽象化をするということ - 具体と抽象の往復を身につける / Abstraction and concretization
soudai
16
4.6k
エンジニアの育成を支える爆速フィードバック文化
sansantech
PRO
3
1.1k
Moved to https://speakerdeck.com/toshihue/presales-engineer-career-bridging-tech-biz-ja
toshihue
2
740
OpenID BizDay#17 KYC WG活動報告(法人) / 20250219-BizDay17-KYC-legalidentity
oidfj
0
240
バックエンドエンジニアのためのフロントエンド入門 #devsumiC
panda_program
18
7.5k
Oracle Cloud Infrastructure:2025年2月度サービス・アップデート
oracle4engineer
PRO
1
210
次世代KYC活動報告 / 20250219-BizDay17-KYC-nextgen
oidfj
0
250
Featured
See All Featured
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.2k
Agile that works and the tools we love
rasmusluckow
328
21k
Product Roadmaps are Hard
iamctodd
PRO
50
11k
Building a Scalable Design System with Sketch
lauravandoore
461
33k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
21
2.5k
Scaling GitHub
holman
459
140k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
The Art of Programming - Codeland 2020
erikaheidi
53
13k
Large-scale JavaScript Application Architecture
addyosmani
511
110k
VelocityConf: Rendering Performance Case Studies
addyosmani
328
24k
Making the Leap to Tech Lead
cromwellryan
133
9.1k
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