Most of the applications support through internet connection. Mobile users expect an ability to interact with/without connection. For example, shopping cart applications might take a while to load a single page since it needs to obtain content from the server via network. In some scenarios, low bandwidth results to time taken process. To overcome these issues, we are following an Offline-first approach.
‘Offline-first’ is a development approach that ensures an app works in offline as it does in online. Creating an offline-first app can ensure faster, reliable, retaining users and providing better user experience.
Many businesses have already developed offline-first mobile apps and Google is one of them. Google offers offline capability. For example, let’s consider Google Maps provides an ability to use downloaded routings in offline mode.
We cannot show remote data when there is no internet. Hence, we will sync the remote data to device storage when network connection is established. When internet is not available, it will manifest data from mobile’s internal storage to user, which is an offline mechanism.
Architecture of offline functionality in Mobile application:
Mendix development solutions provides an ability to synch data based on the configured objects in the ‘Sync Configuration’ of Hybrid phone app offline navigation profile.
Domain model changes automatically synchronize during Initial Start-up of mobile device, in online mode.
Manual Synchronization can be configured in the following ways:
Automatic Synchronization can also be done during on-load of page when user is in online mode. For this we need to write logic in nanoflow to check whether internet connection is established or not, based on the returned value to map the Synch logics.
Basically there are two phases of synchronization, such as upload & download phase. During the upload phase, your application updates the server`s database with the new or changed objects in mobile app.
In the download phase, the app updates the local database (Mobile internal storage) using the data from the server database. For this, Synchronize to device option must be used in order to synch one or more objects or lists to client database.
In offline application, in order to synchronize the data network connection is required. By default, the timeout for synchronization is 30 seconds per network request.
During Upload phase if any network issues are found, then the synch is aborted and the changes will be made in the device and no changes will commit to server database.
During the Download phase if any network issues occur, then no data will be updated to device and the changes cannot be rolled back on the server.
If the synchronization is called as Nanoflows on click action on a button, then errors can be handled using Error handler mechanism, so that error message will be displayed accordingly to the user.
When an object commit is skipped then the changes are ignored and the references from other objects to it will become invalid. So an error will be communicated to the user as ‘Synchronization failed due to uncommitted objects’ of respected reference objects.
In Offline application, if multiple users synchronize the same state of an object on their device, it follows the last win`s approach for data synch.
Mendix leverages Phone Gap Build to build for mobile applications development and also provides an ability to download the source of mobile application. The Source contains configuration files which allow you to define different versions of your mobile app with specific settings like Mendix environments in order to easily test multiple versions of your application. This is because, MX mobile applications are based on standard Cordova stacks, Cordova settings and plugins that can easily be integrated.
Let’s consider a scenario- a user want to claim their Mobile bill. The first thing to do, is to add multiple requests and displaying the ones on the listview. Before submitting this, if I want to delete the added claim, then the following approach must be taken aboard.
Firstly, we need to create a flag attribute in entity. For example, I have Test entity object and adding flag attribute which is IsDeleted (Boolean). The default value of this variable is set to False.
I have one list view of Test entity with data source as Nanoflows which returns the Test entity list and Delete button in a page. In the delete button, I am calling one nanoflow with one change object activity by setting the ‘IsDeleted’ attribute value as True and committing it.
In data source nanoflows, I am retrieving the Test entity list from the database. Then we need to filter this data based on the IsDeleted attribute with true value. But actually, it does not remove from the client database. In the next step, we need to do that operation.
Synchronization process only works in online which mean mobile device should be in online mode. In order to synchronize manually, we need to create one action button. In this button, call nanoflow. In this nanoflow, call one sub microflow to delete the test objects whatever Test entity has IsDeleted attribute value as True.
In this sub microflow, retrieve the entire test list from the database. Then filter the list with IsDeleted attribute value as True. Then delete respected filtered list and then call Synchronize everything activity to Sync client db with server db.
After that we are calling one Sub microflow in order to fetch the latest Server db data to mobile device with the help of Sync to device activity. Now the test list will change in mobile device.
By Uma Raj
By Uma Raj
By Abishek Balakumar