dillon1000/react

Commit

Add Lazy Elements Behind a Flag (#19033)

We really needed this for Flight before as well but we got away with it
because Blocks were lazy but with the removal of Blocks, we'll need this
to ensure that we can lazily stream in part of the content.

Luckily LazyComponent isn't really just a Component. It's just a generic
type that can resolve into anything kind of like a Promise.

So we can use that to resolve elements just like we can components.

This allows keys and props to become lazy as well.

To accomplish this, we suspend during reconciliation. This causes us to
not be able to render siblings because we don't know if the keys will
reconcile. For initial render we could probably special case this and
just render a lazy component fiber.

Throwing in reconciliation didn't work correctly with direct nested
siblings of a Suspense boundary before but it does now so it depends
on new reconciler.
Browse files
Changed paths11 files
First-parent comparison
M packages/react-reconciler/src/ReactChildFiber.new.js ModifiedM packages/react-reconciler/src/ReactChildFiber.old.js ModifiedM packages/react-reconciler/src/__tests__/ReactLazy-test.internal.js ModifiedM packages/shared/ReactFeatureFlags.js ModifiedM packages/shared/forks/ReactFeatureFlags.native-fb.js ModifiedM packages/shared/forks/ReactFeatureFlags.native-oss.js ModifiedM packages/shared/forks/ReactFeatureFlags.test-renderer.js ModifiedM packages/shared/forks/ReactFeatureFlags.test-renderer.www.js ModifiedM packages/shared/forks/ReactFeatureFlags.testing.js ModifiedM packages/shared/forks/ReactFeatureFlags.testing.www.js ModifiedM packages/shared/forks/ReactFeatureFlags.www.js Modified
Patch

Files changed

Rendering syntax-highlighted changes…