Hacker News Reader

Comment by __s | Hacker News Reader

Modern reactive UI frameworks get away from maintaining virtual dom. If you want minimalist vdom preact is a great choice. If you'd like to part ways with vdom while keeping jsx, try svelte or solid-js

View on HN

Preact has signals now too if you're into that.

What are the long term theoretical benefits of vdom? Concurrent rendering?

At least with solid, you can't do `const a = <jsx>` without caveats. Instead you have to store it as `const a = () => <jsx>` (which isn't quite the same, having problems managing state/renders). In React I was optimizing things by storing vdom in state/memo & then interpolating that exact vdom. Or sharing vdom in multiple places. Without vdom you can't throw jsx results around so haphazardly

In solid there's also managing batching updates to reduce rerenders since it eagerly updates dom. It feels like one needs to be more meticulous

The flipside of this is that in React you are paying the cost of active vdom all the time, even when it doesn't pay off by optimizing large batched updates. In Solid, you sometimes have to optimize for some eager updates, true. That will have to be done at some point, though, when the situation calls for it - in either a specific or a general way. It feels natural to shift that optimization to the state layer, and completely eliminate the need for vdom, at the expense of some more thought and active, upfront work. It's a similar tradeoff to spending more time crafting static typing that works well, versus forgoing static types. The tradeoff seems to have good effect too - Solid seems much faster than React both on paper and in practice (my personal experience).

Your comment signals a key misunderstanding.

Doing a=jsx and interpolation does NOT touch the vdom in any way.

VDOM only comes into play for jsx returned from components before being rendered to screen.

Reply on news.ycombinator.com