Hacker News new | ask | show | jobs
by almostdigital 1155 days ago
SvelteKit's routing pattern is anything but clean. It uses filesystem based routes where every file is called "+page.svelte" (or +page.server.js/ts for API only routes).

For anything but a demo app with just a couple of routes it's a headache to navigate.

Edit: Another smell of the routing system to me is that you need to resort to complexity like this [1] to have anything but top down inheritance. I love Svelte btw and have used it in many projects.

[1] https://kit.svelte.dev/docs/advanced-routing#advanced-layout...

4 comments

Having built a rather large app using SvelteKit, I found the routing scheme to make lots of sense actually. You always know what code is located where, concepts transfer everywhere consistently, and concerns are nicely separated.
In theory it seems neat but in practice I'm here with 10 tabs all called "+page.svelte" or "+page.server.ts" and it completely breaks my workflow since I can't tell them apart or navigate with fuzzy name matching. How do you deal with that?
Generally you should try to get away from clicking around on file tabs and use your command palette but one thing you can do, if you're using VS Code, is change the "Label format" to "short" in the settings.
As I've grown older, I've seen lots of improvements to software usability - it warms my hear to see the attitude of yesteryear's "you're not using it right, consider changing your lifestyle" still alive and well.
Why should you get away from clicking tabs, apart from having to deal with this issue?
Because it's much faster, goes for most navigation in code editors, try it! :)
I'm offended! I don't click around like some lowly peasant, I navigate by keyboard like God intended.
For anyone wishing for a VS Code fix, comment on this issue: https://github.com/microsoft/vscode/issues/41909#issuecommen...
It would be great if VSCode provided an API for the tab labels but the Svelte team really created the problem in the first place.

This whole file-based routing wasn't a great idea to begin with, as a general solution to routing. It works (up to a point) for a static site generator, but most SSGs provide a permalink setting so there's an escape hatch.

The whole thing gets even worse when you start introducing issues like having dozens if not hundreds of files with the same filename, weird characters in folder and file names, etc.

Try a JetBrains IDE - if two tabs with the same filename are open, it will automatically prepend the name of the containing folder (recursively up, until the names are different). I wouldn't know how to stay sane for the same reason otherwise.
This.

It might look complicated at first sight, but once you actually use it you really appreciate the way it's structured.

Well yeah you can get used to anything. Doesn't mean it's a good idea to begin with.
I completely agree.

I've been using Svelte happily for years, but I won't be using SvelteKit. In part because of the routing but also because it doesn't really solve much in the backend.

It's amazing that all the full stack frameworks (Next, Nuxt, SvelteKit, Remix, Astro, etc) are investing so much effort into reinvent the backend and after years they still don't provide even basic backend functionality. For example, out of the box, Fastify gives you validation, sessions, CORS, cache headers, etc. Features that you need in probably all backend projects.

I started this repo to figure out how to integrate Svelte with Fastify using Vite. It has hot reload, partial hydration, etc. It's very quick and dirty code, but it works.

https://github.com/PierBover/fastify-vite-svelte-template

It's only a headache if you make it one. With an open mind, it looks pretty neat to be honest. The top down inheritance doesn't look complex, just weird.
I agree with this comment. SvelteKit is unnecessarily complicated. The `+page.svelte` etc are just the start of it.

Plus I can't use it with Go, PHP, Ruby, Rust etc when it comes to SSR (without running multiple servers and handling deployment nightmares).

Something about this whole Node + SSR Front-end is smelly. (next, nuxt, solidstart) I love Svelte as a framework and a way of writing UI, but SvelteKit. Eh! Not so much.

SvelteKit is too much complexity for no reason. Goes opposite of what Svelte was meant to be: Simple and intuitive.

Curious to hear more, what specifically is complicated about it?

SvelteKit is a JavaScript framework, it makes sense that you can't use it with other languages. You can pair it with a backend of your choice of course, but to get the SSR benefits you do need to work within the framework.

There are other ways of using Svelte with other languages, I would take a look at something like Inertia.js [0].

[0] https://inertiajs.com

Hey Kevin! First of all. I am a regular listener to your podcast! Love it!

Now, I am not specifically targeting SvelteKit to be fair. But the whole host of meta-frameworks like NextJS, NuxtJS etc which Vercel is pushing.

These frameworks in general are too much complexity added. SSR is hard and the best way to handle all of these is to not have a server layer at all. That is just abstract the rendering/routing part and leave the rest of the server stuffs to the user.

I want to simply write my Fastify/Express/Go-gin/Django app. Then add SvelteKit as my front-end with SSR support.

Right now, I first write SvelteKit and then think how am I going to integrate Express and Fastify to it (for a moment let's leave non-node solutions).

Trust me. If you simply leave the server out of SK and generate a simple API abstraction like `res.send(renderSKPath('/users/:id', { serverData }))`. It would have done the job.

I think its difficult to express what I want to say, but in short, remove the server and keep SK as a rendering layer only.

P.S. I know that there is an express adapter for SK. But that is not the point of this comment at all.

You're asking for two things that seem largely incompatible. How do you expect to do SSR in a Go-gin or Django app? Svelte components get compiled to JavaScript and SvelteKit is written in JavaScript. Doing SSR in those frameworks would necessitate calling JavaScript from Go or Python and introduce far more complexity if you could get it to work at all. The simplest options are either to run a Node server or turn off SSR, which you can do with 1-line in SvelteKit.
“SvelteKit is too complicated, it doesn’t even have this thing that would certainly make it more complicated!”