Caching whole page/template using ionic/angular

ionic-v1
1

I am building facebook like feeds page for my app and user can navigate to other pages from this feeds page. Whenever user is moving away from the feeds page, feeds page will get cleared and new page is created. When user clicks back button, feeds page is again created. Is there a way to cache a page(feeds page) to improve the usability and performance?

Thanks in advance.

1 Like
2

I have the same issue. On application start I show splash-screen and load all needed data. The loaded data I store in services. When we press (for example) on other tab, previous controller dies to clear the memory. In this case ng-hide is not good idea because controller makes too huge and therefore slow.

When user press “back” button generally I need run the same flow and re-create main controller. Since all my data stored in services, I only load it back. But still has some lag (about 1 sec).

I thought about cache but didn’t implement it yet and don’t know how it could improve the performance (in my case)

Best regards,

3

Currenlty, Ionic does not support “caching a page”. As @shoustin suggested, you can “cache” the results of your HTTP call in a service. That way it doesn’t have to be loaded again.

There is some talk within the Ionic team of caching views for “drag to go back” style navigation. However, that is a bit down the road.

4

Thanks guys. I have implemented caching for the services. But still as @shoustin mentioned, there is a lag when showing the page again. Is there any issue/ticket for checking this status of this caching views?

5

I saw in one of posts that there is 300ms delay even if you have empty controller that does nothing. Maybe even opened issue

6

I’m not aware of any built-in lag. There are built-in transitions that occur between page states. That’s why we all love Ionic for those transitions and other effects.

Keep in mind that Angular must render a view. If there is a lot of data, that can take a little bit. A slower device would really show off that delay.

Questions:

Device type, platform, OS version?
Ionic version?
Are you using the AngularJS version that shipped with your Ionic version?
Size of data? 1 row, 5,000 rows?

Any chance of posting a CodePen sample?

7

Hi everyone,

I wonder if what the “300ms delay/lag” reported here has anything to do with the delay that touch enabled devices have by default to check if there won’t be a “double tap”; as explained here http://updates.html5rocks.com/2013/12/300ms-tap-delay-gone-away and there http://timkadlec.com/2013/11/Avoiding-the-300ms-click-delay-accessibly/

I might be wrong but I hope it helps. At least to make sure it’s not that :wink:

8

I’m having a similar issue, although I’m using tabs. Did you manage to solve this somehow saravcts?