Optimum offline handling in a mobile app

Developing an app which works offline and syncs to server when it comes online is a challenge. You need to work with cache revalidation and merging data across sources. Same user may be logged in from multiple devices, and change data both offline and online. These are some of the most difficult aspects of programming in general.

If you really need that sort of functionality, then this post is not for you. If you are building a Google Docs/Sheets competitor, you have no choice but to take the hard path.

Alternatively, you may want to let the app work like a website. Works only if there is internet, and errors out otherwise. This isn’t a great UX. Network on mobile is flaky in general, and you should anyway let the user see the data offline on a mobile app.

However, most apps do not need a full blown offline experience. Let’s say you are developing a grocery subscription app. It’s safe to assume that if a user opens the app offline, they don’t expect to see anything more than they have already seen. This is true for most of the apps.

It’s sufficient to only display the data that was pulled before. You can display an error for any other screen or action.

In short, do this:

  • Cache the data locally and use that instead of the data from API
  • Display a persistent banner/notification to let the user know that the data may be stale and the app is offline
  • When user navigates to a page which needs data not in cache, display a full page error
  • When user takes an action such as submitting a form, provide feedback to user that the app is offline and cannot do this. Feedback can be in the form of a toast message or notification.

User gets to see the available data, with the full knowledge that internet is required to see the latest data or to take any action. It’s also relatively easy enough to implement, compared to a complete offline solution where app is fully functional offline and syncs to server when internet is available.

--

--

--

You may check my website for my bio, at http://t.co/BlvwH2JyeT.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Generate your ASP.NET Core application with JHipster.NET

JavaScript’s Wild Type Coercion

Popular JavaScript Diagram Types You Can Build with DHTMLX

Awesomeness in RxJs (fork-join)

Data sharing between Angular Components

Child component example code

A simple way to render terrain

A Deep Dive into Angular’s NgOnDestroy

React versus Vue.js

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Prabhakar Bhat

Prabhakar Bhat

You may check my website for my bio, at http://t.co/BlvwH2JyeT.

More from Medium

Is Cross-Platform Development Still Good in 2022?

How to Run YouTube in Background on Android and iOS Devices?

Native vs Mobile Web Development. What is the best one for your mobile application?

person holding an iphone

Getting Started with Bugfender