Retrieving data and displaying it separately!

Hi guy, I have question regarding services that retrieve API data. I am building a mobile application and I want to handle the data retrieval separately… This is because of connection handling, also my list of objects are retrieved from server side.

when the user enters the application without internet, it should display cached data the last time he/she was online, not forget that this specific view/page includes <ion-refresher> as well infinite-scroll

  1. what is the best practice to do this ??
  2. Do I initialize the services in app.component.ts for better performance and store it in Storage and then retrieve from storage to client side ??
  3. if so retrieving from storage to client side…How and from where to handle the data to display when the user pulls down the page for refreshing ??
  4. for displaying connection errors what the best component for this ? should I use a simple popup Toast or redirect to a different view or page which displays connection error , please check your internet connection

basically I need some enlightenment regarding this whole issue…

Also on a separate issue… currently i have built a very simple app that consists of 3 tabs … the first one only retrieves list of data and displayed on <ion-card>

However when I built the app and tested in on android phone… the booting time is slow, and when I click on the tabs , the response time and navigation is a bit slow as well !! Any advice regarding this