The main problem is that JS runs in a single thread and blocks the browser. Browsers jump through a ton of hoops to do scrolling and rendering on background threads while still allowing JS hooks and callbacks as required by web standards.
But, I think it's really the ONLY problem, and if you solve that problem, doing this stuff in JS would be the right answer. You'd be much more likely to get consistent behavior everywhere, without browser-specific quirks.
And part of the solution exists already! JS doesn't have to block the main thread any more, because you have things like Web Workers and WebAssembly.
Rather than adding another specific layout type, we should add a general-purpose way of hooking into the layout engine from a background task.
You can actually make a working masonry layout with css alone(even make it work with browser resize), if you do know the aspect ratio of each item. The hard part is handling the column count change and item prepend/insert because that would always require js to do.(since tha would change the position and column of every item)
There is no logic of js required to do handle whatever screen resize.
But, I think it's really the ONLY problem, and if you solve that problem, doing this stuff in JS would be the right answer. You'd be much more likely to get consistent behavior everywhere, without browser-specific quirks.
And part of the solution exists already! JS doesn't have to block the main thread any more, because you have things like Web Workers and WebAssembly.
Rather than adding another specific layout type, we should add a general-purpose way of hooking into the layout engine from a background task.
Update to add: just saw from another comment in this thread that there's already an effort underway to do this, called Houdini: https://news.ycombinator.com/item?id=40130487 Cool!