4 ms·

The headline should've been "it takes 150ms to do server-side rendering with React," not, "hey everyone I can put something in Redis." I would _not_ take this p

The headline should've been "it takes 150ms to do server-side rendering with React," not, "hey everyone I can put something in Redis." I would _not_ take this person's advice. There's most likely something else really wrong with their code. Also.... 20ms with caching the pages in Redis? That sounds really, really slow. There's definitely something else going on.

andrewingram 10y ago
150ms is pretty standard server-side rendering React for a relatively simple page, but it scales pretty predictably with the complexity of the component tree. Obviously there are some caching strategies available, but I think the only real solution is going to come from serious investment in the problem from the React side. I can't see the core devs tackling it, because Facebook doesn't require it, but maybe the community can step in.
- tracker1 10y ago
  I feel that the tooling that Walmart Labs released (electrode) fills a lot of this void. The TL;DR of the article is really, "cache effectively." Which is true of so many things at scale.
  - andrewingram 10y ago
    Yes and no. I've been trying out their tools and whilst they do help a bit, the mileage varies and integration is quite invasive if you want decent results.
    - tracker1 10y ago
      Fair enough... but moving past bottlenecks with any platform tends to be so.
- flukus 10y ago
  Really? Because that is absolutely awful compared to other tech stacks, even other tech stacks from more than a decade ago.
  - andrewingram 10y ago
    That's because React isn't designed for server-rendering. It's able to do it, but if you expect the same performance as as traditional template engines you're going to have a bad time.
    - flukus 10y ago
      So why are people using server side react then? Is it any faster client side, because that would also be very slow?
      - mercer 10y ago
        One benefit is that you can render server-side and seamlessly take over on the client-side without needing a re-render. Another benefit is simply React's component-based approach itself. I once went as far as using React for wordpress templating just because I prefer its approach to the standard WP <?php echo $blah ?> shit. I wouldn't recommend that to others though.
ubersoldat2k7 10y ago
Exactly! Why would you even drop down into Node when Apache already has page caching or when you can throw any other caching server in the middle... What a bunch of nonsense.
- ateevchopra 10y ago
  ubersoldat2k7, beacause it produced results, with minimum hassles. Heres' a comment from reddit I would like to share Cloudflare only caches about 30% of your requests for a major site. If you're small, they'll get everything, but every CDN has limits on how much of your data they keep on edge. As a free CDN, Cloudflare has pretty stringent limits. Also there's the issue of cache invalidation, which is a lot easier if the cache is something that you control totally yourself. Additionally, a local cache can help you save partial content, which is the next step in any 'make this site fast' strategy. Hope it helps.
alexanderdaw 10y ago
Yes.
abritinthebay 10y ago
> The headline should've been "it takes 150ms to do server-side rendering with React" Which, given I'm seeing much much less for a rather complex React app... makes me suspicious that something else is going on with their codebase. I'm seeing maybe 150ms as the upper 95 percentile but median would be 30-60ms and my app isn't exactly small or simple.
ateevchopra 10y ago
misterbowfinger, I Would love to see your solution. Can you make it sub 10ms ? That would help us a lot. BTW have you ever worked with SSR and React ? 150ms is pretty standard time it takes to render a page with SSR. And as mentioned in the post, the 150ms is what we are getting. This is purely dependent on your project. For example, a simple "hello world" page might take a lot less than a full page with lots of components. And 20ms is the total response time for the page. Redis takes just 2-3ms of it.
- misterbowfinger 10y ago
  > And 20ms is the total response time for the page. Redis takes just 2-3ms of it. If you're properly using Redis, then the total response time should be 2-3ms, or at least very close to that. > BTW have you ever worked with SSR and React I haven't - I was hoping the article would shed light on it. The top comment seems to have some great suggestions. There's probably a lot of optimizations one can make at the React/Redux level.

andrewingram 10y ago

150ms is pretty standard server-side rendering React for a relatively simple page, but it scales pretty predictably with the complexity of the component tree. Obviously there are some caching strategies available, but I think the only real solution is going to come from serious investment in the problem from the React side. I can't see the core devs tackling it, because Facebook doesn't require it, but maybe the community can step in.

tracker1 10y ago
I feel that the tooling that Walmart Labs released (electrode) fills a lot of this void. The TL;DR of the article is really, "cache effectively." Which is true of so many things at scale.
- andrewingram 10y ago
  Yes and no. I've been trying out their tools and whilst they do help a bit, the mileage varies and integration is quite invasive if you want decent results.
  - tracker1 10y ago
    Fair enough... but moving past bottlenecks with any platform tends to be so.
flukus 10y ago
Really? Because that is absolutely awful compared to other tech stacks, even other tech stacks from more than a decade ago.
- andrewingram 10y ago
  That's because React isn't designed for server-rendering. It's able to do it, but if you expect the same performance as as traditional template engines you're going to have a bad time.
  - flukus 10y ago
    So why are people using server side react then? Is it any faster client side, because that would also be very slow?
    - mercer 10y ago
      One benefit is that you can render server-side and seamlessly take over on the client-side without needing a re-render. Another benefit is simply React's component-based approach itself. I once went as far as using React for wordpress templating just because I prefer its approach to the standard WP <?php echo $blah ?> shit. I wouldn't recommend that to others though.

ubersoldat2k7 10y ago

Exactly! Why would you even drop down into Node when Apache already has page caching or when you can throw any other caching server in the middle... What a bunch of nonsense.

ateevchopra 10y ago
ubersoldat2k7, beacause it produced results, with minimum hassles. Heres' a comment from reddit I would like to share Cloudflare only caches about 30% of your requests for a major site. If you're small, they'll get everything, but every CDN has limits on how much of your data they keep on edge. As a free CDN, Cloudflare has pretty stringent limits. Also there's the issue of cache invalidation, which is a lot easier if the cache is something that you control totally yourself. Additionally, a local cache can help you save partial content, which is the next step in any 'make this site fast' strategy. Hope it helps.

alexanderdaw 10y ago

Yes.

abritinthebay 10y ago

> The headline should've been "it takes 150ms to do server-side rendering with React" Which, given I'm seeing much much less for a rather complex React app... makes me suspicious that something else is going on with their codebase. I'm seeing maybe 150ms as the upper 95 percentile but median would be 30-60ms and my app isn't exactly small or simple.

ateevchopra 10y ago

misterbowfinger, I Would love to see your solution. Can you make it sub 10ms ? That would help us a lot. BTW have you ever worked with SSR and React ? 150ms is pretty standard time it takes to render a page with SSR. And as mentioned in the post, the 150ms is what we are getting. This is purely dependent on your project. For example, a simple "hello world" page might take a lot less than a full page with lots of components. And 20ms is the total response time for the page. Redis takes just 2-3ms of it.

misterbowfinger 10y ago
> And 20ms is the total response time for the page. Redis takes just 2-3ms of it. If you're properly using Redis, then the total response time should be 2-3ms, or at least very close to that. > BTW have you ever worked with SSR and React I haven't - I was hoping the article would shed light on it. The top comment seems to have some great suggestions. There's probably a lot of optimizations one can make at the React/Redux level.