mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Samuel Susla
afec07aca2
Summary: changelog: [internal] `useLayoutEffect` has two guarantees which React Native breaks: - Layout metrics are ready. - Updates triggered inside `useLayoutEffect` are applied before paint. State between first commit and update is not shown on the screen. React Native breaks the first guarantee because it uses Background Executor. Background executor moves Yoga layout to another thread. If user core reads layout metrics in `useLayoutEffect` hook, it is a race. The information might be there, or it might not. They can even read partially update information. This diff does not affect this. We already have a way to turn off Background Executor. We haven't done this because it introduces regressions on one screen but we have a solution for that. React Native breaks the second guarantee. After Fabric's commit phase, Fabric moves to mounting the changes right away. In this diff, we queue the mounting phase and give React a chance to change what is committed to the screen. To do that, we schedule a task with user blocking priority in `RuntimeScheduler`. React, if there is an update in `useLayoutEffect`, schedules a task in the scheduler with higher priority and stops the mounting phase. We are not delaying mounting, this just gives React a chance to interrupt it. Fabric commit phase may be triggered by different mechanisms. C++ state update, surface tear down, template update (not used atm), setNativeProps, to name a few. Fabric only needs to block paint if commit originates from React. Otherwise the scheduling is wrong and we will get into undefined behaviour land. Rollout: This change is gated behind `react_fabric:block_paint_for_use_layout_effect` and will be rolled out incrementally. Reviewed By: javache Differential Revision: D43083051 fbshipit-source-id: bb494cf56a11763e38dce7ba0093c4dafdd8bf43
45 lines
1.2 KiB
C++
45 lines
1.2 KiB
C++
/*
|
|
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*/
|
|
|
|
#pragma once
|
|
|
|
#include <react/renderer/mounting/MountingCoordinator.h>
|
|
|
|
namespace facebook {
|
|
namespace react {
|
|
|
|
class ShadowTree;
|
|
|
|
/*
|
|
* Abstract class for ShadowTree's delegate.
|
|
*/
|
|
class ShadowTreeDelegate {
|
|
public:
|
|
/*
|
|
* Called right before a ShadowTree commits a new tree.
|
|
* The receiver can alter a new (proposed) shadow tree with another tree
|
|
* by returning the altered tree.
|
|
* Returning a `nullptr` cancels the commit.
|
|
*/
|
|
virtual RootShadowNode::Unshared shadowTreeWillCommit(
|
|
ShadowTree const &shadowTree,
|
|
RootShadowNode::Shared const &oldRootShadowNode,
|
|
RootShadowNode::Unshared const &newRootShadowNode) const = 0;
|
|
|
|
/*
|
|
* Called right after Shadow Tree commit a new state of the tree.
|
|
*/
|
|
virtual void shadowTreeDidFinishTransaction(
|
|
MountingCoordinator::Shared mountingCoordinator,
|
|
bool mountSynchronously) const = 0;
|
|
|
|
virtual ~ShadowTreeDelegate() noexcept = default;
|
|
};
|
|
|
|
} // namespace react
|
|
} // namespace facebook
|