search

maoberlehner / vue-lazy-hydration

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

What is the role of ssr-only in hydration? #32

Closed avlima closed 4 years ago

avlima commented 4 years ago

I have a site that is all optimized for SEO, but I am trying to improve its performance without falling into Google rank. So I saw this ssr-only parameter, I would like to know what it actually does and if it will help me.

Thank you.

maoberlehner commented 4 years ago

https://github.com/maoberlehner/vue-lazy-hydration#basic-example Point 2.

The ArticleContent component is only loaded in SSR mode, which means it never gets hydrated in the browser, which also means it will never be interactive (static content only).

never interactive means that if you bind any click handlers or do anything which requires JavaScript to run for this component to work, this mode is not for you. With ssr-only, only the HTML is generated server-side and no client side JavaScript for this component is executed at all. This is useful for static content without any dynamic client side functionality (not even router links inside of such a component would work as expected, they would work like regular <a> elements).

Sorry, I see that this is not well enough documented, I should make this more obvious.

simplenotezy commented 4 years ago

What's the difference between <LazyHydrate ssr-only> and <client-only>/<ssr-only>, which is native in Nuxt?

maoberlehner commented 4 years ago

I don’t understand the question. Can you be more specific about what you mean. Thx.

simplenotezy commented 4 years ago

I see, Git removed "<CodeInBrackets>" if it's not surrounded by `

simplenotezy commented 4 years ago

My question has been edited