Blaze 6x faster than React in a realistic benchmark

3,270 views
Skip to first unread message

Avital Oliver

unread,
Mar 7, 2014, 2:23:54 PM3/7/14
to meteo...@googlegroups.com
(This email isn't to say that we're not investing in performance -- we know that there's a regression when rendering lists of new items and have solid ideas on how to address that)

Ok, so React and Ember (with their new HTMLBars engine) are competing with each other on this benchmark suite with 200 moving circles: http://jsfiddle.net/Ut2X6/

Blaze performs more poorly than both on the same suite (by an order of 2 or so). But the truth is that this benchmark isn't very realistic -- most user actions do *not* cause every element on the page to be updated. Moreover, that benchmark is skewed towards React since React diffs the virtual DOM so it doesn't get that much faster if you only update one element.

So I modified their benchmark to be more realistic - there are 200 circles but only one moves: http://jsfiddle.net/PgEQN/

And here's the Blaze version (...wouldn't it be nice to be able to use Blaze in JSFiddle?): http://blaze-speed.meteor.com/. Here's the source code.

The numbers that I get are:
- Raw (direct DOM manipulation): 0.12ms per loop
- Ember (with HTMLBars): 1.10ms per loop
- React: 3.16ms per loop
- Blaze: 0.52ms per loop

This is exciting!

Josmar Dias

unread,
Mar 7, 2014, 2:52:20 PM3/7/14
to meteo...@googlegroups.com
Avital, 

I think both "update  all circles" and "update just one circle" are extremes.
In any case, I agree that your benchmark is more reliable, cause the second extreme case happens a lot more often than the first one.

So, great news!

Arunoda Susiripala

unread,
Mar 7, 2014, 6:37:58 PM3/7/14
to meteo...@googlegroups.com
This is very good news Avital.
Since Blaze it very very easy to use than other, this would be really nice to hear.


--
You received this message because you are subscribed to the Google Groups "meteor-core" group.
To unsubscribe from this group and stop receiving emails from it, send an email to meteor-core...@googlegroups.com.
To post to this group, send email to meteo...@googlegroups.com.
Visit this group at http://groups.google.com/group/meteor-core.
For more options, visit https://groups.google.com/d/optout.



--
Arunoda Susiripala

steeve

unread,
Mar 8, 2014, 6:52:38 AM3/8/14
to meteo...@googlegroups.com
Rad!  

Josmar is right, it is more realistic that updates will involve more than one, some, but not all.

Andrey Popp

unread,
Mar 11, 2014, 6:16:29 PM3/11/14
to meteo...@googlegroups.com
Hi,

Blaze looks awesome (and performs too), but just to for the sake of "fairness" of the benchmark, I'm going to show, how to slightly modify React code so it becomes faster than Blaze.

This is the updated jsfiddle, http://jsfiddle.net/xM4Bu/ — 0.25ms with React vs. 0.63ms with Blaze on my MBA. Note, that I believe that such solution is also an idiomatic solution for React.

Andrey Popp

unread,
Mar 11, 2014, 6:28:38 PM3/11/14
to meteo...@googlegroups.com
Another version of React benchmark which animates every second box — http://jsfiddle.net/xM4Bu/1/ — this is even faster — 0.17ms per loop, why? I don't, probably JIT warms up faster. Note, that there's no added complexity, I just specified animate=true for every even index.

Andrey Popp

unread,
Mar 12, 2014, 2:45:04 AM3/12/14
to meteo...@googlegroups.com
Ah, sorry, the last one is incorrect.

Charles Short

unread,
Mar 12, 2014, 2:15:39 PM3/12/14
to meteo...@googlegroups.com
See benchmark of 1 to 23 circles:

Reply all
Reply to author
Forward
0 new messages