this post was submitted on 22 Nov 2023
1 points (100.0% liked)

Svelte + SvelteKit

541 readers
1 users here now

Svelte is a JavaScript framework for building user interfaces (UIs) that compiles your code into efficient JavaScript during the build process, resulting in better performance and smaller bundle sizes. Svelte focuses on reactive programming, where UI components update themselves when data changes, eliminating the need for a virtual DOM. Svelte Kit is an extension of Svelte that adds features like routing and server-side rendering, simplifying the creation of full-stack web applications. It provides file-based routing and supports server-side rendering, enabling faster initial page loads and improved search engine optimization. Svelte Kit combines client-side Svelte components with server-side rendering and serverless functions for a seamless development experience.

founded 1 year ago
MODERATORS
you are viewing a single comment's thread
view the rest of the comments
[โ€“] eluvatar 2 points 1 year ago (1 children)

Kinda wish it had DI, coming from Angular and C# it's so helpful to have stateful services, I know one answer is to just use a global static, but that causes huge issues on the server side and it's really easy to make mistakes there. It feels like contexts are the answer, but then you can't use those services in load functions.

I'm curious where do you store the current user data. In a static store? Return it from a load function and access it via the page store? Somewhere else?

[โ€“] silas 2 points 1 year ago* (last edited 1 year ago)

Well, I usually fetch and return user data from a top-level +layout.js or +layout.server.js. Then my user data is always available in every layout or page through the data prop (and types are all handle automatically for this too).

I then invalidate and re-fetch that data using invalidate(), invalidateAll(), and depends() if the user data becomes stale.

Any state/data from the user that needs to stay server-side (like tokens) I keep in event.locals which is available in all .server.js files