search

akxcv / vuera

:eyes: Vue in React, React in Vue. Seamless integration of the two. :dancers:
MIT License
4.3k stars 241 forks source link

Slow rendering of React components. #165

Open spatil32 opened 1 year ago

spatil32 commented 1 year ago

I have a VueJS project setup with Nuxt. I have all my Vue pages loading with the SSR support. In one of the main pages, I am rendering React component (Header Component) using Vuera. The react component is at the very top in the component tree, however, the entire page loads first and then React component loads afterwords which is creating confusing behavior for users. Is SSR supported by Vuera or is there any workaround to change priority of rendering so that React component renders first before all Vue components render?

kyle-ssg commented 1 year ago

+1, I think under the hood, the library first mounts the vue wrapper and then renders to the root node ref causing the layout shift.

I'm not entirely sure the problem is avoidable but I do wonder whether rendering prior mounting can be done by having the initial markup be a react renderToString?