Skip to content

Commit 4502bd2

Browse files
committed
Clarify View Transition image reveal
1 parent 2b0bf46 commit 4502bd2

2 files changed

Lines changed: 2 additions & 2 deletions

File tree

‎src/content/reference/react-dom/components/img.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -252,4 +252,4 @@ hr {
252252

253253
</Sandpack>
254254

255-
Inside `<ViewTransition>`, React waits for the image before revealing the card. Outside it, React reveals the card without waiting for the image.
255+
With `<ViewTransition>`, React keeps the skeleton visible for up to 500 ms while the image loads, so the card can be revealed with its image already in place. Without `<ViewTransition>`, Suspense stops showing the skeleton as soon as the Promise resolves. If the image is still loading, the card appears first and the image pops in afterward.

‎src/content/reference/react/Suspense.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3053,7 +3053,7 @@ hr {
30533053
30543054
When a Suspense boundary reveals content inside a [`<ViewTransition>`](/reference/react/ViewTransition), React waits up to 500 ms for visible images to load before starting the animation. An `onLoad` handler opts an image out.
30553055
3056-
Compare the same boundary inside and outside a `<ViewTransition>`. Inside, React keeps the profile skeleton visible until the image is ready. Outside, React reveals the card when the Promise resolves, so the image may appear afterward:
3056+
Compare the same boundary inside and outside a `<ViewTransition>`. Inside, React keeps the profile skeleton visible for up to 500 ms while the image loads, so the card can be revealed with its image already in place. Outside, Suspense stops showing the skeleton as soon as the Promise resolves. If the image is still loading, the card appears first and the image pops in afterward:
30573057
30583058
<Sandpack>
30593059

0 commit comments

Comments
 (0)