2

Please illuminate main differences between server side rendering and client side rendering for JSS app?

Is server side rendering only required for things which are tightly couple with Sitecore like Experience Editor to use through JSS app?

What are the use cases to use both type of renderings?

2
  • Server side rendering: Server-side JavaScript rendering enables execution of the same JS application you run in dev but now within Content Management environment running full Sitecore instance. In this case you will be hitting app with-in Sitecore instance. In other case "Client Side Rederning", app will be running in the node js server context not Sitecore context.
    – Amit Kumar
    May 20, 2019 at 11:25
  • See medium.freecodecamp.org/… in addition SSR also hides your business logic, endpoint, config from the end user. which is create for security. May 20, 2019 at 11:29

1 Answer 1

4

I am new in JSS world, trying to jump into JSS pond.

Below are differences:

Client-side rendering- your browser downloads a minimal HTML page. It renders the JavaScript and fills the content into it.

Rendering performed by the browser.

Data comes from Sitecore via LayoutService/DictionaryService/GraphQL APIs via HTTP.

See below diagram(Connected mode)

enter image description here

Server-side rendering- on the other hand, renders the components(React) on the server. The output is HTML content.

The application is server-side rendered (SSR) by the Sitecore instance, meaning complete HTML is delivered to the user without any initial JS execution on the client.

This mode allows your Sitecore users to manage content, presentation and other marketing features for your JSS app using Sitecore's Experience Editor.

Rendering performed by server (SSR by Node instances orchestrated by Sitecore) Data comes from Sitecore LayoutService, passed from Sitecore to Node with no extra HTTP call.

Via Sitecore configuration files, you can configure the Node.js instance used for server-side rendering.

Usage: Content Management/Authoring server, production Content Delivery server (if not using headless hosting).

See below diagram(Integrated mode).

enter image description here

Reference: https://jss.sitecore.com/docs/fundamentals/application-modes

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.