Salesforce1 – How Offline is Offline?

Written by

Offline and Online chart

With the recent push of Salesforce’s App Cloud Mobile, their Summer ‘16 release, and the update to Salesforce1 for iOS, you’d be forgiven if you thought that full offline was now available to all Salesforce mobile users through the stack mentioned above. But as always, the Devil is in the detail.

The number one thing of all time asked for, for Salesforce1… is offline.
– Marcus Torres, Senior Director, Salesforce

It’s no lie that some offline functionality is available, and as Marcus Torres, Senior Director Product Management mentions, offline was one of the most requested features in Salesforce1. What we need to be aware of, as CTOs, Solution Architects, and Developers, though, is just how much offline functionality we get.

Offline Data in Salesforce1

Included in what we do get in Salesforce1 with offline read/edit support is:

  • Records for Recent Objects recently accessed, limited for the first five objects (excluding Files) in the Recent section of the Salesforce1 navigation menu.
  • Records for Other Objects viewed in current session
  • Note: that recent means records that have been accessed within the last two weeks.

So what don’t you get?

  • Access to Recent Objects you’ve never viewed
  • Access to Recent Objects you’ve not viewed in the last two weeks
  • Access to Recent Objects that are not in the top 5 of the “Recent section of the Salesforce1 navigation menu”
  • Access to other objects that have not been accessed in the current session
  • Access to dashboards not seen during the current session
  • Access to Visualforce pages.

Why is this Important?

A few scenarios spring to mind that could cause some issues with the above limitations:

Imagine a user of your app is a salesperson of agricultural equipment, they’re out visiting a client in the poorly connected countryside. They’ve already cached the account data they’ll need (they’ve even remembered to do that) and that’s proved useful as they were able to create a lead offline. Their meeting finishes earlier so they pop to another client at another farm nearby. That meeting goes really well, and they want to capture new opportunities… but they can’t, since this account’s details weren’t in their cache.

Or how about your users trying to take an order for a product they’ve not accessed before whilst selling medical supplies in a hospital?

If you can’t fulfill these tasks then your process,
and your business, is broken.

When it comes to business critical processes, not only complex ones, you need to go beyond Salesforce1’s offline capability.

With MobileCaddy your device not only downloads and securely stores your recent items – using the same encrypted method used in Salesforce1 – it also pulls down and keeps in sync any records that you might need for your work, so you can perform all your tasks offline.

MobileCaddy and Offline-First

MobileCaddy is built with disconnected users at its heart. By designing and supporting apps with an Offline-First approach MobileCaddy not only has its data offline, but also its logic. This means complex business logic and constraints – including parent/child relationships, field level access control, etc – are all in place and functioning, allowing for 100% offline create/edit support.

We’ve incorporated unique features such as full offline data and logic,
customisable UI, performance monitoring and analytics
– Justin Halfpenny, CEO, MobileCaddy

And because MobileCaddy apps are Offline-First they’re also faster. The majority of database reads and writes are to the local store, meaning normal page and app tasks are completed instantaneously, rather than waiting for network transactions to take place. As our CEO recently stated, app performance is not to be underestimated in the enterprise space.

MobileCaddy takes app performance even further. Instead of having all fields for all records buzzing up and down over the wire, we’re able to define exactly which fields should be mobilised, and also which records users require. And during sync operations we also only pass deltas across, lightening the load even further.

Take Home

When contemplating your Salesforce mobile solution make sure you’re aware of the constraints in the offerings available, and that you pick the route that’s going to give your organisation or your clients the mobile advantage they deserve. And in the words of Adam Seligman (EVP, App Cloud, Salesforce), “Sometimes you want to build completely custom apps… take advantage of local device features… do offline sync… we’ve got that in the mobile SDK.”

Fill-in the form below to see how MobileCaddy can really take your apps offline and experience the value of true enterprise mobility

Ionic UK Meetup – Jan 2015

Written by

