Skip to main content

Caching in headless server-side rendering mode

Abstract

Optimization recommendations for JSS applications in headless server-side rendering mode

If a server-side rendered JSS application in headless mode performs poorly, you can take the following actions:

  • Implement caching in the JavaScript layer. For example, you can:

    • Add memory caching to the Node server to save JSON for a route and reuse it.

    • Add memory caching to the Node server to save the HTML output of the entire route (all-or-nothing caching) in scenarios where caching the entire page is acceptable.

    • Dynamically prerender routes and save to Node memory on a regular interval.

    • If implementing a progressive web application, utilize service workers and browser cache strategies.

    Note

    When a page is server-side rendered, Node renders the entire page as one block of HTML, not as individual renderings.

  • Remove or customize the cache middleware. If you are server-side rendering your JSS application using the sitecore-jss-proxy sample, the application uses node-level output caching as implemented in cacheMiddleware.js . This middleware is applied when you start the application.

    Important

    With Node-level output caching users with different roles might see the same output. You must customize cacheMiddleware.js to add user identifier keys to the cache.