Caching to optimize JSS
To improve application performance, you can enable Sitecore output caching.
To enable Sitecore output caching refer to the documentation on how to configure HTML caching and HTML/component cache values.
Sitecore caching in JSS does not work the same way as it does in MVC.
In MVC, output caching saves the HTML that is returned by the renderRendering
pipeline for any rendering that has caching enabled. So on subsequent requests, you already have the HTML for the rendering and do not have to do any additional processing.
With output caching enabled when using JSS, Sitecore caches the JSON data returned by the Layout Service for any component that has caching enabled. The JavaScript layer takes that JSON as input and generates HTML on every request.
We recommend you avoid caching personalized components unless you added a custom way to fetch personalized data to the application.
We recommend you use HTTP headers informing browsers to cache static assets that do not change very often.
The following image illustrates the caching controls in Sitecore.

Refer to the following topics for information on caching while running the JSS application in headless server-side rendering mode or integrated mode: