Skip to content
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

perf(nuxt): prevent converting client only component setup to Promise #28334

Merged
merged 14 commits into from
Aug 12, 2024

Conversation

huang-julien
Copy link
Member

@huang-julien huang-julien commented Jul 27, 2024

🔗 Linked issue

closes #27999

📚 Description

Hey 👋

This PR improve components from createClientComponent if they are mounted after hydration. This bypass all code run specifically for hydration. Meaning the component will directly be returned if nuxt has already been hydrated.

This PR also treeshake code that is not required server side

@huang-julien huang-julien requested a review from danielroe as a code owner July 27, 2024 19:42
Copy link

stackblitz bot commented Jul 27, 2024

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@huang-julien huang-julien marked this pull request as draft July 27, 2024 19:44
@huang-julien huang-julien marked this pull request as ready for review July 27, 2024 19:48
@huang-julien huang-julien changed the title perf(nuxt): return component instance if not hydrating in client only perf(nuxt): directly render client-only component if mounted after hydration Jul 27, 2024
@danielroe danielroe mentioned this pull request Aug 5, 2024
5 tasks
Copy link
Member

@danielroe danielroe left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is there a way to add a regression test for this one?

@huang-julien huang-julien marked this pull request as draft August 5, 2024 20:24
@huang-julien
Copy link
Member Author

@danielroe so with this fix, we still need to wait exactly 3 ticks until the client component is mounted. Should we instead advise users to use @vue:mounted instead ?

@danielroe danielroe mentioned this pull request Aug 8, 2024
5 tasks
@huang-julien huang-julien changed the title perf(nuxt): directly render client-only component if mounted after hydration perf(nuxt): prevent converting client only component setup to Promise Aug 8, 2024
@huang-julien huang-julien marked this pull request as ready for review August 9, 2024 20:16
Copy link
Member

@danielroe danielroe left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

❤️

@danielroe danielroe merged commit d21bd84 into main Aug 12, 2024
38 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Client only component not mounted after nextTick
2 participants