https://kotlinlang.org logo
Join Slack
Powered by
<https://wasm.confetti-app.dev/> updated with vers...
# confetti
j
https://wasm.confetti-app.dev/ updated with version that now displays profile photos (proxying requests through Confetti backend to avoid CORS issues)
🎉 3
b
This is great! 👍
b
👏
It looks like your server doesn’t support compression
It would be nice to add some splashscreen or progress indicator
^^ the first load is notably slow
j
Yeah, definitely....a few others have commented on that too
@mbonnin are you familiar with changes we'd need to add to support compression?
b
Adding 
<meta name="viewport" content="width=device-width, initial-scale=1" />
into head block of html may improve scaling on mobile devices
j
Thanks, will try that....going to also try to make it more adaptive e.g. go back to showing list as screen size changes.
something along lines of what's done in ClimateTrace using KMP version of WindowSizeClass library
Screen Recording 2024-04-22 at 14.10.11.mov
and for example, in case of Confetti, not use nav rail with smaller szies
m
are you familiar with changes we'd need to add to support compression?
Like content-type: gzip?
Looks like we can do so by storing pre-compressed data in the bucket: https://cloud.google.com/storage/docs/transcoding#decompressive_transcoding
j
nice!
@bashor I updated to make more adaptive and also added 
<meta name="viewport" content="width=device-width, initial-scale=1" />
https://wasm.confetti-app.dev/
👍 1
it's not opening on mobile still here for some reason but maybe some caching issues
even on desktop I'm occasionally getting following for some reason ...
Copy code
async module:53 Uncaught (in promise) LinkError: WebAssembly.instantiate(): Import #79 module="js_code" function="org.w3c.dom.innerWidth_$external_prop_getter": function import requires a callable
Loading now.... still getting that whitespace for some reason
b
👍 Looks better on mobiles now
I think you can remove form html following 
<script type="application/javascript" src="skiko.js"></script>
👍 1
and it may help to remove unnecessary downloads (skia.wasm downloded twice)
j
what's causing that?
b
skiko.js triggers downloading skiko.wasm
js file generated for K/Wasm imports all dependencies so adding that js (or Webpack generated one) should be enough. Under the hood it will download required js and wasm files.
👍 2
https://kotlinlang.slack.com/archives/C051P2HUVKP/p1713812152648399?thread_ts=1713770700.950319&amp;cid=C051P2HUVKP 🤔 Looks strange, try to do Hard Reload (in Chrome desktop you can find it in context menu of refresh button)
j
yeah, refresh seemed to get around that when it happened
haven't seen it in a while....maybe some transitional thing when new version deplooyed
b
Further small improvements: • favicon / icon to make it nicer and more distinguishable 🙂 • manifest.json to make installable
j
cool, will add those...in meantime I just deployed new versino that has that line you mentioned above removed
@mbonnin think we can make 16x16 version of the confetti logo 🙂
😄 1
b
16x16 might be too small
esp. on retina
j
ah, maybe I misread what was needed for favicon
skiko.wasm
is 8mb so not downloading twice should definitely help 🙂
b
(JFTR: I still don’t see updated version)
j
ah, it was 
skia.wasm
you mentioned above
😀 1
it seems to take a little while after version deployed before it's avilable
seeing it now
b
Compression could also reduce download size for wasm files 2-3 times
j
yeah, we must definitely look in to that
are there any of the wasm samples that use manifest.json right now?
b
j
That's in place now for Confetti
🚀 2
@bashor do you know of any Compose for Web examples where some kind of loading UI is shown while wasm code etc is loaded?
b
You can just put an image or animation to the html. Example.
👍 1
It could be css as well, like here or here
Jetsnack is showing progress bar during preloading images, but obviously it works only after wasm fileas are loaded. Code is here.
j
I've updated with splash screen approach for now (https://wasm.confetti-app.dev/)
👍 1
9 Views
Open in Slack
PreviousNext
Powered by