JSS Sitecore -server side rendering vs client side rendering.
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)
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).
Reference: https://jss.sitecore.com/docs/fundamentals/application-modes