Should we / could we do something with unminified hydration JS assets?

[ricketyboo]

I will preface, this isn't critical, it's just an optimisation question and I know it would be low priority, but for some users this might be important.

Context

The files in leptos/src/hydration wind up raw dumped by include_str! into the head of the page and some of them are a bit chunky. Because they aren't part of the normal process, options like --jsMinify from cargo-leptos don't effect them.

When you're in CSR or most SSR modes this is fine because we'd only expect to load the head once and then switch over to client side updates so it won't fetch any-more.

Problem

I can see two scenarios that this causes a slightly needless transmission of data to the client:

1. Using StaticRouting to pre-generate pages - these snippets are stored in the head of ever pregenerated html file
2. SSR renders with JS disabled

In these cases the snippets get come down the wire from the server for each navigation event.

Impact

For standard hydration mode the hydration_script.js isn't terribly big; once you use islands or island-router the size of the head starts adding up.

If you wanting to do a static site or enable graceful no-JS support; the page loads obviously work fine but it is pulling down unnecessary data on every navigation.

Options

I wonder if it's possible to:

• minify these inline inclusions via hydration options, or target debug/release
• extract these into the /target/site/pkg as a separate file and modulepreload it into existence similar to the app js bundle

The former should have a marginally faster initial page load; the latter can utilise browser cache and makes subsequent navigations marginally faster.

Maybe we could make a hydration option to toggle between minified or exanded, and inline or exported?

Example

To see an example of what I'm talking about in a somewhat realistic case, edit the examples/static_routing project to run in island mode and then cargo leptos serve -r --js-minify true -P and look at the network responses.

[gbj]

Yeah, I think it's safe to say that the answer here is "yes" 😄

The good news is that the hydration scripts are already set up as static JS files -- i.e., the only variables that depend on the application are passed as JS variables, not actually injected into the JS.

I can't think of a good way off the top of my head to add them to the target/site directory so they can be served as regular files instead, but I am sure there is one. Are you interested in working on a PR?

[ricketyboo]

Hey thanks for weighing in!

Yes I was happy to see there was nothing dynamic in the scripts, that was my initial fear when I started exploring to raise this at all. Definitely makes it easier!

I'm quite appy to have a look, I think it might be within my newbie rust skillset haha, but I'm about to have very limited access to a computer for a few weeks so it'll be a while before I can start digging in properly!

If no-one else touches it I will have a look in October!