Skip to content

Commit 6348e23

Browse files
committed
Clarify viewport comments.
1 parent fd58974 commit 6348e23

File tree

1 file changed

+16
-1
lines changed

1 file changed

+16
-1
lines changed

packages/react-reconciler/src/ReactFiberApplyGesture.js

Lines changed: 16 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,6 @@ function applyViewTransitionToClones(
9393
// created by the insertion side. If the insertion side if found before the deletion side
9494
// then this is called by the deletion. If the deletion is visited first then this is called
9595
// later by the insertion when the clone has been created.
96-
// TODO: Should we measure if this in the viewport first?
9796
for (let i = 0; i < clones.length; i++) {
9897
applyViewTransitionName(
9998
clones[i],
@@ -142,6 +141,12 @@ function trackDeletedPairViewTransitions(deletion: Fiber): void {
142141
props.share,
143142
);
144143
if (className !== 'none') {
144+
// TODO: Since the deleted instance already has layout we could
145+
// check if it's in the viewport and if not skip the pairing.
146+
// It would currently cause layout thrash though so if we did that
147+
// we need to avoid inserting the root of the cloned trees until
148+
// the end.
149+
145150
// The "old" instance is actually the one we're inserting.
146151
const oldInstance: ViewTransitionState = pair;
147152
// The "new" instance is the already mounted one we're deleting.
@@ -181,6 +186,12 @@ function trackEnterViewTransitions(deletion: Fiber): void {
181186
);
182187
if (className !== 'none') {
183188
if (pair !== undefined) {
189+
// TODO: Since the deleted instance already has layout we could
190+
// check if it's in the viewport and if not skip the pairing.
191+
// It would currently cause layout thrash though so if we did that
192+
// we need to avoid inserting the root of the cloned trees until
193+
// the end.
194+
184195
// Delete the entry so that we know when we've found all of them
185196
// and can stop searching (size reaches zero).
186197
// $FlowFixMe[incompatible-use]: Refined by the pair.
@@ -262,6 +273,10 @@ function applyExitViewTransition(placement: Fiber): void {
262273
state.paired ? props.share : props.exit,
263274
);
264275
if (className !== 'none') {
276+
// TODO: Ideally we could determine if this exit is in the viewport and
277+
// exclude it otherwise but that would require waiting until we insert
278+
// and layout the clones first. Currently wait until the view transition
279+
// starts before reading the layout.
265280
const clones = state.clones;
266281
// If there are no clones at this point, that should mean that there are no
267282
// HostComponent children in this ViewTransition.

0 commit comments

Comments
 (0)