DOM in React and Angular: Which one is Better?

adisharma

n00b
Joined
Apr 17, 2020
Messages
5
Hello All, I want to know which one is better for DOM point of view between angular and react? Like this post, Virtual DOM – anytime the DOM changes, a new virtual DOM is created, compared to the previous one, and only the differences are modified in the “real” DOM but not an idea about angular? Can anyone explain me?
 

Absalom

Gawd
Joined
Oct 3, 2007
Messages
928
Better as in performance tradeoffs? Because they are conceptually the exact same thing. There's really only one DOM, regardless of what goes on behind the scenes. Either API will only ever provide a singular DOM abstraction for manipulation. Everything going on under-the-hood is implementation detail.

From a framework design standpoint, a Virtual DOM seems a lot less complex to implement and easier to test. Probably less code too. But I say leave that worry to the Google and Facebook engineers.

Without benchmarking, it's hard to say which method is better performance-wise. If the DOM is large enough and there aren't too many edits, a Virtual DOM could potentially result in unnecessary memory backpressure for the garbage collector. On the other hand, having to scan through the (direct edit) DOM for a myriad of edits could entail significant processing overhead.

Given such contrived examples, there might be a performance tradeoff... but only if the DOM is significantly large. I'd say for 99% of real world scenarios, they perform nearly the same. We are talking strictly client-side performance here, btw. And these days you have hardware ranging from the lowest of cellphones all the way up to desktop PCs with absurd amounts of resources. Performance metrics probably mattered more so 10 years ago.

To the average web developer, the type of DOM manipulation (direct edit vs virtual) is largely irrelevant. If you're running into performance scenarios where fast rendering of the DOM becomes important, you should look into other technologies such as WebGL. But such scenarios are extreme and rare.

TLDR;

I wouldn't choose one API over the other based on DOM manipulation talking points.
 
Top