As per our preview post, some of the MobileCaddy crew headed to the very first Ionic UK meetup… and boy what a fab evening it was. The event was organised by Sani Yusuf and Ryan Hanna and to say their efforts were clear to see would be an understatement.

The meetup took place at the excellent SkillsMatter, and they had everything that could have been asked for from a venue.

IonicUK logo

Sani Yusuf – Kick Off

An introduction to Ionic, it’s past, present and future was the starter dish for the evening. Sani took to the front in his famous Google Glass and took us through what life was like before tools like Ionic arrived on the scene. This was a time when to develop apps for mobiles meant using different languages for the different platforms. A time when these restrictions meant porting apps and having multiple, non-interchangeable teams of developers. He told us how the first wave of Hybrid apps promised to free us from these constraints and how these promises never really delivered… and then came Ionic.

Ionic, for those that don’t know, is a framework/SDK enabling folk to quickly build hybrid mobile apps using HTML5 technologies. Ionic uses the amazing Apache Cordova tools to take advantage of device features (GPS, camera, etc) as well as enabling the apps to be built into suitable formats for submission onto the different app stores (iTunes, Google Play, etc).

With Ionic came a toolset that removed some of the pains that developers were used to when initially building Cordova apps. A focus on performance meant that apps could now be built that had native like experiences… users shouldn’t/wouldn’t need to know if apps were native or hybrid. And this is what we really like about using Ionic ourselves at MobileCaddy. With every release (and keep in mind it’s still in Beta) the performance across all platforms just keeps getting better. Have I mentioned yet that we big fans of Ionic at MobileCaddy?

A quick demo was then rolled out to demonstrate just how quick it is to get started with Ionic… and if you want to see for yourself head over here. Sani joked at how you could have a $1bn app in minutes, in a way there are real serious opportunities available.

Sani and Ryan, organisers of the meetup

And just then not only did the beer and Pizza arrive, but we were also privileged to have Max Lynch (one of Ionic’s founders) join us on a Hangout.

Max Lynch – A Hangout

Max mainly focused on chatting about the new and upcoming features and tools that he and the Ionic folk were working on. Most of the focus was on the upcoming Ionic.IO. He discussed how that even though Ionic was currently enabling devs to build amazing hybrid apps that there were still pain-points and a lot more that could be done. Ionic.IO essentially delivers a platform to sit alongside the actual apps. This would deliver the following types of features;

  • Push Notifications
  • Dynamic Versioning – Being able to update your app without having to go through the app submission rigmarole.
  • Analytics
  • A/B Testing

At MobileCaddy we have already started addressing some of these issues using the Salesforce platform, for example we can already do Dynamic Versioning and have taken the idea even further with a greater level of control.

Max also talked about the recent work they have done with the Crosswalk project, and how this is further pushing increased performance on Android devices. Essentially this allows you to bundle a specific version of webkit with your APK (the binary application file that is installed on people’s devices). This has the effect of meaning, as a developer, you have a known landscape when dealing with your HTML/JS/CSS, as well as of course meaning you can take advantage of newer builds and their feature sets sooner that might otherwise have been possible.

One question came up for Max about Angular 2. His reaction was positive, saying he was excited and that Ionic for Angular 2 would be on the cards. He also mentioned that Angular 2 is pushing towards a component based framework. I’ve not really looked into Angular 2 in any great detail, but this component based framework might play very nicely with Salesforce’s Lightning components. We heard about these from Doug and Skip from Salesforce at the last London Salesforce Developer’s meetup, so see our review for more information.

Ryan Hanna – Showcase

Co-organiser Ryan was next up, with the task of showing off a few apps built with Ionic, but before I get to that I should cover some of Ryan’s background. He’s a self taught developer (using Code Academy) and has only been in the game for three or so years. What’s amazing then is the fact that he’s the sole developer on his own app Sworkit, and the success that this has had… but more about that later.

Zourist

