Loading…
React Virtual DOM performance #5024
3 participants
This benchmark is a tool for library authors. If you don't know about internals of different implementation, there are zero value in this numbers. Especially overall time, I really don't like "overall time", but some library authors are using it, so they can easily track regressions.
And this benchmark is testing only how fast is children reconciliation algorithm with simple nodes (without any attributes, styles or events). There are also some problems with this benchmark, for example, dom operations on dirty nodes are way much faster in Chrome, if we add raf between iterations, the difference between libraries will be way much smaller, because dom ops will be significantly slower ( http://jsfiddle.net/67jz79n2/3/ ).
Also, InfernoJS is using caching, so it creates html nodes faster than it is possible with simple for loop, I am not sure that this forms of caching is good for real use cases, but it will certainly win all microbenchmarks.
From my experience, React performance is good enough for almost all use cases in dynamic SPA.
p.s. I am the author of this benchmark.
@cosminnicula React's virtual dom diffing does things like guaranteeing that if a node with a particular type-keyPath-pair appears in both the first and second render, the DOM nodes will be reused (thus preserving imperatively added children, etc). This is a serious expense that inferno doesn't incur because they are using simple templating and can just throw away nodes if it's too inconvenient/expensive to calculate an absolutely minimal diff. This is just one of many key differences.
One might argue that the performance differences exceed the value of the additional features in React, but that's a different argument. It's hard to know one way or the other. In practice, React is pretty fast for most real-world applications, and we think the features we support are valuable.
This is why we only use perf tests for regression testing, and not to compare frameworks. I have a post here in #4974 (comment) which touches on the topic in detail.
Myth busted :) Thanks!
I've found a website comparing the performance of the Virtual DOM implementations in different libraries like uix, cito.js, bobril, deku and others.
Here's a screenshot with the benchmarks for these libraries (the lower the score, the better the performance):
Seems that React has the highest score (lowest performance) and InfernoJS has the lowest score (highest performance).
The benchmarks can be run here http://vdom-benchmark.github.io/vdom-benchmark/
Is there a way for React to use InfernoJS' vDOM implementation and increase its performance?