-
Notifications
You must be signed in to change notification settings - Fork 3
Feedback #1
Comments
Thanks :) I’ll take another look tomorrow based on your suggestions. Appreciate the tips. |
@brillout Thanks again – the flashing content was just what you said, I wasn’t adding the rendered CSS to the server-rendered page (doh). Fixed. Also, adding
The url for the logo was not being reported correctly. I’m going to look into that now.
Sorry, that was just me being silly: of course hydration happens page-level, not the component-level. I think at some point I got it into my head that I wanted to hydrate the Counter component instead of the index page and confused myself. |
I'm aware of this. It's a Vite problem. Although since recently this problem seems to occur less. A fix would probably be only a minor change in Vite's source code (probably only 2-3 LOC really), I just didn't had the time yet to dig into it.
SSR is always a bit confusing at first :-). Looking forward for us to polish the Svelte integration (as well as the HTTPS integration - is there anything left to do on that side?). I'll then add new doc pages. |
Ah, interesting, I’m not seeing it with SvelteKit. I just whipped up a SvelteKit version of the same example (in case it makes it easier for you to track down the issue based on the differences in behaviour): https://github.com/aral/sveltekit-version-of-vite-plugin-ssr-project (That version also has the layout template set up properly, as per SvelteKit’s conventions.)
Haha, that’s an understatement. It’s amazing the level of complexity involved in JS tooling at the moment :) (Which is why vite-plugin-ssr is such a breath of fresh air. I really appreciate the modular “do one thing well” approach.)
I’ve now removed the HTTPS from this example (so that we’re changing only one thing in each example.) In the HTTPS example, I need to look into fixing HMR and then it should be good to go. I might have to add an API call to @small-tech/https (and thus to @small-tech/auto-encrypt and @small-tech/auto-encrypt-localhost) for obtaining references to the TLS certificate and key for when creating the Vite middleware before the server is created. I’ll let you know when I’m confident everything is working as expected. |
Neat 👌 and yes keep me updated. Looking forward to add your examples to the official list of examples.
I've a little vision going on about this :-). |
Nice work 👌.
Couple of things that may help you.
Normally vite-plugin-ssr already takes care of that, see: https://github.com/brillout/vite-plugin-ssr/blob/f17158be83a20114313a0b94d073678efdbc2a0f/src/getPreloadTags.node.ts#L17-L29
Note that this also works for Vue SFCs.
You can have a look whether the CSS snippets of the svelte components are included.
Also see the disucsion here vitejs/vite#2282
I don't see what the problem could be here? There is nothing view framework specific about setting the favicon, see the boilerplates.
Not exactly sure what you mean here but note that hydration (whether it's React, Vue, Svelte, ...) should always render the same content than the server-side rendered HTML. Otherwise it's a hydration mismatch, see https://vite-plugin-ssr.com/hydration.
The text was updated successfully, but these errors were encountered: