Caching in Salesforce Lightning Components

Caching Data at the client side can significantly reduce the number of server round-trips and improve your Lightning components’ performance. Using the Lightning Component Framework, you can access server data using server actions or the Lightning Data Service. Server actions support optional client-side caching, and the Lightning Data Service is built on top of a sophisticated client caching mechanism.

Disable the secure and persistent browser caching setting during development in a sandbox or Developer Edition org to see the effect of any code changes without needing to empty the cache.

The caching setting improves page reload performance by avoiding extra round trips to the server.

Disabling secure and persistent browser caching has a significant negative performance impact on Lightning Experience. Always enable the setting in production orgs.

1. From Setup, enter Session in the Quick Find box, and then select Session Settings.
2. Deselect the checkbox for “Enable secure and persistent browser caching to improve performance”

3. Click Save.

In Lightning terminology, a server action is an Apex method that you invoke remotely from your Lightning Component. A storable action is a server action whose response is stored in the client cache so that subsequent requests for the same server method with the same set of arguments can be accessed from that cache.

To make an action storable, you simply call its setStorable() function.

For example:

var action = component.get(“c.getItems”);
action.setStorable();
action.setCallback(this, function(response) {
// handle response
};
$A.enqueueAction(action);

With Winter 19 and the API version of 44.0 or greater, We can simply annotate your @AuraEnabled apex method with the cacheable=true attribute. You no longer need to use setStorable. For example, if I wanted to make the getRacesDB method cacheable, I would add the cacheable=true attribute, and the data it returns will be cacheable for any actin that calls it.

public with sharing class ListRacesController {

    @AuraEnabled(cacheable=true)
    public static PageResult getRacesDB(Decimal pageSize, Decimal pageNumber) {
        // Code to return the list of races goes here

For more info: https://developer.salesforce.com/blogs/developer-relations/2017/03/lightning-components-best-practices-caching-data-storable-actions.html

Thanks for Reading…