Zourist is “an audio travel Guide to World Famous Monuments, a free mobile app which provides you authentic and reliable information so that you can visit the monument at your own pace”. It is developer by Nancy Goyal using Ionic and at the time of writing has a 5 star rating on Google Play.

Sworkit

Ryan then discussed his own app, a 4.5 star app available on both iTunes and Google Play. This is a real flagship app for Ionic, with over 3m downloads covering both OSs and is available in a Lite and Pro guise. The app is available in 13 languages, and this has been achieved using the Angular Translate module. Modules like this mean that tasks like making your app available for the international market reachable without too much effort, something that will be music to multinational organisations I’m sure.

With such a large user base I was keen to find out what Ryan’s experience had been with the accessibility of hybrid apps built with Ionic. He told me that the feedback he’d gotten so far had been very positive. My understanding is that basic HTML5 good practice pays off in the same way for apps as it does for websites.

Ryan had also mentioned something called localForage, this is a library that gives you a nice API for asynchronous storage (IndexedDB, WebSQL), resulting in an interface more akin to localStorage. We could certainly introduce something like this into our CodeFlow environment.

Todd Halfpenny – MobileCaddy

pres_small

I was up next, and took the meetup attendees on a speedy tour of how MobileCaddy can enable JavaScript developers to build enterprise grade, robust mobile applications for Salesforce. I’ll hopefully post the slides up shortly, but the key takeaways were that MobileCaddy enables;

  • JavaScript developers to build enterprise grade apps for Salesforce
  • (Secure) Offline, Data Synchronisation out the box
  • Salesforce authentication with no coding
  • A controlled application development/deployment lifecycyle, including OTA app updates.

We also demonstrated our Deploy to Salesforce feature for the first time.

Screenshot of MobileCaddy's Deploy to Salesforce Button

This allows developers to deploy new versions of their mobile applications to the Salesforce platform from within the very app they are building. I have to be honest and say that I am very excited about this, and even more so about where we see this heading. Just another tool that we hope will ease enterprise mobile application development.

Richard Sands – Angular Fullstack Ionic

A late entry to the lineup, Richard give us a whirlwind tour of his new Angular Fullstack Ionic project. I think he can explain it better than I can, so this is lifted from the Readme;

The motivation behind Angular Fullstack Ionic is to streamline the development of projects that include an API, Angular webapp and Ionic app. It’s core design principles include sharing code and assets wherever possible, creating an efficient workflow and making it super easy to start off a project with handy components available out of the box (e.g. user signup/login).

It is based on the brilliant Yeoman angular-fullstack project

His enthusiasm and passion shone through, and despite the project be very young I can see that it shows potential.

Closing Notes

The event was a great success, and I look forward to seeing more from this exciting community. And I’m sure that MobileCaddy will continue to be a part of it.

Offline Ionicons – Getting them working

Written by

ionicons-logo

We’ve heard of several folk having issues getting their Ionic powered mobile applications working offline correctly when using the Ionicons. We’ll show you 2 quick ways that should help you out if you’re having the same issue. Offline ionicons are possible, and not difficult to implement.

The Issue

When using the HTML application cache you define a list of assets to be cached locally, allowing for local serving of them. This gives you performance increases and also offline capabilities. These assets are listed under the CACHE MANIFEST header. This is the section where, if using Ionicons in your Ionic application, you could be tempted to list the following;

You’d then potentially use Sass to process the SCSS files supplied with Ionic and you’d soon see that your icons weren’t displaying offline.

This occurs due to the Ionic SCSS supplying a version number into a query param for the Ionicon font files.

What this means is that the URLs for the font files in the outputted CSS are actually like this;

What has happened here is that the the URLs now have ?v=1.5.2 appended to them… and this means that our CACHE MANIFEST entries will not match and our app cache will not cache them, and so our offline ionicons won’t be there. Sadly this quirk of app cache isn’t mentioned in either the pages over at w3schools.com or HTML5 Rocks, and is therefore quite commonly missed.

