Agent Skillschrisbanes/skills › compose-state-and-effects

compose-state-and-effects

GitHub

指导Jetpack Compose中状态所有权分配与副作用生命周期管理,涵盖状态提升、Effect选择及屏幕边界划分,确保UI可预览和测试。

skills/compose-state-and-effects/SKILL.md chrisbanes/skills

触发场景

审查Compose状态所有权 编写或优化LaunchedEffect/DisposableEffect等副作用逻辑 处理状态提升与Screen State Holder设计

安装

npx skills add chrisbanes/skills --skill compose-state-and-effects -g -y
更多选项

不安装直接使用

npx skills use chrisbanes/skills@compose-state-and-effects

指定 Agent (Claude Code)

npx skills add chrisbanes/skills --skill compose-state-and-effects -a claude-code -g -y

安装 repo 全部 skill

npx skills add chrisbanes/skills --all -g -y

预览 repo 内 skill

npx skills add chrisbanes/skills --list

SKILL.md

Frontmatter
{
    "name": "compose-state-and-effects",
    "description": "Use when writing or reviewing Jetpack Compose state ownership, remember state, state hoisting, screen state holders, LaunchedEffect, DisposableEffect, SideEffect, Flow collection, navigation, snackbar, analytics, or focus requests."
}

Compose state and effects

Core principle

Give every piece of UI state one lowest responsible owner, then run imperative work through the effect whose lifecycle follows that owner. Composition renders; state and effects make rendering change safely.

Procedure

  1. Establish the requested scope and visible behavioral requirements. Treat an ownership change as a finding only when code or task evidence shows a lifecycle, testability, business, or coordination need.
  2. Inventory mutable UI state, app state, event streams, app dependencies, and imperative work in the affected screen or component.
  3. Place each state value at its lowest necessary owner: local UI state, hoisted state, a plain UI state holder, or a screen state holder.
  4. Keep app wiring and business state at the screen boundary. When a screen holder owns Compose runtime objects, explicitly recommend a separate, previewable content composable that takes immutable state and event callbacks; keep runtime objects in composition or a plain UI state holder. Merely recommending immutable state and intents does not establish that rendering boundary.
  5. Choose an effect API whose lifecycle matches the work, and key it by the semantic input that should restart or dispose it.
  6. Load the focused reference for every material concern below. Do not use a reference merely because its topic is adjacent.
  7. Route frame-rate reads, cross-phase back-writing, and @ReadOnlyComposable contracts to Compose performance.
  8. Before responding to a screen-ownership review, verify that the answer explicitly names all three required seams when the visible code needs them: durable data and intents at the screen boundary, runtime UI objects in composition or a plain UI state holder, and a previewable content composable whose inputs are immutable state and event callbacks.
  9. Finish when every state value has one owner, every effect has a justified lifecycle and key, and the UI can be previewed and tested without app dependencies. For review-only work, report no change when no evidence-backed issue remains; do not invent product requirements.

Topic router

Signal Read
Bare local var, remember { mutableStateOf(...) }, state lists/maps, or reset state Local state
State shared by siblings, UI state holders, ViewModel/component wiring, or previewable screen boundaries State hoisting
LaunchedEffect, DisposableEffect, SideEffect, snapshotFlow, rememberCoroutineScope, rememberUpdatedState, produceState, imperative requestFocus, callbacks, event Flow collection, snackbar, navigation, or analytics Side effects
Focus ownership and keyboard/TV/D-pad behavior Compose focus navigation
Tests or previews for the resulting UI contract Compose UI testing patterns

RED/GREEN agent scenarios

  1. RED keeps a component, collected StateFlow, navigation event, and screen layout in one composable. GREEN leaves wiring and effects at the screen boundary and gives plain rendering immutable state plus callbacks.
  2. Novel case: a query drives repository suggestions while a list state and focus requester coordinate UI behavior. GREEN puts query and suggestions in the screen state holder, but keeps Compose runtime objects in plain UI state.
  3. Counterexample: a one-off expandable badge has one private Boolean. GREEN keeps it local and does not introduce a state holder or an effect.
  4. Counterexample: an accessor reads shared snapshot state with no requirement for per-instance independence. GREEN does not invent an ownership leak.

版本历史

  • 2026.8.16 当前 2026-08-19 19:31

    新增步骤1以明确需求范围;细化步骤4关于屏幕边界与可预览Composable的规范;更新步骤8增加对三个必要接口的验证要求。

  • 2026.8.5 2026-08-16 02:44

同 Skill 集合

skills/compose-animations/SKILL.md
skills/compose-component-design/SKILL.md
skills/compose-focus-navigation/SKILL.md
skills/compose-modifier-and-layout-style/SKILL.md
skills/compose-performance/SKILL.md
skills/compose-recomposition-performance/SKILL.md
skills/compose-side-effects/SKILL.md
skills/compose-slot-api-pattern/SKILL.md
skills/compose-stability-diagnostics/SKILL.md
skills/compose-state-authoring/SKILL.md
skills/compose-state-deferred-reads/SKILL.md
skills/compose-state-hoisting/SKILL.md
skills/compose-state-holder-ui-split/SKILL.md
skills/compose-ui-testing-patterns/SKILL.md
skills/gradle-run/SKILL.md
skills/implement-issue/SKILL.md
skills/implement-with-subagents/SKILL.md
skills/kotlin-api-design/SKILL.md
skills/kotlin-concurrency-and-flow/SKILL.md
skills/kotlin-control-flow/SKILL.md
skills/kotlin-coroutines-structured-concurrency/SKILL.md
skills/kotlin-flow-state-event-modeling/SKILL.md
skills/kotlin-functions/SKILL.md
skills/kotlin-multiplatform-expect-actual/SKILL.md
skills/kotlin-types-value-class/SKILL.md
skills/run-github-project/SKILL.md
skills/shepherd/SKILL.md
skills/to-plan/SKILL.md
skills/using-chrisbanes-skills/SKILL.md

元信息

文件数
0
版本
2026.8.16
Hash
c122575f
收录时间
2026-08-16 02:44

首页 - Wiki
Copyright © 2011-2026 iteam. Current version is 2.155.2. UTC+08:00, 2026-08-26 17:02
浙ICP备14020137号-1 $访客地图$