maoberlehner / vue-lazy-hydration

Lazy Hydration of Server-Side Rendered Vue.js Components
MIT License
1.18k stars 52 forks source link

Is this meant to work on plain html inside a template too? #92

Closed danelowe closed 3 years ago

danelowe commented 3 years ago

I've just noticed that we've been using <LazyHydrate ssr-only/> around divs with text that does not need any hydration. I've only just considered that perhaps LazyHydrate is only meant to lazily hydrate whole hydrate vue components, and not parts of templates. If so, does the vue component need to be the only child, or a direct child of LazyHydrate?

I didn't see any mention of this in the readme, and I guess we just made assumptions about how it would work.

TitanFighter commented 3 years ago

AFAIK everything inside <LazyHydrate></LazyHydrate> is not hydrated, does not matter how many nested/child components you have inside.

danelowe commented 3 years ago

I just re-read the readme and found mention that multiple vue components can be lazy-hydrated by wrapping them in a single div, which is itself wrapped by LazyHydrate. However I'm still uncertain as to whether there is any benefit to lazy-hydrating (never/ssr-only) plain html inside a template.

maoberlehner commented 3 years ago

However I'm still uncertain as to whether there is any benefit to lazy-hydrating (never/ssr-only) plain html inside a template.

There is a benefit. How big of a benefit there is depends mostly on the number of HTML elements and nesting depth.