2022-05-04
2020
#nextjs#react
Muhammad Muhsin
2074
May 4, 2022 ⋅ 7 min read

Improve app performance with React server-side rendering

Muhammad Muhsin Fullstack engineer, writer, speaker, and open source contributor.

Recent posts:

Typescript or Zod for Validation?

TypeScript vs Zod: Clearing up validation confusion

Learn when to use TypeScript, Zod, or both for data validation. Avoid redundant checks and build safer, type-sound applications.

Alexander Godwin
Oct 6, 2025 ⋅ 3 min read
Wasm 3 Before GTA 6 LogRocket Article

We got Wasm 3.0 before GTA 6: Meet the web’s new engine

Discover how WebAssembly 3.0’s garbage collector, exception handling, and Memory64 transform Wasm into a true mainstream web platform.

Ikeh Akinyemi
Oct 3, 2025 ⋅ 2 min read

How to use AI to build accurate ShadCN components

AI agents often break shadcn/ui components with outdated docs or made-up props. The MCP server fixes this by giving live access to registries. In this tutorial, we’ll set it up and build a Kanban board to show it in action.

Chizaram Ken
Oct 3, 2025 ⋅ 5 min read
Rust Project for Web Services LogRocket Article

The best way to structure Rust web services

Learn how to structure Rust web services with clean architecture, Cargo workspaces, and modular crates for scalable, maintainable backends.

Jude Miracle
Oct 2, 2025 ⋅ 2 min read
View all posts

11 Replies to "Improve app performance with React server-side rendering"

  1. Thank you! That was very helpful to understand SSR, especially with the framework recommendations.

  2. I don’t see why client-side rendered apps should not be able to include social meta tags or (limited) onpage seo.
    A bundled react app is embedded to an html page, so you could just include these in the wrapping html. You’re right about the dynamically rendered content inside of the react app though.

  3. “However, now, server-side rendered React apps use Node for the server, which is a key difference from traditional server-rendered apps (we’ll see how later on in this post).”
    In which way is that a key difference?

  4. Thanks for your comment, Mike!

    The main difference as a I see it: when you load React only on the client-side, it means your JavaScript files have to be loaded into your browser before it starts making calls – for example, to remote APIs. When it runs on the server-side, we can make those calls in the server and give the results from those calls in the initial render itself.

  5. Hello @muhammad Mushim,

    Is react by default server side or client side ?, I am new to react so please need your assistance

  6. As Mike mentioned, the sharing “issue” is very easily fixed with proper meta tag usage in a client-side rendered application. The line “This will not be possible when you have just client-side rendered apps.” in this article is just dead wrong in reference to social media sharing.

    1. what exactly is ‘proper usage’? just throwing meta tags in index.html in the public folder? good luck with that if you have multiple pages. react-helmet adds meta tags to other routes but none of the social media sharing sites can read from it since its client side.

  7. just 1 doubt,

    let say i have loaded the page with all the customer list using server side rendering and now i want to click on the customer and get the result of that customer by sending the customer ID in the payload (in the post api call). In this scenario how can we achieve this subsequent api calls as a server side rendering and without downloading the complete html page aging i just want to hydrate a piece of html page (the user info for the user which i have clicked) just below that clicked user ??

    is there a way to achieve this using server side rendering ?
    i know we can do this using client side rendering using vanilla reactjs

    thanks in advance 😀

Leave a Reply