Solution 1 : Correct your CACHE MANIFEST

Update your CACHE MANIFEST to include the query parameters that are associated with the version of Ionicons that is being used.

Solution 2 : Modify the Ionicons SCSS

An alternative is to modify the ionicons-font.scss file to remove the code that inserts the query parameter. There can be several reasons to take this approach and for one of the Salesforce projects here at MobileCaddy this was just what we decided to do.

If you want to take this approach then your SCSS should be modified to look like this;

Due to us using bower to bring in Ionic as part of our development setup we also decided that instead of manually having to modify the SCSS (which wasn’t stored in out git repositories) we created a simple Grunt task to do this for us. Then we added this Grunt task into our standard workflow which meant our developers didn’t need to think about this at all. Our Grunt task looks something like this;

Using either of these approaches should help you to get offline ionicons working and hopefully assist you with creating more robust mobile applications.

Using ionic without ionic CLI

Written by

You may want to use the ionic JavaScript framework without having to use Cordova or the ionic CLI. This was just what we wanted to do in one of our seed applications to demonstrate how to build robust offline mobile applications that use Salesforce as their backend, so it make sense to share how we went about this.

Ionic without the CLI

Not only did we want the nice CSS framework that the (awesome) ionic guys have put together but we also wanted to use their angular directives. The approach we took is pretty simple, at least that’s what I think.

The solution

Our development setup was already using bower to install dependencies for our app… these included the handy Underscore JS JavaScript utility library and our own MobileCaddy SDK which enables full Salesforce offline capabilities. With this in mind we re-used bower to pull in the ionic assets too. Here is the line from our bower.json file that lives in the devDependency section

This line informs bower to download the 1.0.0-beta.13 release of ionic.

The next step is to enhance our existing Grunt tasks to copy the resources into our existing project structure. This is so that the SCSS is included in the Sass processing and the JS and other assets (fonts, etc) end up being included in our deployable code bundle. In our case our bundle is pushed to the Salesforce platform to be used within our mobile application. The below is a modified version of our Gruntfile.js which only includes the copy tasks needed to support this Ionic use.

And that’s it. Our offline mobile Salesforce application can now be built using the ionic Framework, without the use of Cordova or the ionic CLI.

Webinar – Build offline Salesforce mobile apps with any JS framework

Written by

We are delighted to announce this webinar for salesforce developers who want to get building offline mobile applications using the latest and greatest javascript frameworks.

Platform Emulator running

We will show you how by using the MobileCaddy suite of developer tools  you can quickly create a new fully ‘offline enabled’ salesforce custom mobile application and get this running on a phone or tablet in just 4 easy steps.

At the end of the webinar we will have a custom mobile app interacting with data on the platform that is fully functioning in terms of logic and data, with or without connection, that is also robust when handling dropped connections during these sync processes.

We will see how the backend package allows you to mobilise data with a few simple point and clicks. At the same time set the query parameters of the data for each ‘Mobile Table’, as well as setting the synchronisation type and failure & conflict behaviours. This will take us around 10 minutes.

Once this is complete we can then get our dev environment ready using the MobileCaddy CodeFlow setup process, again needing about 10 minutes.

Then to our application logic and get coding out the javascript needed to create a simple time and expense application complete with a custom user interface. Here we will use the bundled MobileCaddy SDK and the simple API calls to work with our locally stored application data. We will be able to test and debug this with our local CodeFlow Emulator. 15 minutes and we will be ready for the next step.

Finally we will push our pre-built application bundle to the platform and run up with our Platform Emulator and then grab a phone and run up showing the sync engine in action both online and offline.

The webinar is being held on the 10th November 2014 at the following times:

PST    10:00-11:00
MST   11:00-12:00
CST    12:00-13:00
EST    13:00-14:00
GMT   18:00-19:00

Please follow this link to sign up. If you have any particular frameworks you would like feedback on please let us know on one of our channels or pop up us an email (see the links at the bottom of this page).