sites VS next-react-server-components

Minor correction, svelte repl is in sites repo, and it's well maintained and updated.

I found this GitHub issue that feels relevant to the Svelte REPL issue. It sounds like unpkg doesn't successfully resolve the dependency due to differences between CJS and ESM.

You'd need to bundle the svelte compiler, then feed the compiled output of your string through a worker containing a browser build of rollup to bundle all of the internal dependencies. Have a look at https://github.com/sveltejs/sites/tree/master/packages/repl if you really want to go through with this.

See: https://github.com/sveltejs/sites/issues/113

Here's one built with Svelte: https://hn.svelte.dev/

It's not exactly an apples-to-apples comparison for a number of reasons including implementation and hosting differences, but might be interesting to people anyway. The code lives here: https://github.com/sveltejs/sites/tree/master/sites/hn.svelt...

Assuming you cloned https://github.com/sveltejs/sites, then you need to cd into sites/ (https://github.com/sveltejs/sites/tree/master/sites) and then into the site you want. Afterwards just follow the instructions in the README (usually pnpm i and pnpm run dev).

I'm pretty sure it's just your extension misbehaving. Here is the like to the repo: https://github.com/sveltejs/sites/tree/master/sites/svelte.dev

Hm, it works for me (iOS). Might be worth opening an issue on the site repo with the issue you’re seeing.

the kit.svelte.dev site is also fully open source, but it uses a lot of components which handle almost everything also uses api.svelte.dev, a non-svelte site to get all the data so I don't know how helpful that is either

There is a number of public, easy-to-understand projects you can check out after you've digested all the new patterns from the docs (and maybe that tutorial): https://github.com/shadcn/next-contentlayer https://github.com/vercel/next-react-server-components

In the official Next.js demo both approaches are mixed together. But aren't these different approaches?

In the Next.js demo, SSR Streaming and React Server Components are presented together within one demo. Aren't the two approaches two different technologies that can be used independently?

For comparison this[1] is Next.js implementation that uses React Server Components (RSC). I feel folks at Remix missed on React Server Components and now it will be a lot of work to make it work in Remix. Hopefully I'm wrong.

If you don't know, RSC allows the HTML from server to start streaming as React is rendering the components in the backend. It allows fine grain control to what part of page renders first and which parts can be rendered later as HTML and data is streaming from the server. Before this, all of React server frameworks would render the entire page, shove "hydration data" in it which is mostly repeated data that is used to render the page and also include that HTML in the form of complied JSX in the page in the page scripts. Obviously that would make React SSR very bulky and unscalable. That's why RSC can solve so many React performance problems

[1] https://github.com/vercel/next-react-server-components