trunk icon indicating copy to clipboard operation
trunk copied to clipboard

Published 20 hours ago • verified publisher icon trunk-rs

Display "Loading..." or similar while wasm is being downloaded and compiled

Open ISibboI opened this issue 1 year ago • 4 comments

Hi, thank you so much for creating trunk! It makes deploying wasm so much easier and more enjoyable!

My wasm application takes a few seconds to load, and during loading the browser only shows a white page, appearing broken to potential users. It would be nice to instead allow to configure some text that is displayed during loading (and ideally to style that text, or display an image instead, etc).

I would be totally satisfied with a CLI argument like trunk serve --loading-text "Loading...".

Alternatively, it would be nice if the link tag could support onload, such that loading animations can be manually removed by the user like e.g. this: <link data-trunk rel="rust" href="Cargo.toml" data-wasm-opt="z" data-bin="..." onload="document.querySelector('#loading_bar').remove()"/>

ISibboI avatar Aug 23 '22 14:08 ISibboI

I'm not entirely sure I support this.

On one hand, --loading-text 'Loading...' is too biased. What if I want an animated spinner for loading? It's not text.

I also think the current solution is flexible already. Anything put in the <body> will get replaced by Trunk automatically. So if you want a loading text, just put your loading modal there.

For example, on my website, the index.html body has an animated spinner, and that gets replaced when the WASM loads.

simbleau avatar Aug 26 '22 12:08 simbleau

I also think the current solution is flexible already. Anything put in the <body> will get replaced by Trunk automatically. So if you want a loading text, just put your loading modal there.

For example, on my website, the index.html body has an animated spinner, and that gets replaced when the WASM loads.

Hm, for me, using trunk 0.16.0, the body is not replaced after the wasm file was loaded. I tried placing a <p>Loading...</p> before or after the <link> in the body, but it stays there after my wasm stuff is showing up already. I am using Brave v1.42.97 (Aug 17th, 2022) based on Chromium 104.0.5112.102.

However, if that behavior would work, then it would already be everything I would need.

ISibboI avatar Aug 27 '22 13:08 ISibboI

The link goes in the head.

For a good example, see https://github.com/simbleau/website/blob/e29ad56dc1cecd78a0e949cc267deb6aa1d068df/index.html#L68

I can't help much without seeing your code.

simbleau avatar Aug 27 '22 14:08 simbleau

Thanks!

I have put the link into the head, but to no avail. The body is not emptied when the WASM is loaded.

I created an example project: https://github.com/ISibboI/debug-trunkrs

I put the link into the head, and a simple <p>Loading...</p> into the body. After the WASM stuff loads and shows up, the text Loading... is still there. (Note that to make it show up, you have to move the mouse around the browser, this is a current limitation of the UI framework I am using I believe).

Do you get the same behavior? If yes, it might be an incompatibility with the UI framework.

ISibboI avatar Aug 31 '22 07:08 ISibboI

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

github-actions[bot] avatar Sep 22 '23 00:09 github-actions[bot]

This issue was closed because it has been stalled for 5 days with no activity.

github-actions[bot] avatar Sep 27 '23 00:09 github-actions[bot]