Skip to content

Commit 28c3ec9

Browse files
committed
Add Suspensey Images behind a Flag (#32819)
We've known we've wanted this for many years and most of the implementation was already done for Suspensey CSS. This waits to commit until images have decoded by default or up to 500ms timeout (same as suspensey fonts). It only applies to Transitions, Retries (Suspense), Gesture Transitions (flag) and Idle (doesn't exist). Sync updates just commit immediately. `<img loading="lazy" src="..." />` opts out since you explicitly want it to load lazily in that case. `<img onLoad={...} src="..." />` also opts out since that implies you're ok with managing your own reveal. In the future, we may add an opt in e.g. `<img blocking="render" src="..." />` that opts into longer timeouts and re-suspends even sync updates. Perhaps also triggering error boundaries on errors. The rollout for this would have to go in a major and we may have to relax the default timeout to not delay too much by default. However, we can also make this part of `enableViewTransition` so that if you opt-in by using View Transitions then those animations will suspend on images. That we could ship in a minor. DiffTrain build for [efb22d8](efb22d8)
1 parent 7e5dab9 commit 28c3ec9

23 files changed

+2186
-1676
lines changed

compiled-rn/VERSION_NATIVE_FB

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
19.2.0-native-fb-c0f08ae7-20250403
1+
19.2.0-native-fb-efb22d88-20250404

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-dev.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<cb9ffdf31aaf504f9aceb096098cee8b>>
10+
* @generated SignedSource<<6cfd47f2b21b97b867be835cd77d7d5a>>
1111
*/
1212

1313
"use strict";
@@ -404,5 +404,5 @@ __DEV__ &&
404404
exports.useFormStatus = function () {
405405
return resolveDispatcher().useHostTransitionStatus();
406406
};
407-
exports.version = "19.2.0-native-fb-c0f08ae7-20250403";
407+
exports.version = "19.2.0-native-fb-efb22d88-20250404";
408408
})();

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-prod.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<7c60d2508c7e247be041400d14d26d4e>>
10+
* @generated SignedSource<<9609c3c47ee272adad57ce5c02b7bc80>>
1111
*/
1212

1313
"use strict";
@@ -203,4 +203,4 @@ exports.useFormState = function (action, initialState, permalink) {
203203
exports.useFormStatus = function () {
204204
return ReactSharedInternals.H.useHostTransitionStatus();
205205
};
206-
exports.version = "19.2.0-native-fb-c0f08ae7-20250403";
206+
exports.version = "19.2.0-native-fb-efb22d88-20250404";

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOM-profiling.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
* @noflow
88
* @nolint
99
* @preventMunge
10-
* @generated SignedSource<<7c60d2508c7e247be041400d14d26d4e>>
10+
* @generated SignedSource<<9609c3c47ee272adad57ce5c02b7bc80>>
1111
*/
1212

1313
"use strict";
@@ -203,4 +203,4 @@ exports.useFormState = function (action, initialState, permalink) {
203203
exports.useFormStatus = function () {
204204
return ReactSharedInternals.H.useHostTransitionStatus();
205205
};
206-
exports.version = "19.2.0-native-fb-c0f08ae7-20250403";
206+
exports.version = "19.2.0-native-fb-efb22d88-20250404";

compiled-rn/facebook-fbsource/xplat/js/RKJSModules/vendor/react/react-dom/cjs/ReactDOMClient-dev.js

Lines changed: 239 additions & 190 deletions
Large diffs are not rendered by default.

0 commit comments

Comments
 (0)