Apex Cacheable methods

Introduction  

With salesforce winter 19 release, Salesforce introduces another way to improve the performance of the lightning component cache by mark an Apex method as storable (cacheable) instead of using setStorable() on every JavaScript action. With the apex storable methods, you can centralize your caching notation for a method in the Apex class instead of doing at client side javascript. Marking a method as storable improves your component’s performance by quickly showing cached data from client-side storage without waiting for a server trip. If the cached data is stale, the framework retrieves the latest data from the server.

How to Use?

To cache data returned from an Apex method for any component with an API version of 44.0 or later, annotate the Apex method with
@AuraEnabled(cacheable=true). For example, the following method is made as cacheable

Here is the complete apex class.

Lightning Component 

JavaScript controller

Now if the javascript code we no need to use setStorable() action instead we are using cachable apex methods.

Can I use javascript storable along with Cachable methods?

Yes ..You can able to use both setStorable and apex cacheable methods together. But recommended will update an existing component to API version 44.0, remove setStorable() calls in JavaScript code along with Apex Cachable methods.

Can I use the Cacheable methods in visualforce?

You can able to use the cacheable methods in visualforce controller also. Here is the simple page that calls the apex controller with cachable actions.