Commit a031042
committed
[Fizz] Outline a Suspense Boundary if it has Suspensey CSS or Images (#34552)
We should favor outlining a boundary if it contains Suspensey CSS or
Suspensey Images since then we can load that content separately and not
block the main content. This also allows us to animate the reveal.
For example this should be able to animate the reveal even though the
actual HTML content isn't large in this case it's worth outlining so
that the JS runtime can choose to animate this reveal.
```js
<ViewTransition>
<Suspense>
<img src="..." />
</Suspense>
</ViewTransition>
```
For Suspensey Images, in Fizz, we currently only implement the suspensey
semantics when a View Transition is running. Therefore the outlining
only applies if it appears inside a Suspense boundary which might
animate. Otherwise there's no point in outlining. It is also only if the
Suspense boundary itself might animate its appear and not just any
ViewTransition. So the effect is very conservative.
For CSS it applies even without ViewTransition though, since it can help
unblock the main content faster.
DiffTrain build for [6eb5d67](6eb5d67)1 parent 8669b9e commit a031042
File tree
36 files changed
+342
-235
lines changed- compiled/facebook-www
36 files changed
+342
-235
lines changed| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
1 | | - | |
| 1 | + | |
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
1 | | - | |
| 1 | + | |
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
1419 | 1419 | | |
1420 | 1420 | | |
1421 | 1421 | | |
1422 | | - | |
| 1422 | + | |
1423 | 1423 | | |
1424 | 1424 | | |
1425 | 1425 | | |
| |||
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
1419 | 1419 | | |
1420 | 1420 | | |
1421 | 1421 | | |
1422 | | - | |
| 1422 | + | |
1423 | 1423 | | |
1424 | 1424 | | |
1425 | 1425 | | |
| |||
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
602 | 602 | | |
603 | 603 | | |
604 | 604 | | |
605 | | - | |
| 605 | + | |
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
602 | 602 | | |
603 | 603 | | |
604 | 604 | | |
605 | | - | |
| 605 | + | |
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
606 | 606 | | |
607 | 607 | | |
608 | 608 | | |
609 | | - | |
| 609 | + | |
610 | 610 | | |
611 | 611 | | |
612 | 612 | | |
| |||
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
606 | 606 | | |
607 | 607 | | |
608 | 608 | | |
609 | | - | |
| 609 | + | |
610 | 610 | | |
611 | 611 | | |
612 | 612 | | |
| |||
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
20224 | 20224 | | |
20225 | 20225 | | |
20226 | 20226 | | |
20227 | | - | |
| 20227 | + | |
20228 | 20228 | | |
20229 | 20229 | | |
20230 | | - | |
| 20230 | + | |
20231 | 20231 | | |
20232 | 20232 | | |
20233 | 20233 | | |
| |||
20261 | 20261 | | |
20262 | 20262 | | |
20263 | 20263 | | |
20264 | | - | |
| 20264 | + | |
20265 | 20265 | | |
20266 | 20266 | | |
20267 | 20267 | | |
| |||
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
19995 | 19995 | | |
19996 | 19996 | | |
19997 | 19997 | | |
19998 | | - | |
| 19998 | + | |
19999 | 19999 | | |
20000 | 20000 | | |
20001 | | - | |
| 20001 | + | |
20002 | 20002 | | |
20003 | 20003 | | |
20004 | 20004 | | |
| |||
20032 | 20032 | | |
20033 | 20033 | | |
20034 | 20034 | | |
20035 | | - | |
| 20035 | + | |
20036 | 20036 | | |
20037 | 20037 | | |
20038 | 20038 | | |
| |||
0 commit comments