News for hackers. Stuff that matters.
Re:The Performance Cost of Server Side Rendered React on Nod... by kraftman on Monday November 20, 2017 @02:31PM (#15742466)
I thought the idea was to render it server side just once, then have the client take over for all future requests? In which case it's 10x slow for the first page load, but all future requests are just hitting API endpoints and can be fairly fast?
Re:The Performance Cost of Server Side Rendered React on Nod... by _greim_ on Monday November 20, 2017 @03:16PM (#15742839)
Correct, except that initial app load time for un-cookied users with cold browser caches is a critical metric, since it largely determines whether they'll keep using your app. Fortunately, those are the scenarios where server-side caching can have a decent benefit, since you're essentially rendering the same view to all such users.
Re:The Performance Cost of Server Side Rendered React on Nod... by rhizome on Monday November 20, 2017 @05:33PM (#15743957)
initial app load time for un-cookied users with cold browser caches is a critical metric, since it largely determines whether they'll keep using your app

This is "bounce before document.ready()?" How does it compare to "bounce before ad networks/API calls finish" and "bounce before end of autoplay video?"

I'm thinking that with all the other API goo in many mainstream/mass-media sites, "initial app load time" is something users are probably pretty tolerant of, unless "load time" includes stuff beyond the page becoming interactive.

Re:The Performance Cost of Server Side Rendered React on Nod... by _greim_ on Tuesday November 21, 2017 @11:27AM (#15748996)
> This is "bounce before document.ready()?"

Since we're talking about SSR which happens before anything else, latency is going to push out all load-time metrics equally.

> I'm thinking that with all the other API goo in many mainstream/mass-media sites, "initial app load time" is something users are probably pretty tolerant of

It's all relative. Presumably you're competing on some level with those mainstream/mass-media sites, so users will punish/reward you if your site takes more/less time to load than average.

Re:The Performance Cost of Server Side Rendered React on Nod... by Swizec on Monday November 20, 2017 @04:28PM (#15743461)
If all first time users see the same thing, why not serve a precompiled static html that then gets taken over by React.

Isn’t that the whole point?

Re:The Performance Cost of Server Side Rendered React on Nod... by wickedlogic on Monday November 20, 2017 @04:46PM (#15743595)
So very much this. Particularly if you dont have enough context to be personalized, pre-compiled popular segments are a reasonable approach.
Re:The Performance Cost of Server Side Rendered React on Nod... by dceddia on Monday November 20, 2017 @10:22PM (#15745265)
And if only a few things need to be customized, skeleton states can help bridge the gap.

https://css-tricks.com/building-skeleton-screens-css-custom-...

Re:The Performance Cost of Server Side Rendered React on Nod... by _greim_ on Tuesday November 21, 2017 @11:10AM (#15748815)
Yes, that's exactly what React SSR + caching accomplishes!
Re:The Performance Cost of Server Side Rendered React on Nod... by abritinthebay on Monday November 20, 2017 @05:32PM (#15743946)
> If all first time users see the same thing

That's a big, important, if.

Re:The Performance Cost of Server Side Rendered React on Nod... by _greim_ on Tuesday November 21, 2017 @11:32AM (#15749057)
It's good odds, though. Obviously depending on the app, these would be non-logged-in users who don't get personalized content.
Re:The Performance Cost of Server Side Rendered React on Nod... by abritinthebay on Tuesday November 21, 2017 @11:40AM (#15749130)
There can be (though you’d be surprised- there’s rarely such a thing as a non-identifiable user nowadays). Just pointing out it’s a very big conditional.

For example: I work at Bleacher Report and our non-logged-in users get data customized for them. That can be as simple as GeoIP data or can be us knowing (and inferring) what articles or content they’ve seen.

The permutations are quite large.

Now some blog, or a very simple app won’t do something like that (hell, they might not have the depth of content to be able to) but it’s reasonbly common to have that requirement on large sites outside of v.limited pages (like login/signup etc)

Re:The Performance Cost of Server Side Rendered React on Nod... by encoderer on Monday November 20, 2017 @07:26PM (#15744571)
Modern JS frameworks try to solve this problem by inlining critical CSS and JS into the head for anything above the fold, and loading the rest dynamically.
Re:The Performance Cost of Server Side Rendered React on Nod... by pure on Monday November 20, 2017 @08:18PM (#15744825)
Which frameworks do this?
Re:The Performance Cost of Server Side Rendered React on Nod... by encoderer on Monday November 20, 2017 @10:30PM (#15745298)
Re:The Performance Cost of Server Side Rendered React on Nod... by nathan_long on Monday November 20, 2017 @02:50PM (#15742653)
Sure, but every user has to do that initial page load. If all initial page loads are slow and expensive, it affects the user experience and costs money.

Also, if you start getting requests faster than you can do the initial render, each subsequent user has to wait in line longer than the one before. Your server-side framework won't even show you how long people waited for a TCP connection.

Re:The Performance Cost of Server Side Rendered React on Nod... by scyber on Monday November 20, 2017 @04:59PM (#15743696)
If the Server rendered page is not user specific and is generic for all users then it can be cached and served quickly. Then only potentially one user would experience a slowdown and you can serve much faster.

Of course then you get into the fun of cache management and invalidation.

Re:The Performance Cost of Server Side Rendered React on Nod... by nathan_long on Wednesday November 22, 2017 @09:18AM (#15756919)
Elixir Phoenix has a game-changing approach here because of how it compiles templates. Effectively, the static part is always cached (until the template changes), but the dynamic part is never cached. Nothing to manage.

See http://nathanmlong.com/2016/11/elixir-and-io-lists-part-2-io... for explanation.

Re:The Performance Cost of Server Side Rendered React on Nod... by kraftman on Monday November 20, 2017 @03:06PM (#15742775)
But they're going to have to wait for the initial page load either way, whether it's rendered server side and sent over or they're shown some static content until its rendered client side?
Re:The Performance Cost of Server Side Rendered React on Nod... by pmontra on Monday November 20, 2017 @03:08PM (#15742784)
They do, but the load will be spread among clients. The issue here is the load on the server.
Re:The Performance Cost of Server Side Rendered React on Nod... by kraftman on Monday November 20, 2017 @03:24PM (#15742900)
I guess it depends on which direction you're coming from. From a traditional server side point of view, you're reducing the server work to just that first page load and making the client do the rest.
Re:The Performance Cost of Server Side Rendered React on Nod... by nathan_long on Monday November 20, 2017 @04:24PM (#15743426)
True. But making all server-side renders really efficient and fast is an option, too. http://nathanmlong.com/2016/11/elixir-and-io-lists-part-2-io...