How to win in Web Framework Benchmarks


Lets start from one of the worst benchmarks. I wrote this benchmark when I’ve started to work on my own Virtual DOM implementation.

A: [a b c d e f g]
B: [a b f d c g]
A: -> [a b c d e f g] <-
B: -> [a b f d c g] <-
A: -> [c d e f] <-
B: -> [f d c] <-
A: -> [d e]
B: -> [d]
A: [e]
B: []

JS web frameworks benchmark

This benchmark is significantly better than vdom-benchmark, because its result isn’t just a javascript execution time, it also measures recalc style, reflow, paint, composition etc. But it is also a synthetic test with all its downsides.

for(let i=this.rows.length-2; i>=idx;i--) {
let tr = this.rows[i];
let data =[i+1];
tr.data_id =;
tr.childNodes[0].innerText =;
tr.childNodes[1].childNodes[0].innerText = data.label;[i] =[i];
}[idx].id);, 1);
A: [a b c d e f]
B: [f b c d e a]
A: [a b c d e f]
B: [b c d e f a]


Another benchmark that I’ve created, the same problems as all benchmarks. I just wanted to measure more test cases with components overhead, etc.

Repaint Rate Challenge

There are no special ways to get the best results in this benchmark, except some obvious cheaters that are using setImmediate, or sending messages from WebWorkers that invoke ping(), while main thread is completely blocked by “amazing” WebWorker implementation.

Benchmark games

All this is just a benchmark games, and nobody should take seriously any numbers in this benchmarks. They are useful for web framework authors, and to those who deeply understand all internals, tricks and “cheats” that are used in them. Don’t use numbers from any web framework benchmarks to make a decisions when you are choosing a framework or a library.



Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store