Routify style helpers and functionality

[kevmodrome]

Having used Routify on a number of projects and now trying out Kit I find myself missing some of the helpers.

I think these helpers in particular are of great value:

• url()
• isActive
• beforeUrlChange
• layout (useful for getting the children of a node (for example to construct navigation)

In addition to this, I find Routify's concept of a layout reset file very compelling. It's also something that constantly comes up up again and again in the Discord.

The alternative to these features is obviously to make them yourself but some of these features are very oft-used.

These helpers aren't super important important but overall I think they make it a lot easier to construct applications.

[DhyeyMoliya]

+1 for Layout Reset files @kevmodrome . A simple use case for the same is, a dynamic website and its management panel in a single SvelteKit project. Both will need a separate $layout and even separate $error files.

[Rich-Harris]

Agree that we need layout resets. I was thinking something nice and simple like $layout.reset.svelte. There's an issue for it here: #626

beforeUrlChange would be covered by #560.

To be totally honest, I'm unclear on the value of url, isActive and layout.

[kevmodrome]

That sounds like a reasonable solution to me. I had completely missed that issue - my bad!

You might be right about the url and isActive helpers. I suppose I just like the idea of having a quick and easy way to check if the page i'm on is active. In fairness I one could just as well use the page.path and stick an includes('some-path') on there 🤷

The layout one is pretty nice though, it makes it possible to reach into the manifest (is there one in kit?) and grab the children of a route in a very accessible way. One example is the sidebar on the recipe pages on the Svelte Society website and structure for reference. Makes for a great experience when you're building documentation style websites. One downside to this is that we one might want a way to set page titles on routes since you might not always want the file name as your title. In the end, maybe not worth it.

Edit: another feature Routify has is the _fallback.svelte one that acts as a catch-all for any routes "beneath" it. Would that be the solvable using [...something] in Kit?

[Rich-Harris]

[...something].svelte handles fallbacks, yeah.

There is no developer-accessible manifest, and even if there was we don't have a way to set the title of a given page that would be visible to said manifest. Even if we did, that would exclude dynamic routes (think blog/[slug].svelte, where slug corresponds to a Markdown file or some data from a CMS, which is arguably what we want to encourage over the comparatively expensive .svx paradigm in cases where the content is static). So we'd have to bake in a bunch of opinions and by doing so we'd be discouraging best practices.

[kevmodrome]

Fair enough. That makes sense. Cheers!

[benmccann]

which is arguably what we want to encourage over the comparatively expensive .svx paradigm in cases where the content is static

@Rich-Harris just curious, why is .svx more expensive? I don't really see why it would be, but am probably missing something

[Rich-Harris]

@benmccann data is cheaper than code! the .svx file has to go through the compiler, it has to be parsed and evaluated in the browser, and the rendering itself involves overhead compared to {@html big_blob_of_content}

[ricardo-valero]

• layout (useful for getting the children of a node (for example to construct navigation)

@kevmodrome How are you managing this at the moment? I was getting rid of routify but then got stuck here.

[benmccann]

There's some info in how to convert here: svelte-society/sveltesociety.dev#223 (comment)