[Hydration] Bail out from hydrating suspense boundary if component suspends #22567
+66
−3
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
This fixes the issue pointed out by @gaearon in this PR: https://github.com/facebook/react/pull/21630/files.
The issue is that when a component in a boundary suspends while hydrating we attempt to hydrate its sibling. However we don't know how many nodes the suspended component would have rendered (because we don't add comment nodes to signal this since it would bloat the HTML) so we can't tell where the sibling should hydrate. Rather than attempt to hydrate it the solution in this PR bails on hydrating the boundary from within the current parent fiber. It will continue with the sibling to the parent fiber which is fine since the hydration pointer will be correct in this case.
This means we won't call render on any siblings or children but I think it should be fine since we don't reuse the work anyways. Since we don't call render we also don't "warm up" the codepath but that might be okay if there's other CPU work to do anyways we might actually see an improvement from allowing other higher priority work to happen.
How did you test this change?
Jest