APEX Offline – The missing Link

1. 1
APEX Offline –
The missing Link
Kai Donato KSCOPE 23, Aurora

2. 2
kai.donato@mt-itsolutions.com
Kai
Donato
Department Manager APEX & JavaScript

3. 3

4. 4
approx. 48 Mio. €
Turnover in 2021
Training company,
Partner in dual studies
> 125 Customers
Cross-sector
Manufacturer-neutral
Foundation 1994
Headquarter
Ratingen
Branches
Frankfurt am Main,
Köln, München, Hamburg
Your partner for digital transformation.
Individual IT solutions from one single source.
Certified partner
leading technology
manufacturer
> 360 Employees
Facts and figures.

5. 5
Why Offline APEX!? 🧐

6. 6
Why Offline APEX?!
- Working outside the office
- No data loss when having unstable
connection
- Look & Feel like a native mobile app
– including offline capability

7. 7

8. 8
Customer project (Lürssen Werft)
- Registration of weight data on board of ships under constrcution
- Usage on iPads inside and outside the shipyard
- Controlled switch to offline mode inside the application
- Partly limited functionalities in offline mode
(reporting, calculations)

9. 9
Project overview (mobile first)

10. 10
Selective caching of projects for offline usage

11. 11
Progress bar for caching process

12. 12
Registration with location markers on floor/constructions plans

13. 13
Interaction between map plugin and form region

14. 14
Error handling on synchronisation

15. 15
What‘s the technology
behind it? 👨🏫

16. 16
Status Quo - APEX
• Progressive Web App (21.2+) in the Shared
Components
• Basic implementation of a service worker
• Error page on missing connection
• Caching of requested ressources (app icons,
fonts etc.)
• Possibilities for custom extensions
• PWA manifest
• Service worker
• Basic / Functions

17. 17
Used browser technologies
• Works in the
background
• Proxy between
Application and
Webserver
• Delivering cached
ressources
Service Worker
• Page specific
browser storage
• Caching of HTML
pages and
ressources
Cache Storage
• Browser Storage
with keybased
access
• Saving datasets for
offline usage
IndexedDB

18. 18
Service Worker
• Integration using Event-Hooks (22.1+)
• install: Service Worker for Scope (URL) activated
• fetch: Ressource being requested
• Online: Delivered from webserver
• Offline: Delivered from cache storage
The way it works

19. 19
Cache Storage
Be cautious with dynamic
resources, authentication, and
session management
Automatic caching:
On pageload or when ressource
requested from service worker
Explicit caching:
Selection of pages to be cached from
metadata or by user, fetching of required
resources

20. 20
IndexedDB
• Preliminary: Storage of offline available data
• Business data
• Master data (select lists)
• Offline: Storage of local changes
• JSON
• Synchronization upon regaining connection
• Rendering:
• Loading form data
• Displaying changes (HTML)
Usage

21. 21
Imported questions before the development:
• Does the whole
application have to
be available
offline?
• Is the application
being used mainly
online or offline?
Availability
• Which data has to
be available
offline?
• Will there be new
data added?
• Will there be
changes to the
cached data?
Data
• How often will the
cached data
change?
• Are concurrent
changes to the data
possible?
Synchronisierung
• Which APEX
componente
should be used in
the application?
• Are there any
external resources
or libabries in use?
Application

22. 22
Live Demo
😮

23. 23
Testing APEX Apps is now
as easy as creating them.
• Tailored for APEX
• Save a lot of time on regression tests
• Use our intuitive LCT-App and don‘t write any test code
• Testing on multiple platforms simultaneously

24. 24
kai.donato@mt-itsolutions.com
Kai
Donato
Department Manager APEX & JavaScript
Thank
You!