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
Optimizing & Profiling UI Performance
Search
Brenda Cook
July 29, 2016
Programming
6
13k
Optimizing & Profiling UI Performance
Presented at 360|AnDev 2016
Brenda Cook
July 29, 2016
Tweet
Share
More Decks by Brenda Cook
See All by Brenda Cook
Fragments: Why? How? and What For?
kenodoggy
3
3.5k
Other Decks in Programming
See All in Programming
Processing Gem ベースの、2D レトロゲームエンジンの開発
tokujiros
2
120
機能追加とリーダー業務の類似性
rinchoku
2
1k
MCPでVibe Working。そして、結局はContext Eng(略)/ Working with Vibe on MCP And Context Eng
rkaga
5
1.9k
奥深くて厄介な「改行」と仲良くなる20分
oguemon
1
420
MCPとデザインシステムに立脚したデザインと実装の融合
yukukotani
4
1.3k
実用的なGOCACHEPROG実装をするために / golang.tokyo #40
mazrean
1
220
Microsoft Orleans, Daprのアクターモデルを使い効率的に開発、デプロイを行うためのSekibanの試行錯誤 / Sekiban: Exploring Efficient Development and Deployment with Microsoft Orleans and Dapr Actor Models
tomohisa
0
240
testingを眺める
matumoto
1
130
react-callを使ってダイヤログをいろんなとこで再利用しよう!
shinaps
1
160
AIコーディングAgentとの向き合い方
eycjur
0
260
「待たせ上手」なスケルトンスクリーン、 そのUXの裏側
teamlab
PRO
0
240
print("Hello, World")
eddie
1
490
Featured
See All Featured
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.6k
Facilitating Awesome Meetings
lara
55
6.5k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Mobile First: as difficult as doing things right
swwweet
224
9.9k
How to Think Like a Performance Engineer
csswizardry
26
1.9k
Art, The Web, and Tiny UX
lynnandtonic
302
21k
Speed Design
sergeychernyshev
32
1.1k
Documentation Writing (for coders)
carmenintech
74
5k
How to Ace a Technical Interview
jacobian
279
23k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.8k
GraphQLとの向き合い方2022年版
quramy
49
14k
Site-Speed That Sticks
csswizardry
10
810
Transcript
Optimizing & Profiling UI Performance
What does it mean to have performant UI?
Jank
Frame Rate (FPS)
Refresh Rate (Hz)
1 second (1000ms) / 60 frames = 16.67ms per frame
FPS is capped by device display (refresh rate Hz) due to VSync
VSync
3 Double Buffering 0 1 2 1 2 CPU GPU
Display 1 1 Front Buffer CPU GPU Back Buffer 2 3 3 VSync VSync VSync VSync Frame Drop
4 3 Triple Buffering 0 1 2 3 1 2
CPU GPU Display 1 1 Front Buffer CPU GPU Back Buffer CPU GPU 3rd Buffer 2 3 4 VSync VSync VSync VSync Frame Drop
No VSync
Optimize
Flatten View Hierarchy
Deeply Nested View Hierarchy
Deeply Nested View Hierarchy
Shallow View Hierarchy
Deeply Nested Design View Optimized
Hierarchy Viewer
3 2 1
[show deeply nested hierarchy]
[show shallow hierarchy]
[show image of obtaining measure, layout and draw time]
None
None
Know your Views
GPU Overdraw
None
None
None
clipRect & quickReject
Performance Profiling
Profile GPU Rendering
None
Marshmallow
None
Android Studio Monitors
None
android { buildTypes { debug { debuggable true }
release { ... } } }
None
None
Systrace
$ cd android-sdk/platform-tools/systrace $ python systrace.py --time=10 -o mytrace.html sched
gfx view wm
None
None
None
None
None
None
None
None
Image Libraries to the Rescue! Picasso
Thank you Twitter @kenodoggy g+ +BrendaCook_kenodoggy