Skip to content

Commit

Permalink
Execute layout phase before after mutation phase inside view transiti…
Browse files Browse the repository at this point in the history
…on (facebook#32029)

This allows mutations and scrolling in the layout phase to be counted
towards the mutation. This would maybe not be the case for gestures but
it is useful for fire-and-forget.

This also avoids the issue that if you resolve navigation in
useLayoutEffect that it ends up dead locked.

It also means that useLayoutEffect does not observe the scroll
restoration and in fact, the scroll restoration would win over any
manual scrolling in layout effects. For better or worse, this is more in
line with how things worked before and how it works in popstate. So it's
less of a breaking change. This does mean that we can't unify the after
mutation phase with the layout phase though.

To do this we need split out flushSpawnedWork from the flushLayoutEffect
call.

Spawned work from setState inside the layout phase is done outside and
not counted towards the transition. They're sync updates and so are not
eligible for their own View Transitions. It's also tricky to support
this since it's unclear what things like exits in that update would
mean. This work will still be able to mutate the live DOM but it's just
not eligible to trigger new transitions or adjust the target of those.

One difference between popstate is that this spawned work is after
scroll restoration. So any scrolling spawned from a second pass would
now win over scroll restoration.

Another consequence of this change is that you can't safely animate
pseudo elements in useLayoutEffect. We'll introduce a better event for
that anyway.

DiffTrain build for [fd9cfa4](facebook@fd9cfa4)
  • Loading branch information
pull[bot] committed Jan 9, 2025
1 parent 1a044c8 commit b104081
Show file tree
Hide file tree
Showing 23 changed files with 1,518 additions and 1,403 deletions.
2 changes: 1 addition & 1 deletion compiled-rn/VERSION_NATIVE_FB
Original file line number Diff line number Diff line change
@@ -1 +1 @@
19.1.0-native-fb-98418e89-20250108
19.1.0-native-fb-fd9cfa41-20250108
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<08e443744db50b32588656c3382782c0>>
* @generated SignedSource<<80fb2d9f605c6604061b60c56a329bb8>>
*/

"use strict";
Expand Down Expand Up @@ -420,5 +420,5 @@ __DEV__ &&
exports.useFormStatus = function () {
return resolveDispatcher().useHostTransitionStatus();
};
exports.version = "19.1.0-native-fb-98418e89-20250108";
exports.version = "19.1.0-native-fb-fd9cfa41-20250108";
})();
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<b90ba57092a2b533d32f364f4bb9ceab>>
* @generated SignedSource<<273ca40d8b721c00ceeb079a43fccff3>>
*/

"use strict";
Expand Down Expand Up @@ -203,4 +203,4 @@ exports.useFormState = function (action, initialState, permalink) {
exports.useFormStatus = function () {
return ReactSharedInternals.H.useHostTransitionStatus();
};
exports.version = "19.1.0-native-fb-98418e89-20250108";
exports.version = "19.1.0-native-fb-fd9cfa41-20250108";
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
* @noflow
* @nolint
* @preventMunge
* @generated SignedSource<<b90ba57092a2b533d32f364f4bb9ceab>>
* @generated SignedSource<<273ca40d8b721c00ceeb079a43fccff3>>
*/

"use strict";
Expand Down Expand Up @@ -203,4 +203,4 @@ exports.useFormState = function (action, initialState, permalink) {
exports.useFormStatus = function () {
return ReactSharedInternals.H.useHostTransitionStatus();
};
exports.version = "19.1.0-native-fb-98418e89-20250108";
exports.version = "19.1.0-native-fb-fd9cfa41-20250108";

Large diffs are not rendered by default.

Loading

0 comments on commit b104081

Please sign in to comment.