Разработка Android приложений с Jetpack Compose - стр. 3

2. Layout: где размещать UI. Этот шаг состоит из двух: измерение и размещение. Элементы верстки измеряют и помещают самих себя и все дочерние элементы.

3. Drawing: как рендерить. UI-элементы отрисовываются в Canvas, обычно на экране устройства.

JetpackCompose не всегда выполняет все эти три этапа при обновлении данных или отображении элементов. Будут перерисованы только те Composable функции, в которых произошли изменения, что хорошо отражается на производительности.

Внутри каждого из состояний происходит считывание состояния, опишем, что происходит внутри каждого из них.

Этап 1: Composition.

Чтение состояния в Composable функции или лямбда-блоке влияет на Composition и потенциально на следующие этапы. Когда значение состояния меняется, recomposer планирует перезапуск всех Composable функций, которые его считывали. Обратите внимание, что среда выполнения может решить пропустить некоторые или все Composable функции, если входные данные не изменились.

В зависимости от результата Composition, Compose UI запускает этапы Layout и Drawing. Эти этапы могут быть пропущены, если контент не изменился, и, следовательно, общий размер элементов не изменится.

Этап 2: Layout.

Этап Layout включает два шага: измерение и размещение. Шаг измерения запускает лямбда-функции измерения, переданные в Layout-composable, метод MeasureScope.measure интерфейса LayoutModifier. Размещение запускает блок функции layout, лямбду из Modifier.offset {…} и т.д.

Считывание состояний во время каждого шага затрагивает этапы Layout и, потенциально, Drawing. Когда значение состояния меняется, Compose UI планирует выполнение этапа Layout. Это также запускает этап Drawing, если размер или расположение изменились.

Если быть более точным, шаги измерения и размещения имеют различные области перезапуска. То есть изменение прочитанного состояния на шаге размещения не вызывает повторно шаг измерения, который шел раньше. Однако эти два шага часто взаимосвязаны, так что чтение состояния на шаге размещения может повлиять на области перезапуска, которые относятся к шагу измерения.

Этап 3: Drawing.

Чтение состояния внутри кода отрисовки влияет на этап Drawing. Распространенные примеры включают: Canvas, Modifier.drawBehind и Modifier.drawWithContent. Когда значение считанного на этом этапе состояния меняется, Compose UI запускает только этап Drawing.

Оптимизация считывания состояния. Поскольку Compose выполняет отслеживание считывания состояний внутри этапов, мы можем минимизировать количество работы, выполняемой считыванием каждого состояния на этапах.