Lazy loading components work with SSR with solidStart?
Hello all, i'm working on an e-commerce demo, and need to load a grid with data of the products, the problem is that the grid and the content, is based on admin preferences, so i want to load it with lazy loading.
We will have like 5 or 6 very complex-different grids, so i don't want to LOAD ALL the options and use a switch or somethig because is just send JS to the client without optimizations.
looks like "lazy" api is just for this. to load a component with dynamic import.
The question: Will this grid work with SSR-solidStart? or this lazy loading and dynamic import only work on client-side?
i was checking the tutorial here:
https://www.solidjs.com/tutorial/async_lazy
and add some delay and i see the welcome but it's not "waiting" for SSR to be resolved.
is like "streaming" the lazy loaded component.
so for the SEO is required to load with SSR, because is the products data grid
Thanks for the answer
SolidJS
Solid is a purely reactive library. It was designed from the ground up with a reactive core. It's influenced by reactive principles developed by previous libraries.
2 Replies
It's not quite clear how you want it to behave, but I believe the answer is that lazily imported components will be shipped in ssr mode if they are used, and remaining lazy components will be loaded if the client needs and requests them
You can test that in a start project (I've only recently started using #solidstart myself), but I believe that is how it works
i found an example here https://stackblitz.com/edit/solidstart-dynamic-import
now the error it's patched i tested and works, i just add a delay and the solidStart server "wait" until timeout solve and return all the website. So great, works just like you said,
coralet
StackBlitz
solidstart-dynamic-import - StackBlitz
A Solid project based on solid-js, @solidjs/start and vinxi