Skip to content

Conversation

@sebmarkbage
Copy link
Collaborator

@sebmarkbage sebmarkbage commented Jan 19, 2026

Follow up to #35337.

During a gesture, we always cancel the original animation and create a new one that we control. That's the one we need to add to the set that needs to be cancelled. Otherwise future gestures hang.

An unfortunate consequence is that any custom ones that you start e.g. with #35556 or through other means aren't automatically cleaned up (in fact there's not even a clean up callback yet). This can lead these to freeze the whole UI afterwards. It would be really good to get this fixed in browsers instead so we can revert #35337.

@meta-cla meta-cla bot added the CLA Signed label Jan 19, 2026
@github-actions github-actions bot added the React Core Team Opened by a member of the React Core Team label Jan 19, 2026
@react-sizebot
Copy link

Comparing: 195fd22...b6c2630

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name +/- Base Current +/- gzip Base gzip Current gzip
oss-stable/react-dom/cjs/react-dom.production.js = 6.84 kB 6.84 kB +0.05% 1.88 kB 1.88 kB
oss-stable/react-dom/cjs/react-dom-client.production.js = 608.48 kB 608.48 kB = 107.60 kB 107.60 kB
oss-experimental/react-dom/cjs/react-dom.production.js = 6.84 kB 6.84 kB +0.05% 1.88 kB 1.88 kB
oss-experimental/react-dom/cjs/react-dom-client.production.js +0.04% 670.95 kB 671.24 kB +0.03% 118.02 kB 118.05 kB
facebook-www/ReactDOM-prod.classic.js = 693.87 kB 693.87 kB = 121.98 kB 121.98 kB
facebook-www/ReactDOM-prod.modern.js = 684.25 kB 684.25 kB = 120.37 kB 120.37 kB

Significant size changes

Includes any change greater than 0.2%:

(No significant changes)

Generated by 🚫 dangerJS against b6c2630

@0xsambit
Copy link

Good Work

Copy link

@maxine-yx maxine-yx left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Overall looks good! The fix properly handles animation cleanup.

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great fix! This properly tracks the animation for cleanup.

rangeStart: (reverse ? rangeEnd : rangeStart) + '%',
rangeEnd: (reverse ? rangeStart : rangeEnd) + '%',
});
viewTransitionAnimations.push(animation);

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good addition - this ensures the animation is tracked for proper cleanup.

@sebmarkbage sebmarkbage merged commit a49952b into facebook:main Jan 20, 2026
240 checks passed
sebmarkbage added a commit that referenced this pull request Jan 20, 2026
…ts (#35564)

Stacked on #35556 and #35559.

Given that we don't automatically clean up all view transition
animations since #35337 and browsers are buggy, it's important that you
clean up any `Animation` started manually from the events. However,
there was no clean up function for when the View Transition is forced to
stop. This also makes it harder to clean up custom timers etc too.

This lets you return a clean up function from all the events on
`<ViewTransition>`.
github-actions bot pushed a commit that referenced this pull request Jan 20, 2026
…ts (#35564)

Stacked on #35556 and #35559.

Given that we don't automatically clean up all view transition
animations since #35337 and browsers are buggy, it's important that you
clean up any `Animation` started manually from the events. However,
there was no clean up function for when the View Transition is forced to
stop. This also makes it harder to clean up custom timers etc too.

This lets you return a clean up function from all the events on
`<ViewTransition>`.

DiffTrain build for [c55ffb5](c55ffb5)
sebmarkbage added a commit that referenced this pull request Jan 20, 2026
Follow up to #35559.

The clean up function of the custom timeline doesn't necessarily clean
up the animation. Just the timeline's internal state.

This affects Firefox which doesn't support ScrollTimeline so uses the
polyfill's custom timeline.
github-actions bot pushed a commit that referenced this pull request Jan 20, 2026
Follow up to #35559.

The clean up function of the custom timeline doesn't necessarily clean
up the animation. Just the timeline's internal state.

This affects Firefox which doesn't support ScrollTimeline so uses the
polyfill's custom timeline.

DiffTrain build for [d290875](d290875)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed React Core Team Opened by a member of the React Core Team

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants