Jetpack Compose Performance
Android (Google)OfficialCreated by Google LLCDistributed by Android (Google)
- Skill
- Review and audit
- Software development
- Apache-2.0
- No issues found
AutoGineer summary
Written by AutoGineer from the skill’s own files, not by the author
This skill provides a structured audit workflow for identifying and resolving performance issues in Jetpack Compose applications. It covers state management, layout measurement, lazy container optimization, animation, threading, and custom drawing. The guidelines emphasize phase deferral, proper use of state derivation, and efficient modifier implementation to prevent unnecessary recomposition and rendering overhead.
What it does
- Provides an audit checklist for identifying performance bottlenecks in Compose UI code.
- Explains how to defer state reads to Layout or Draw phases to minimize recomposition.
- Offers patterns for optimizing lazy layouts using keys, content types, and efficient state queries.
- Details how to migrate legacy modifiers to the Modifier.Node API for improved efficiency.
- Defines rules for managing side effects, lifecycle-aware flow collection, and threading.
- Outlines best practices for graphics caching and custom drawing performance.
When to use it
- When analyzing UI performance issues such as dropped frames or layout lag.
- When refactoring complex composables to reduce recomposition overhead.
- When optimizing data models and state handling for large lazy lists.
- When implementing custom modifiers or complex drawing operations.
Advantages
- Reduces redundant recomposition passes through phase deferral techniques.
- Provides clear guidance on avoiding backwards writes and infinite recomposition loops.
- Standardizes the implementation of custom modifiers using modern Modifier.Node APIs.
- Helps maintain UI stability and rendering performance in complex Android applications.
Usage examples
- “How can I optimize a frequently recomposing composable that reads state?”
- The agent will guide you to wrap state reads in lambdas or use Modifier.graphicsLayer to defer reads to the Layout or Draw phases, bypassing unnecessary composition.
- “How should I handle state in a LazyColumn to avoid performance issues?”
- The agent will advise on using primitive keys and content types, hoisting state queries, and avoiding O(N) lookups to ensure efficient scrolling and item reuse.
Install
Download the skill as a ZIP:
https://mp-staging.autogineer.com/agent-skills/android/jetpack-compose-performance/downloadUnzip it into the cross-client skills folder of your project:
mkdir -p .agents/skills && unzip jetpack-compose-performance.zip -d .agents/skills
Documentation by Google LLC
Foundational prerequisites
Before micro-optimizing composables, ensure standard production flags are in place:
Release Build: Never profile or benchmark debuggable builds; ART runtime verification severely degrades performance.
R8 Minification: Keep R8 enabled to optimize bytecode and coroutine dispatch.
Baseline Profiles: Generate baseline profiles for critical user journeys (cold start, key scrolling feeds) so the ART VM pre-compiles and preloads classes ahead of time.
Optimization audit workflow
Exhaustive Scan : Scan the target code against all 7 core categories in the following sections. Evaluate every
@Composablefunction, modifier chain, and lazy-layout data model against all checklist rules rather than stopping after the first issue found.Mandatory Reference Read Before Flagging or Editing : Whenever a file matches a rule in Categories 1--7, you MUST open and read the corresponding
references/*.mdfile for the approved fix pattern and full scope guards before reporting a finding or editing code. Never rely on the summary bullets alone to write fixes.
1. State, snapshots, and stability (references/state-and-stability.md)
MANDATORY : Before flagging or fixing any issue in this category, you MUST read references/state-and-stability.md.
Phase Deferral (Lambdas) : Wrap frequently changing state reads in lambdas (such as
Modifier.offsetorModifier.graphicsLayer) so reads occur in Layout or Draw phase rather than Composition.Prohibit Backwards Writes (Verify Read-Before-Write Order) : Never modify state in a later phase or after it has already been read in the same composition pass (
Read -> Write, orComposition Read -> Layout or Draw Write). Prevent backwards writes across phases to avoid first-frame popping, jank, and infinite recomposition loops (Backwards Write). Do not flag a state assignment at the start of a composable (Write -> ReadorComposition Write -> Draw Read) as a backwards write---a backwards write strictly requires a read of that state to precede the write.Avoid Redundant State Wrapping in Composition (
Write -> Read) : Do not wrap synchronous values inremember { mutableStateOf(...) }only to overwrite them immediately at the top of composition before reading them (for example,var path by remember { mutableStateOf(Path()) }; path = viewModel.getPath()). While not a backwards write, this adds unnecessary slot table andMutableStatesnapshot overhead (and risks becoming a backwards write if a read is later added preceding the assignment); use a plain localvalor read the value directly inside the target phase (such asModifier.drawWithCache).Explicit
rememberKeys & Slot Overhead : Always pass all input variables and composable parameters referenced insiderememberas calculation keys. Remember thatrememberstoreskeys + 1objects in the slot table and checks key equality on every recomposition; onlyrememberwhen allocations are heavy or identity must be preserved. Do not pass snapshot state values/properties (e.g.state.value) as keys when wrappingderivedStateOf(passing theStateinstance itself is fine if the instance reference can change).computedStateOfvsderivedStateOf(Compose 1.13+) : On Compose 1.13+, usecomputedStateOffor simple condition checks and filtered state from fast-changing inputs (such asscrollState.value > 0), which provides significantly faster invalidation thanderivedStateOf(on Compose< 1.13, useremember { derivedStateOf { ... } }). ReservederivedStateOffor heavy calculations that benefit from multi-read caching, or trivial calculations read frequently enough per composition (roughly10 / numberOfStatesReadPerCalculationtimes without invalidating between reads) to make up for the invalidation cost.Synchronous State Derivation : Audit for asynchronous
produceState+snapshotFlowblocks observing Compose states (such as scroll positions or collection sizes); replace them with synchronousremember { derivedStateOf { ... } }(orcomputedStateOfon Compose 1.13+).Trivial Primitives : Prefer plain custom Kotlin getters (
get()) overderivedStateOforcomputedStateOffor simple boolean expressions and property lookups.Collection State Tracking : Back whole-list updates with standard
mutableListOf()andmutableStateOf(list, neverEqualPolicy())with load-bearing assignments instead ofmutableStateListOf().Snapshot Collections : Use
SnapshotStateList.toList()for repeated queries or iterations to avoid per-element read observation overhead.Repeated State Reads : Extract repeated Compose
Stateproperty reads into a local variable at the top of the block.State in Setters : Avoid reading Compose
Stateinside custom property setters; use a raw backing field when triggering change side-effects and batch multi-property updates.Stability & Skipping Trade-Offs (Skipping Isn't Free) : Do not fixate on stability or treat
@Immutable,@Stable, orImmutableListas default solutions. Skipping a composable is not free: each parameter is stored in the slot table as if remembered, and all inputs must be compared on recomposition. Strong Skipping Mode already skips composables with unstable parameters (including standardkotlin.collections.List) when instance equality (===) matches. Annotating models or usingImmutableListforces structural equality (.equals()), which can be significantly more expensive than recomposition itself for large collections or complex classes.Never Add
@Stable,@Immutable, orImmutableListto Collection Models : When writing or optimizing code, never add@Immutableor@Stableto models containing collections (List,Set,Map), and never recommend replacingkotlin.collections.List<T>withImmutableList<T>(or addingImmutableListtostability_config.txt). CallingO(N).equals()on collections on every recomposition pass is more expensive thanO(1)instance equality (===) under Strong Skipping Mode.Scope Guard for Removing Existing
@Stable/@ImmutableAnnotations (Large Lazy Datasets Only) :When to Remove : Only recommend removing existing
@Stableor@Immutableannotations from data models when both conditions are met: (1) the model is used within a lazy layout (LazyColumn,LazyRow,LazyGrid,Pager,ScalingLazyColumn) as the input feed or item model, and (2) it contains a large dataset or deep nested collection hierarchy (e.g., feed streams, large lists of tags/items, or multi-level nested lists likePostwithList<Paragraph>andList<Markup>), where recursiveO(N).equals()checks degrade scrolling and recomposition performance.When to Leave Untouched : For all other existing
@Stable,@Immutable, orImmutableListusages in a codebase---such as non-lazy UI models, standalone components, or models with small/bounded collections (e.g., a card with a few badges, thumbnails, or metadata rows) where dataset size is small or unknown---leave the existing annotations untouched and do not flag them . Never blindly grep and flag all@Stable/@Immutableclasses across a codebase without verifying they feed a lazy layout with a large dataset.
When to Add
@Stable/@ImmutableUnder Strong Skipping Mode : Flatdata classes withvalprimitive/Stringproperties in Compose modules are already inferred as stable by the compiler and use.equals()automatically---do not add redundant@Immutableannotations to them. Only add@Stableor@Immutablewhen the compiler cannot infer stability (e.g. classes from non-Compose modules or interfaces) and a data source (such as Room or MVI reducers) allocates new object instances for unchanged items on every emission, provided the class is small, flat, has no collections (List,Set,Map), and its.equals()check is trivialO(1).Make Composables Cheaper Instead of Forcing Skipping: Do not overindex on recomposition counts. Skipping one composable during an active recomposition pass saves little time once composition is scheduled (scheduling and starting the recomposition pass is the bulk of the cost). Focus on making composables cheap to execute, deferring state reads to Layout/Draw, and verifying with benchmarks rather than assuming skipping improves performance.
2. Layouts and measurement optimization (references/layouts.md)
MANDATORY : Before flagging or fixing any issue in this category, you MUST read references/layouts.md.
Coordinates & Placement : Avoid
onGloballyPositioned; useModifier.onVisibilityChangedfor viewport tracking,Modifier.onPlacedorModifier.onLayoutRectChangedfor local bounds, and queryrequireLayoutCoordinates()on demand insideModifier.Nodeevent handlers.Anchor Floating Content via Custom
Layout: When attaching floating labels or tooltips to a component, use a customLayoutmeasuring and placing both children relative to each other. Never trackonGloballyPositionedcoordinates inMutableStateto position floating content withoffset, which causes a 1-frame lag and schedules a second composition pass.Phase Deferral for Offsets : Wrap dynamic offsets in lambdas (
Modifier.offset { IntOffset(...) }) to skip Composition straight to Layout.Tree Depth & Decorative Wrappers : Avoid redundant wrapper
Boxes and decorativeCanvasnodes; attach modifiers directly or useModifier.drawBehind.Subcomposition Overhead : Avoid
BoxWithConstraints/SubcomposeLayoutinside hot paths and lazy items; prefer standard modifiers,Modifier.layout, orLayoutModifierNode.Intrinsic Measurements: Use intrinsic measurements judiciously and avoid deeply nested intrinsic chains.
3. Lazy layouts optimization (references/lazy-layouts.md)
MANDATORY : Before flagging or fixing any issue in this category, you MUST read references/lazy-layouts.md.
Lazy Layout Scope Guard : Directives for
keyandcontentTypeapply strictly to Lazy containers (LazyColumn,LazyRow,LazyGrid). Never flag standard non-lazy containers (Column,Row,Box) iterating over collections.Mandatory
contentTypeand Primitivekey: Always specify both primitivekeys (Int,Long,String) andcontentTypes for all items in lazy layouts (LazyColumn,LazyRow,LazyGrid). When usingitemsoritemsIndexed, never omitcontentType:contentType = { _, item -> item.type }. OmittingcontentTypeprevents Compose from reusing composition slots during scrolling.In-Item Index Lookups : Replace
list.indexOf(item)withitemsIndexedto eliminateO(N²)lookups during layout passes.Observable Selection & State Queries : Convert selection tracking from
mutableStateListOfto an immutableSetinMutableState(mutableStateOf(emptySet<String>())),mutableStateSetOf(), or Map forO(1)lookups. Pass lambda providers (isSelected: () -> Boolean) to leaf composables to isolate recomposition from parentitemsscopes.Propagate CompositionLocals in Lazy Items : Avoid querying
CompositionLocals (LocalContext.current,LocalDensity.current,LocalSharedTransitionScope.current, scopes, etc.) inside individual lazy item composables; resolve them once in the parent container or screen and propagate the resolved values down as parameters.Defer Shared Transitions in Lazy Items : Put
Modifier.sharedBoundsorModifier.sharedElementon lazy items behind visibility indicators (such asModifier.onVisibilityChangedor viewport visibility checks) so offscreen or pre-fetched items do not instantiate transition scopes.Item Count Derivations : Read collection
.sizedirectly instead of wrapping list counts inderivedStateOf.Small & Bounded Lists : Use standard
RoworColumnwithfororforEachloops for small or bounded collections (e.g. 1 to 10 items) to eliminate lazy virtualization, measuring, and pre-fetching overhead.Hoist Shared Flows : Collect shared
Flows once in the parent container preceding lazy layouts; never callcollectAsStateWithLifecycle()per visible item.Avoid Side Effects in Pre-Fetched Items : Never trigger analytics in
LaunchedEffect(Unit)inside lazy items; useModifier.onVisibilityChangedwith dwell thresholds instead.
4. Animation and shared transitions (references/animation.md)
MANDATORY : Before flagging or fixing any issue in this category, you MUST read references/animation.md.
Phase Deferral for Animated Properties : Wrap fast-changing animated state reads (alpha, scale, rotation, color) in
Modifier.graphicsLayer { ... }to bypass Composition and evaluate directly in the Draw phase.Phase Deferral for Offsets & Size : Wrap animated offsets in
Modifier.offset { IntOffset(...) }and animate constraints usingModifier.layout { ... }orModifier.animateBoundsto bypass recomposition during size transitions.Defer Shared Transitions in Fast-Scrolling Lists : Attach
Modifier.sharedBoundsorModifier.sharedElementonly when visible usingModifier.onVisibilityChangedto avoid modifier and observation instantiation costs on discarded pre-fetched items.Lambda Providers : Pass lambda providers (
() -> Float) instead of raw animated values to child composables to keep state reads deferred to Draw or Layout.Persistent
Animatablein Nodes : StoreAnimatableas a persistent member property onModifier.Nodeand launch inonAttach()usingcoroutineScope.launch.
5. Effects, lifecycle, and threading (effects-and-threading.md)
MANDATORY : Before flagging or fixing any issue in this category, you MUST read references/effects-and-threading.md.
Prohibit Direct Side-Effects in Body : Never perform side-effects directly in the Composable body during composition; wrap them in
SideEffect,LaunchedEffect, or user event callbacks.Prohibit Non-Suspending
LaunchedEffect& EmptyDisposableEffect: Never useLaunchedEffectfor synchronous operations (e.g. logging views or updating objects). Never useDisposableEffectwith an emptyonDispose {}block as a workaround. UseSideEffectinstead (in Compose 1.12+,SideEffect(keys) { ... }supports keys directly; on Compose< 1.12,SideEffecttakes no arguments, so check the project's Compose version and track key changes with aremembered holder insideSideEffect { ... }).Cache Allocations in Body : Wrap heavy object allocations (such as date formatters or complex paths) and expensive computations in
remember.Combine Related
LaunchedEffects : Combine multipleLaunchedEffect(Unit)calls into a singleLaunchedEffectwith nestedlaunch { ... }blocks to reduce effect node allocations and coroutine launcher overhead.Effect Ordering & Teardown Costs : Understand effect execution order when composition changes are applied (
DisposableEffectruns first, thenSideEffect, whileLaunchedEffectlaunches a coroutine on the composition'sCoroutineContextthat is dispatched asynchronously and is not guaranteed to wait until after Draw). Note that canceling aLaunchedEffectincurs coroutine cancellation and teardown overhead; avoid cyclingLaunchedEffectkeys frequently during animations or scrolling.Main Thread Offloading : Offload blocking I/O, heavy file parsing, and database operations to
withContext(Dispatchers.IO)usingproduceState.No Item-Level Impression Effects in Lazy Layouts : Never use
LaunchedEffectorDisposableEffectinside lazy items for impression logging. Lazy items are pre-composed before entering the viewport, causing premature or false impressions. UseModifier.onVisibilityChangedwith dwell thresholds instead.Lifecycle-Aware Flow Collection : Use
collectAsStateWithLifecycle()for UI Flow collections that actively produce background work on Android, andcollectAsState()for lightweight in-memory StateFlows or non-Android scopes.Hoist Receivers & Listeners : Register system listeners and
BroadcastReceivers once at the screen level usingDisposableEffect, not inside lazy list items.Guard Optional Effects : Guard effects with
if (callback != null)before launching to prevent allocating empty coroutines and effect nodes.Prevent Stale Captures : Use
rememberUpdatedStatewhen long-running or looping coroutines inLaunchedEffectreference callbacks or parameters.Replace Legacy Timers : Replace
Handler.postDelayedorTimerTaskwithLaunchedEffectanddelay().
6. Graphics and custom drawing (references/graphics-performance.md)
MANDATORY : Before flagging or fixing any issue in this category, you MUST read references/graphics-performance.md.
Cache Drawing Allocations : Replace decorative
Canvasnodes withModifier.drawWithCacheto cachePath,Paint, andBrushallocations.Prefer AsyncImage instead of Image : Use Coil's
AsyncImagefor loading images from the internet andpainterResourcefor drawables.Imageis not optimized for caching and loading images and may cause performance issues.Scope Fast-Changing Uniforms :
remembertheRuntimeShaderandShaderBrushin composition, update size uniforms indrawWithCache, and per-frame uniforms inonDrawBehind.Graphics Path Object Reuse : Prefer
Path.rewind()overreset()in hot draw loops to retain allocated buffers without reallocation.Value Classes & Primitive Collections : Avoid generic tuples (
Pair,Triple) and generic sets (HashSet<Long>); useandroidx.collection.MutableLongSetandandroidx.compose.ui.util.packInts.
7. Custom modifiers: Modifier.Node (Custom modifiers guide)
Modifier.Node Migration : Migrate legacy
Modifier.composedtoModifierNodeElement+Modifier.Node(orDelegatingNodewhen delegating to sub-nodes such asSuspendingPointerInputModifierNode) with capability interfaces (DrawModifierNode,LayoutModifierNode,SemanticsModifierNode,CompositionLocalConsumerModifierNodeusingcurrentValueOf(...)) to eliminate per-node subcomposition overhead and enable node reuse (see Create custom modifiers with Modifier.Node):// Modifier factory fun Modifier.circle(color: Color) = this then CircleElement(color) // ModifierNodeElement private data class CircleElement( val color: Color ) : ModifierNodeElement<CircleNode>() { override fun create() = CircleNode(color) override fun update(node: CircleNode) { node.color = color } } // Modifier.Node private class CircleNode( var color: Color ) : DrawModifierNode, Modifier.Node() { override fun ContentDrawScope.draw() { drawCircle(color) } }<br />
On-Demand Coordinates : Query
requireLayoutCoordinates()on demand inside pointer or draw handlers inModifier.Noderather than implementingGlobalPositionAwareModifierNode.onGloballyPositioned.
IMPORTANT : For more examples on how to migrate common modifiers to Modifier.Node, you must read Create custom modifiers with Modifier.Node.
Files
- ATTRIBUTION.mdAdded by AutoGineer1010 B
- LICENSELicence file added by AutoGineer11.1 KiB
- SKILL.md20.5 KiB
- references/android/develop/ui/compose/custom-modifiers.md26.7 KiB
- references/android/develop/ui/compose/performance/backwards-write.md12.0 KiB
- references/android/develop/ui/compose/performance/stability/strongskipping.md6.6 KiB
- references/animation.md8.0 KiB
- references/effects-and-threading.md17.3 KiB
- references/graphics-performance.md9.4 KiB
- references/layouts.md8.8 KiB
- references/lazy-layouts.md12.5 KiB
- references/state-and-stability.md27.5 KiB
references/lazy-layouts.md
1. Lazy layout directives
Implement strict item keying, content-type mapping, and index-lookup optimizations to prevent unnecessary item recompositions, layout passes, and dropped frames during scrolling.
Scope Guard (Virtualized Containers Only) : The directives in this section apply strictly to lazy, virtualized layouts (
LazyColumn,LazyRow,LazyVerticalGrid,LazyHorizontalGrid,HorizontalPager,VerticalPager). Standard non-virtualized containers (Column,Row,Box) iterating over collections using standard KotlinfororforEachloops are not lazy layouts. Do not flag standardColumn/Rowloops for missingkeyorcontentTypeparameters.
1. Require keys and content types
Always provide a stable key and a contentType for all items.
key: Enables Compose to maintain item state across reorderings and list updates without recreating item compositions from scratch.contentType: Enables Compose to reuse item compositions and node slots when recycling items of the same visual type, significantly reducing layout inflation overhead during fast scrolling.
LazyColumn {
items(
items = itemList,
key = { item -> item.id },
contentType = { item -> item.type }
) { item ->
ItemRow(item = item)
}
}<br />
Ensure Keys are Bundle-Saveable : Keys must be saveable in an Android
BundlebecauseLazyColumnusesrememberSaveableinternally to persist scroll states and item state across configuration changes and process death.Do NOT use custom data classes as keys unless they implement
ParcelableorSerializable.Do use unique primitive types (like
IntorLong). If needed, combine fields into a unique string:key = { "${it.id}_${it.timestamp}" }. PreferIntandLongoverStringfor minimal memory and hashing overhead.
Avoid Duplicate and Unstable Keys : Ensure keys are globally unique and deterministic. Never use
hashCode()or list indexes as keys, as they change when items are reordered, inserted, or filtered.
2. Avoid in-item collection searches and observable state queries
Do not perform collection searches, linear index scans, or observable state queries inside item layout blocks or outer list item scopes:
Linear Index Scans (
indexOf,find) : Searching the list for an item's index inside the layout block (for example,list.indexOf(item)) turns a linear layout pass into anO(N²)operation and causesIndexOutOfBoundsExceptionduring asynchronous mutations. UseitemsIndexedinstead.Bad (
O(N²)linear scan per item):LazyColumn { items(items = itemList, key = { it.id }) { item -> // O(N) lookup inside each item! val index = itemList.indexOf(item) ItemRow(index = index, item = item) } }<br />
Optimized (Direct index passing with
itemsIndexed):LazyColumn { itemsIndexed( items = itemList, key = { _, item -> item.id }, ) { index, item -> ItemRow(index = index, item = item) } }<br />
Observable Selection & State Queries : Never use
mutableStateListOf(SnapshotStateList) for tracking selected IDs where.contains()and.remove()performO(N)linear scans; use an immutableSetinMutableState(mutableStateOf(emptySet<String>())) ormutableStateSetOf(SnapshotStateSetin Compose 1.8+) forO(1)lookups. Also, reading an observable collection state (likeselectedIds.contains(item.id)) inside the outeritems(...) { ... }block subscribes the entire list or section to changes in that collection. Toggling a single item invalidates the parent scope and forces a full recomposition of all visible items. Defer the state read to the leaf item composable by passing a lambda provider (isSelected: () -> Boolean).Bad (
mutableStateListOfO(N)lookups and reading state in outeritemsscope triggers full list or grid recomposition on toggle):@Composable fun TopicGrid(sections: List<TopicSection>) { val selectedTopicIds = remember { mutableStateListOf<String>() } LazyColumn { items(sections, key = { it.id }) { section -> Column { Text(text = section.title) section.topics.forEach { topic -> // Avoid: O(N) List.contains() read in items() scope // invalidates the whole section! val isSelected = selectedTopicIds.contains(topic.id) TopicChip( topic = topic, isSelected = isSelected, onToggle = { if (isSelected) { selectedTopicIds.remove(topic.id) } else { selectedTopicIds.add(topic.id) } } ) } } } } }<br />
Optimized (Use
Set<String>(mutableStateOf(emptySet())ormutableStateSetOf()) forO(1)lookup and pass lambda to leaf composable to isolate recomposition to the clicked item):@Composable fun TopicGrid(sections: List<TopicSection>) { var selectedTopicIds by remember { mutableStateOf(emptySet<String>()) } LazyColumn { items( items = sections, key = { it.id }, contentType = { "section" }, ) { section -> Column { Text(text = section.title) section.topics.forEach { topic -> TopicChip( topic = topic, // O(1) Set read deferred to TopicChip's scope isSelectedProvider = { selectedTopicIds.contains(topic.id) }, onToggle = { val selected = selectedTopicIds.contains(topic.id) selectedTopicIds = if (selected) { selectedTopicIds - topic.id } else { selectedTopicIds + topic.id } } ) } } } } } @Composable fun TopicChip( topic: Topic, isSelectedProvider: () -> Boolean, onToggle: () -> Unit ) { // Read occurs inside leaf scope val isSelected = isSelectedProvider() val status = if (isSelected) "Selected" else "Unselected" Box(modifier = Modifier.clickable { onToggle() }) { Text(text = "${topic.title} ($status)") } }<br />
3. Avoid derivedStateOf for direct collection sizes and counts
Do not wrap direct collection property accesses (such as list.size or
list.isEmpty()) in derivedStateOf. Accessing a property on an already
available list or snapshot collection is an O(1) read. Wrapping it in
derivedStateOf allocates a DerivedState wrapper object, snapshot record
tracking structures, and observer subscriptions that cost far more than reading
the integer property directly.
4. Avoid lazy layouts for small or bounded collections
Tip: For small static or bounded dynamic collections (e.g. 1 to 10 items
such as tags, buttons, form rows, or chips), prefer using a standard Row or
Column with a for or forEach loop instead of LazyRow or LazyColumn.
For small collections, composing all items eagerly reduces layout, prefetching,
and measurement overhead compared to lazy list virtualization machinery.
Benchmark this change before applying broad changes to code.
Bad (Lazy virtualization overhead for tiny static list):
LazyRow { items(items = listOf("Work", "Personal", "Family")) { tag -> FilterChip(tag = tag) } }<br />
Optimized (Standard Row with forEach):
Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) { listOf("Work", "Personal", "Family").forEach { tag -> FilterChip(tag = tag) } }<br />
5. Hoist shared Flow and state collections out of lazy items
Critical: Never collect a shared Flow, StateFlow, or observable timer
directly inside list item composables using collectAsState() or
collectAsStateWithLifecycle().
When a shared flow is collected inside item composables, every visible item in
the LazyColumn or LazyRow creates an independent subscription to that same
flow. When the flow emits an update (such as an idle timer tick or periodic
sync), it invalidates and recomposes all visible items simultaneously, creating
massive CPU spikes and dropped frames during scrolling.
Instead, hoist the flow collection once to the parent container above the
LazyColumn, derive the required state, and pass stable or primitive values
down to the individual item composables.
Bad (Each visible item creates an independent subscription to the shared timer):
@Composable fun FeedItem(item: Post) { // Avoid: Multiplied subscriptions across all visible items! val secondsSinceLastScroll by MainFeedIdleTracker .secondsSinceLastScrollFlow .collectAsState(0L) val isDwellTriggered = secondsSinceLastScroll >= 5L PostActions(isDwellTriggered = isDwellTriggered) } @Composable fun FeedList(posts: List<Post>) { LazyColumn { items(posts, key = { it.id }) { post -> FeedItem(post) } } }<br />
Optimized (Hoist subscription once above LazyColumn, pass stable value down):
@Composable fun FeedList(posts: List<Post>) { // Hoist once: Parent owns the single subscription val secondsSinceLastScroll by MainFeedIdleTracker .secondsSinceLastScrollFlow .collectAsStateWithLifecycle(0L) val isDwellTriggered = secondsSinceLastScroll >= 5L LazyColumn { items(posts, key = { it.id }) { post -> FeedItem(post = post, isDwellTriggered = isDwellTriggered) } } } @Composable fun FeedItem(post: Post, isDwellTriggered: Boolean) { PostActions(isDwellTriggered = isDwellTriggered) }<br />
6. Propagate CompositionLocals down instead of reading in lazy items
Avoid querying CompositionLocals (such as LocalContext.current or
LocalDensity.current) directly inside individual lazy item composables.
Querying a CompositionLocal inside every item adds repetitive map lookup
overhead during item composition and subscribes each individual item to the
CompositionLocal's updates. Instead, read the CompositionLocal once in the
parent screen or list container and pass the resolved values down as
parameters.
Bad (Querying scopes and context per item):
@Composable fun SnackItem(snack: Snack) { val sharedScope = LocalSharedTransitionScope.current ?: error("No scope") val context = LocalContext.current // ... }<br />
Optimized (Pass resolved dependencies down as parameters):
@Composable fun SnackList( snacks: List<Snack>, sharedScope: SharedTransitionScope, ) { val context = LocalContext.current LazyColumn { items(snacks, key = { it.id }, contentType = { "snack" }) { snack -> SnackItem( snack = snack, sharedScope = sharedScope, context = context, ) } } }<br />
7. Defer shared transitions behind visibility indicators
Attaching Modifier.sharedBounds or Modifier.sharedElement to every item in
a lazy layout adds significant modifier allocation, shared state tracking, and
snapshot record instantiation overhead---even for offscreen or pre-fetched items
that are not visible.
In fast-scrolling or large lazy lists, gate shared transitions behind
visibility indicators (such as Modifier.onVisibilityChanged or viewport
visibility checks) so only rendered, visible items instantiate transition
scopes and coordinate tracking.
Requirements and compatibility
Works with: Claude Code, Claude apps, OpenAI Codex, GitHub Copilot, Cursor, Gemini CLI, Kiro, OpenCode, Goose, Amp, Roo Code, JetBrains Junie, Factory Droid, Devin (ex-Windsurf), Mistral Vibe, OpenHands, Letta
“Works with” means the tool reads the open Agent Skills format; a skill written for one tool may use features others lack.
Needs: Needs Node.js
Security
No issues found by our static scan· No issues found
A static scan is not a guarantee. Skills are third-party content: review a skill before you let an agent use it.
Attribution and licence
- Created by
- Google LLC
- Publisher
- Android (Google) (Official)
- Distributed by
- Android (Google)
- Source
- android/skills · jetpack-compose/jetpack-compose-performance · commit bf68e2d
- Licence
- Apache License 2.0 (redistribution allowed)
- LICENSE (added by AutoGineer from LICENSE.txt)
- ATTRIBUTION.md (written by AutoGineer)
- Synced
AutoGineer is not affiliated with or endorsed by Google LLC or Android (Google).
Download ZIP
The ZIP holds the skill’s files, its licence files and an ATTRIBUTION.md. Download jetpack-compose-performance.zip