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
600
Demystifying SPDY and HTTP/2
jklein
2
1.1k
Cognitive Biases in Engineering Organizations
jklein
4
1.9k
Composer: From Beginner to Expert
jklein
1
890
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
【詳説】コンテンツ配信 システムの複数機能 基盤への拡張
hatena
0
180
Pwned Labsのすゝめ
ken5scal
0
140
利用終了したドメイン名の最強終活〜観測環境を育てて、分析・供養している件〜 / The Ultimate End-of-Life Preparation for Discontinued Domain Names
nttcom
2
360
一度 Expo の採用を断念したけど、 再度 Expo の導入を検討している話
ichiki1023
1
250
Classmethod AI Talks(CATs) #17 司会進行スライド(2025.02.19) / classmethod-ai-talks-aka-cats_moderator-slides_vol17_2025-02-19
shinyaa31
0
170
ウォンテッドリーのデータパイプラインを支える ETL のための analytics, rds-exporter / analytics, rds-exporter for ETL to support Wantedly's data pipeline
unblee
0
100
Goで作って学ぶWebSocket
ryuichi1208
3
2.4k
Raycast AI APIを使ってちょっと便利な拡張機能を作ってみた / created-a-handy-extension-using-the-raycast-ai-api
kawamataryo
0
180
エンジニアリング価値を黒字化する バリューベース戦略を用いた 技術戦略策定の道のり
kzkmaeda
6
1.5k
役員・マネージャー・著者・エンジニアそれぞれの立場から見たAWS認定資格
nrinetcom
PRO
0
1.4k
クラウドサービス事業者におけるOSS
tagomoris
3
970
OPENLOGI Company Profile
hr01
0
60k
Featured
See All Featured
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
12
980
Become a Pro
speakerdeck
PRO
26
5.2k
Being A Developer After 40
akosma
89
590k
Documentation Writing (for coders)
carmenintech
67
4.6k
Typedesign – Prime Four
hannesfritz
40
2.5k
Testing 201, or: Great Expectations
jmmastey
42
7.2k
Reflections from 52 weeks, 52 projects
jeffersonlam
348
20k
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.3k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
Fontdeck: Realign not Redesign
paulrobertlloyd
83
5.4k
The World Runs on Bad Software
bkeepers
PRO
67
11k
Raft: Consensus for Rubyists
vanstee
137
6.8k
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