derivedStateOf и snapshotFlow
Эффективно вычисляйте и наблюдайте производное состояние.
«derivedStateOf и snapshotFlow» — бесплатный урок Jetpack Compose Academy на CoddyKit. Это урок 4 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Jetpack Compose Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Jetpack Compose Academy содержит 4 уроков всего.
Части этого урока еще не переведены и отображаются на английском.
Computing Values from State
Sometimes a value depends on other state, like a button enabled only when a form is valid. Computing it well avoids wasteful recomposition.
Meet derivedStateOf
A derivedStateOf creates state from a calculation. It only notifies readers when the computed result actually changes, not on every input tweak.
val isValid by remember {
derivedStateOf { name.isNotBlank() && age > 0 }
}It Filters Out Noise
If many state reads feed one boolean, derivedStateOf recomputes often but emits only when the boolean flips. The UI redraws far less.
A Scroll Example
Showing a scroll-to-top button only when scrolled past item 5 is perfect for derivedStateOf, since the index changes constantly.
val showButton by remember {
derivedStateOf { listState.firstVisibleItemIndex > 5 }
}Always Remember It
Wrap derivedStateOf in remember so the derived state survives recomposition. Without remember you would rebuild it every redraw.
Meet snapshotFlow
A snapshotFlow turns Compose state into a Kotlin Flow. You collect it inside an effect to react to state changes outside composition.
snapshotFlow { listState.firstVisibleItemIndex }
.collect { index -> log(index) }Run It in LaunchedEffect
Because collecting is suspending, you place a snapshotFlow inside a LaunchedEffect. It bridges Compose state into coroutine-based work.
LaunchedEffect(listState) {
snapshotFlow { listState.firstVisibleItemIndex }
.collect { save(it) }
}Combine with Flow Operators
Since it is a real Flow, you can chain operators like distinctUntilChanged or debounce to control how often you react.
snapshotFlow { query }
.debounce(300)
.collect { search(it) }derivedStateOf vs snapshotFlow
Use derivedStateOf to feed the UI a computed value, and snapshotFlow to push state changes into side effects like logging or saving.
Avoid Naive Recomputation
Reading scroll state directly in the body recomposes every frame. derivedStateOf caps the redraws to when the meaningful result changes.
Both Make UIs Efficient
Together these tools keep Compose fast: derivedStateOf shrinks recomposition, and snapshotFlow moves reactions off the composition path.
Quick Check
Recall what each tool is optimized for.
Recap: derivedStateOf & snapshotFlow
Awesome! derivedStateOf computes efficient UI values that emit only on real change, while snapshotFlow streams Compose state into coroutines. ⚡
Изучай Kotlin с ИИ-репетитором — бесплатно
Пиши и запускай код прямо в браузере, получай мгновенную помощь от ИИ-репетитора 24/7 и продолжи учиться на сайте или в приложении.
- Курсы
- 30
- Уроки
- 120
Часто задаваемые вопросы
Урок «derivedStateOf и snapshotFlow» бесплатный?
Да — полный текст урока «derivedStateOf и snapshotFlow» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Jetpack Compose Academy, подпишись на CoddyKit PRO. Курс Jetpack Compose Academy содержит 4 уроков всего.
Чему я научусь в уроке «derivedStateOf и snapshotFlow»?
Эффективно вычисляйте и наблюдайте производное состояние. Ты практикуешь Jetpack Compose Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать Jetpack Compose Academy?
Предыдущий опыт не требуется. Jetpack Compose Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 4 из 4.
Сколько времени занимает урок «derivedStateOf и snapshotFlow»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке Jetpack Compose Academy?
Да. Каждый урок Jetpack Compose Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- LaunchedEffect для корутин
- rememberCoroutineScope для событий
- DisposableEffect и очистка
- derivedStateOf и snapshotFlow