Ask HN: How to performance test React webapps for rendering speed regressions? • Hacker News Board

Re: Ask HN: How to performance test React webapps for rendering speed regressions?

#21

Post by badestrand » Tue, May 21, 2019, 6:59 PM UTC

mmckelvy wrote: post #15

> As React webapps get large and start to contain a lot of complex components, they often do not perform well and manifest low FPS in browser. Is this something you have actually experienced? Can you cite an example of running into this issue? I've built fairly complex UIs with React (tables with nested dropdowns, financial statements with a lot of data points, dynamic charts / graphs, elements with animations, etc.…

I'm not OP but at work we have a actually not-so-complex website that takes a full second to render a new page when switching, on my MacBook. On production and without loading anything via the network.

I blame it on create-react-app, which feels very very bloated to me. Whenever I write React from scratch it feels super performant, even with Redux and much more complex layouts than the page I mentioned.

Re: Ask HN: How to performance test React webapps for rendering speed regressions?

#22

Post by petetnt » Tue, May 21, 2019, 7:45 PM UTC

badestrand wrote: post #21

mmckelvy wrote: post #15

> As React webapps get large and start to contain a lot of complex components, they often do not perform well and manifest low FPS in browser. Is this something you have actually experienced? Can you cite an example of running into this issue? I've built fairly complex UIs with React (tables with nested dropdowns, financial statements with a lot of data points, dynamic charts / graphs, elements with animations, etc.…

I'm not OP but at work we have a actually not-so-complex website that takes a full second to render a new page when switching, on my MacBook. On production and without loading anything via the network. I blame it on create-react-app, which feels very very bloated to me. Whenever I write React from scratch it feels super performant, even with Redux and much more complex layouts than the page I mentioned.

Hi,

as a Create React App maintainer I'd love if you could share some scenarios where CRA itself would cause performance issues. CRA itself is mostly just developer tooling and every other feature is opt-in. The team and many contributors (including people on WebPack team) have spent quite a lot of time on optimizing the production builds CRA produces; building an React only app won't have much else than React and React-DOM itself, while we also automatically do more advanced things like bundle spitting too.

Re: Ask HN: How to performance test React webapps for rendering speed regressions?

#23

Post by zackify » Wed, May 22, 2019, 1:56 AM UTC

badestrand wrote: post #21

mmckelvy wrote: post #15

> As React webapps get large and start to contain a lot of complex components, they often do not perform well and manifest low FPS in browser. Is this something you have actually experienced? Can you cite an example of running into this issue? I've built fairly complex UIs with React (tables with nested dropdowns, financial statements with a lot of data points, dynamic charts / graphs, elements with animations, etc.…

I'm not OP but at work we have a actually not-so-complex website that takes a full second to render a new page when switching, on my MacBook. On production and without loading anything via the network. I blame it on create-react-app, which feels very very bloated to me. Whenever I write React from scratch it feels super performant, even with Redux and much more complex layouts than the page I mentioned.

Create React app includes almost no extra client facing code other than react. There is an issue with how you made the application.

Re: Ask HN: How to performance test React webapps for rendering speed regressions?

#24

Post by ggregoire » Wed, May 22, 2019, 2:26 AM UTC

badestrand wrote: post #21

mmckelvy wrote: post #15

> As React webapps get large and start to contain a lot of complex components, they often do not perform well and manifest low FPS in browser. Is this something you have actually experienced? Can you cite an example of running into this issue? I've built fairly complex UIs with React (tables with nested dropdowns, financial statements with a lot of data points, dynamic charts / graphs, elements with animations, etc.…

I'm not OP but at work we have a actually not-so-complex website that takes a full second to render a new page when switching, on my MacBook. On production and without loading anything via the network. I blame it on create-react-app, which feels very very bloated to me. Whenever I write React from scratch it feels super performant, even with Redux and much more complex layouts than the page I mentioned.

That's like saying VSCode makes your site slower.