-
-
Notifications
You must be signed in to change notification settings - Fork 4.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
chore: single-pass hydration #11770
chore: single-pass hydration #11770
Conversation
|
I fear that this will mean we won't capture hydration issues as well. However, it seems possible to do in practice and I'd love to see how this performs comparatively to what we have on main and your other PR. Given the amount of failing tests though, it does worry me that we'll need to add lots of extra logic for edge cases. It's a real shame we can't use elements with |
merged #12335, closing |
More hydration experimentation. I'm not going to take this any further for now as I have other things to do, but I'll leave it here to pick up at some point in the future.
The main finding from #11690 is that
nextSibling
is the most expensive part of hydration. It stands to reason, therefore, that we could speed things up by doing it less often. Currently, we do two passes — one inhydrate_anchor
, and one in each effect body (where we call functions likefirst_child
andchild
and — crucially —sibling
). If we could avoid callinghydrate_anchor
at all, it should therefore have a significant impact on hydration speed.I have no idea if this is actually possible, but I'm experimenting with it. At the very least, it seems wholly unnecessary to enclose
<svelte:element>
and CSS custom property wrapper divs in hydration markers — in the first case we do need an anchor (to handle thethis={falsy}
case) but in the latter we don't need anything at all. For now we still callhydrate_anchor
with the element in question, but this exits early rather than traversing. I hope we can extend this approach to other cases — ideally we would only need to do an eager pass for things like mismatchedif
/each
blocks.Before submitting the PR, please make sure you do the following
feat:
,fix:
,chore:
, ordocs:
.Tests and linting
pnpm test
and lint the project withpnpm lint