fastdom VS mebm

Now, every time we read `offsetHeight`, the browser sees that it has a scheduled DOM modification to apply, so it has to apply that first, before it can return a correct value.

This is the reason that libraries like fastdom (https://github.com/wilsonpage/fastdom) exist - they help ensure that, in a given tick, all the reads happen first, followed by all the writes.

That said, I suspect even if you add a write followed by a read to your `while(1)` experiment, it still won't actually render anything, because painting is a separate phase of the rendering process, which always happens asynchronously. But that might not be true, and I'm on mobile and can't test it myself.

batching your writes & reads to the DOM (via FastDOM or a virtual DOM implementation).

For more information on how and why this works, and a more robust and complete implementation, check out the FastDom library: https://github.com/wilsonpage/fastdom - note that you might not need this particular optimization if you're using a rendering framework, which should already be doing these sorts of optimisations for you.

There's some work on this on the web space - our company is doing something not too dissimilar using the still experimental API called WebCodecs.

And that pretty much says everything unfortunately - it's still an experimental API with limited availability.

You can do some parts of this using Canvas[0] but there's lots of caveats.

[0] https://github.com/bwasti/mebm/tree/main

Oh hell yes!! Thank you so much for this. I was looking for an alternative to mebm.xyz after it went offline. Sometimes I need to edit something but I don't want to bother downloading Resolve onto whatever laptop I'm using, this looks great!

All the best! Maybe one day, you'll be able to create a browser-based video editor like this.

Open source is like communism, except more badass. It means that the code used to make this site is all publicly viewable for any autistic computer nerd to look through. You can find the source code here: https://github.com/bwasti/mebm

code here: https://github.com/bwasti/mebm

https://github.com/bwasti/mebm/blob/main/script.js#L1149

code: https://github.com/bwasti/mebm

The source can be found here: https://github.com/bwasti/mebm