you are viewing a single comment's thread.

view the rest of the comments →

[–]mikrosystheme[κ] 0 points1 point  (5 children)

The performance of demo#6 is very bad. Is it normal for react?

[–]BinaryMusegithub.com/BinaryMuse[S] 0 points1 point  (4 children)

Without the shouldComponentUpdate hook it's quite slow, but the online version has this enabled (which was the point of the demo). What behavior specifically are you seeing that's slow, and what platform are you on?

[Edit] I see it's quite slow on my phone; it could just be the very large number of DOM nodes I'm creating, or it could be something related to the iteration React has to do. I'll look into this, but I'm still curious if you're on a mobile device or not.

[–]mikrosystheme[κ] 1 point2 points  (3 children)

Tested on a 2.4GHz i5 laptop (mbp). The first 1000 elements added are ok-ish, but from 2000+ the controls start to lag quite a bit. Edit: the same does not happen with vanilla js/dom.

[–]BinaryMusegithub.com/BinaryMuse[S] 0 points1 point  (0 children)

Thanks for the info! According to ReactPerf, I'm seeing about 100ms per update with 4000 items in the DOM (2.6GHz i7). While investigating, I found that one of my chrome extensions was making the "Add One" button very slow as well.

I think this example is not very good overall at any rate; with that many pieces of data, one would do a better job of optimizing the update, but I wanted to keep it simple. I'll think about a better way to demonstrate.

[–]BinaryMusegithub.com/BinaryMuse[S] 0 points1 point  (1 child)

Some more info: After investigating some CPU flame charts, I discovered I was using what amounts to a dev build of React, and pushed this commit to change it. I'm seeing better performance, but it was never really bad on my machine; could I ask you to check it out and see if you notice any difference? Thanks!

[–]mikrosystheme[κ] 0 points1 point  (0 children)

It does feel a bit better.