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
Google I/O 2023 - Debugging Jetpack Composeについて
Search
Shun Miyazaki
June 08, 2023
Technology
0
780
Google I/O 2023 - Debugging Jetpack Composeについて
Google I/O 2023 に行われたセッション「Debugging Jetpack Compose」の内容 / 感想をまとめたものです。
Shun Miyazaki
June 08, 2023
Tweet
Share
More Decks by Shun Miyazaki
See All by Shun Miyazaki
DroidKaigi アプリに初コントリビュートしました
shunm
0
44
Kotlinで簡単なDSLを作ってみる
shunm
0
25
Google I/O 2024 - Gemeni API on Androidの解説
shunm
0
440
Jetpack Compose で SharedElementTransitionっぽい挙動をやってみる
shunm
0
140
Other Decks in Technology
See All in Technology
ゼロから創る横断SREチーム 挑戦と進化の軌跡
rvirus0817
3
280
2024年にチャレンジしたことを振り返るぞ
mitchan
0
150
Work as an App Engineer
lycorp_recruit_jp
0
360
JVM(JavaVM)の性能分析者観点で探るInstanaの可能性
instanautsjp
0
120
How to be an AWS Community Builder | 君もAWS Community Builderになろう!〜2024 冬 CB募集直前対策編?!〜
coosuke
PRO
2
2.9k
マイクロサービスにおける容易なトランザクション管理に向けて
scalar
0
190
終了の危機にあった15年続くWebサービスを全力で存続させる - phpcon2024
yositosi
27
23k
いまからでも遅くないコンテナ座学
nomu
0
130
DUSt3R, MASt3R, MASt3R-SfM にみる3D基盤モデル
spatial_ai_network
2
260
サイボウズフロントエンドエキスパートチームについて / FrontendExpert Team
cybozuinsideout
PRO
5
38k
Google Cloud で始める Cloud Run 〜AWSとの比較と実例デモで解説〜
risatube
PRO
0
120
React Routerで実現する型安全なSPAルーティング
sansantech
PRO
2
280
Featured
See All Featured
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Imperfection Machines: The Place of Print at Facebook
scottboms
266
13k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Docker and Python
trallard
42
3.1k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
2
290
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
3
170
What’s in a name? Adding method to the madness
productmarketing
PRO
22
3.2k
Adopting Sorbet at Scale
ufuk
73
9.1k
Typedesign – Prime Four
hannesfritz
40
2.4k
Thoughts on Productivity
jonyablonski
68
4.4k
Faster Mobile Websites
deanohume
305
30k
Keith and Marios Guide to Fast Websites
keithpitt
410
22k
Transcript
Google I/O 2023 Debugging Jetpack Compose について 宮﨑 瞬
本発表について 本発表は以下のセッション内容から、 個人的に気になった点をまとめたものです。 Debugging Jetpack Compose - Youtube h6ps://youtu.be/Kp-aiSU8qCU
セッション内容 Jetpack Composeの開発で、遭遇する問題の解決方法について、 解説してくれている。 Common Issues(⭐が本発表で話すところ) ・ Why is this
composable recomposing? ⭐ ・Problem: Frequent Recomposition ・How do I know what's wrong with my UI on different form factors? ・Why am I seeing Jank? ・Where should I focus on optimising?
Why is this composable recomposing? なぜ、このcomposableで、recomposeが実⾏されるのか?
Recomposeには3種類ある 1.Direct recomposition 変更された変数を参照しているComposeの、Recomposeが⾛る 2.Indirect recomposition 変更された変数を直接参照していないが、 変更された変数を、計算に使⽤している変数を参照しているComposableのRecomposeが⾛る 3.Unskippable recomposition
変更されていないが、 Unstableで、immutable(不変)であることを担保できないため、Recomposeが⾛る
Direct recomposition countが変更されると、TextのRecomposeが⾛る Debugging Jetpack Compose - Youtube https://youtu.be/Kp-aiSU8qCU
Indirect recomposition countが変更されると、 doubledが変更されて、MyTextのRecomposeが⾛る Debugging Jetpack Compose - Youtube h6ps://youtu.be/Kp-aiSU8qCU
Unskippable recomposition countが変更されると、listは値が変わっていないが、 Unstableなので、MyListのRecomposeが⾛る Debugging Jetpack Compose - Youtube h6ps://youtu.be/Kp-aiSU8qCU
Recomposeが 実⾏された理由をどうやって 確かめるか?
Compose state information in debugger Android Studio Hedgehogから、 Compose state
information in debuggerが使える h<ps://developer.android.com/studio/preview/features#compose- state-in-debugger Debugging Jetpack Compose - Youtube https://youtu.be/Kp-aiSU8qCU 検査したいところに、 breakpointを設置して、debugする。 Debuggerで、Recompositon Stateを見ることができる。
Debuggerで検証できるもの Changed State ・Unchanged - 変数は変更されていない ・Changed - 変数は変更された ・Uncertain
- 変数が変更されたかどうか、まだ評価中 ・Static - 変数は絶対に変更されない ・Unstable - 変数はunstable type(不変性が担保できない)
使⽤例1 isFollewedが変更されたので、Recomposeが実⾏ Debugging Jetpack Compose - Youtube https://youtu.be/Kp-aiSU8qCU
使⽤例2 podcastsがUnstableなので、Recomposeが実⾏ Debugging Jetpack Compose - Youtube h6ps://youtu.be/Kp-aiSU8qCU
まとめ ・Recomposeには3種類ある ・Android Studio Hedgehogで追加された、Compose state information in debuggerで、Recomposeの原因を検証できる