Is postMessage slow? - HTTP 203

[@LewisCowles]

Feel like the world needs a show with just Surma as well. They are so pleasant and energetic. Like the happiest worker on the deathstar. Totally removed from planet and rebel killing, working on tooling.

[@forceboxed]

I loved this episode! You guys have great chemistry and I always find your videos kinda inspiring.

[@hypersonic12]

Great video! Thanks for providing the view into the development process for Proxx. A while ago I was trying to figure out how to send potentially megabytes of data using postMessage in a performant way for my day job....the end result was that we should come up with a better architecture that doesn't store that much data in the main thread. :)

[@dassurma]

For really big payloads ArrayBuffers + a serialization format like CBOR, BSON or FlatBuffers can be helpful. But in general I’d agree with you and advise to reduce the data required to be sent at once :D

[@SimonBuchanNz]

Or SharedArrayBuffers, and start that nightmare 😭

[@samuel.00]

"Today on Blackshirt and Greyhood"

[@jakearchibald]

I promise there's a radical wardrobe change in the next episode¹ ¹ This is a lie

[@rongsenng]

2:08 why Comlink.wrap() instead of wrap()?

[@dassurma]

Mostly cause I'm bad at copy/pasting 🙄

[@arodic]

Cool research! Have you considered putting entire game state into WebGL buffer? Theoretically, this entire game could be run on the GPU using a few simple shader programs.

[@forceboxed]

Whoa!

[@LuLeBe]

For a minesweeper clone, even the current method seems way overengineered. You're taking it to the next level :D

[@PabloNevares]

Since the idea of a RAIL budget isn't well-known and the captions weren't sure if it was heard correctly at 12:49, here's further reading for anyone interested: developers.google.com/web/fundamentals/performance/rail

[@shifteleven]

Hey. I read that blog post and I liked it. It had me doing one of those Todo apps where Redux was in a Worker - simple and overkill, but still interesting.

[@dassurma]

I don’t know if you saw, but that’s legit what I did as well :D dassur.ma/things/react-redux-comlink/

[@DrRobrez]

Neat, thanks for sharing your research

[@MaxArt2501]

Now, which one of you decided it was a good idea to switch to flag mode with a double tap in Proxx? It always gets in the way of me breaking the 2 minute limit in hard mode!

[@MaxArt2501]

Sorry, reading this comment again it sounds way more aggressive than I thought! Actually it's just a minor annoyance, and I'm actually enjoying Proxx a lot (also I've had a minesweeper addiction in the past but that's another story). I think it's a great project with a lot of interesting techniques used under the hood. About the double tap, maybe I'll open a PR about it 👋

[@swantzter]

Also Yay, finally a new podcast episode!!

[@nir8924]

17:17 what about using shorter key names ? Won't it make the serialized payload small enough ? (I mean, yes, it's very specific to the example, but still something to consider right )

[@dassurma]

Yeah, that would have been one optimization, but it felt more like a band-aid fix rather than properly decoupling performance from payload size.

[@nir8924]

​@@dassurma yeah I think I get what you're saying. it's an optimization, not a solution. in a large app with many models it'll become a burden. thanks for the video, it was very informative! 47 FTW :)

[@RichardGustin]

What about SharedArrayBuffer? it does not carry the expensive structured clone hit, since it is available in both/any/all web/service workers and the main process....

[@stepans2167]

You'd have to serialize/deserialize the object to put it there anyway

[@NanobyteOnline]

hahaha, i didnt notice he said 74ms instead of 47ms, im german xD

[@Surefire99]

I know it's not really in the spirit of this video, but I'm curious if for Proxx you considered not saving the state of the game, but rather the initial configuration plus all the actions taken? Which you could use to recreate the current state by running all the game logic as fast as possible (sans animation). I believe you would achieve really great game play performance since every action only sends data on which cell and which action was taken. Maybe you wouldn't even need a worker at that point. The trade off would be slower resume times, but as a user I'd find that acceptable because I'd expect the game play to be smooth, but the resume to take some time because that will either happen very infrequently or never. I believe this is somewhat similar to how Google Docs manages collaborative edits.

[@LuLeBe]

I don't think they need a worker right now either. They use it because it's a demo app for modern web tech.

[@LuLeBe]

I wonder why you use workers in prox. I mean you probably did because it's a demo app and you wanted to show it, but is managing the game state on the main thread really such an issue? If it is, you could use your 10 changes per frame animation trick as well, and surely you'd be fine. Only issue is scrolling the game field anyways. Everything else doesn't happen before the state is updated: User clicks -> state update (either on worker or UI thread) -> new state renders -> User clicks again etc. The only thing that a blocked UI thread would inhibit would be scrolling while the state update is calculated.

[@FireNeslo]

I still prefer using workers for more long running code, then just spit out some result at the end. I do like the idea of being able to parallelize more though. Most of the time its more work in the ui update code than the state update code, so its mostly that code that would be nice to get out. with virtual dom you can achive that but I need a vdom with support to do serialized hooks of some sort, so i can do more complex dom effects. Vent listeners are also a bit tricky but using some sor of convetion i could probably do something declarative for transferring the event to the correct controller. Othewise vdom fits nicely with the idea just creating chunks of dom diffs and send them over.

[@renancaldas7251]

Awesome talk! I'm currently using postMessage for communicating with Service Workers. Looking forward to use comlink in order to off-load the main thread :)

[@AlexanderCerutti]

05:06 Little note as of 2022: now we have structuredClone, yay! 🎉

[@victornpb]

I'm curious about the queue loop on the worker thread, if instead of sending lots of data, you spam the queue with a ton of small messages.

[@dassurma]

What are you curious about specifically ? That definitely works as well :)

[@DenisTRUFFAUT]

Conclusion : If you use lots of animations, especially looping ones, you'd be particularly interested to offload code in the worker. There is no excuse, except for the 10kB message limit, to not offload code in the worker.

[@omri9325]

Good conclusion

[@perguth]

✨

[@driziiD]

take-away: read the spec!

[@ahmadhosafy]

Actually Arabic numbers work the same as German ones 😅

[@forceboxed]

Even Hindi numbers kinda work the same way.

[@duncan-dean]

14th! ;/

[@LarsRyeJeppesen]

Very informative. And yes it's slow.

[@dassurma]

So, let me get this straight: You posted your comment to this *20 minute video* about 1 minute after we uploaded it and then say the *exact opposite* of what’s in the video?

[@LarsRyeJeppesen]

@@dassurma Yes lol.. I gave up trying to do it because of the complexity and serialization stuff ;) ,... I'm 7 mins into the video btw so far... :) ... getting interesting /s

[@GifCoDigital]

I want to live in a world where semicolons dont exist!!