Hybrid HTML5 mobile apps seem to get a bit of a bad rap, it’s not really justified though. If you speak to most native mobile app developers they will tell you that hybrid applications are:
- Only good for building quick prototypes
- Slower and less performant than native applications
- Not real mobile apps
It’s not always just the native developers though, if you speak to people who have actually tried creating hybrid apps with HTML5 and PhoneGap you will often get a similar response.
I’ve seen and used amazing applications that were built with HTML5 and PhoneGap, which look and feel just like native apps (good ones at that). Here’s two great examples:
Snow Buddy UNTAPPDand there’s a whole bunch more on Ionic’s showcase page.
These apps aren’t freaks of techology, they are complex apps built by good developers who know their tools. You would absolutely not be able to tell that these apps weren’t native (except for maybe the fact that UNTAPPD is available on four different smart phone platforms).
So, my question remains. Why do HTML5 mobile apps get such a bad rap?
1. It’s REALLY Easy to Create Bad HTML5 Mobile Apps
Syd Lawrence (one of the creators of Snow Buddy) made a great point in his talk at PhoneGap Day on how to build high performance PhoneGap apps:
It’s so easy to create a HTML5 mobile application, and that’s where a lot of its reputation comes from. If you take someone who is reasonably comfortable with HTML, CSS and JavaScript but has never built a mobile application before they could probably piece together a simple mobile app in a day or two using HTML5.
Why is this a problem?
- Someone who has never built a mobile app before will likely not understand how to design a suitable interface with a good user experience
- They also won’t understand the limitations of a mobile app and how to overcome performance issues
- They may assume they can do things the way they would do it normally on the web
- They may not understand general programming principles
- The resulting app is probably going to be pretty bad, and exhibit those stereotypical HTML5 problems
Now I don’t want to vilify web developers who jump right in and start creating bad mobile apps, that’s exactly what they should be doing and it’s a great way to learn.
But if you take the same person and get them to try to create a native app, they have to learn a whole new language and way of doing things. It’s going to take a lot longer until they are even able to produce a working mobile app, but by that time they will have quite a bit of experience and most of the developers who aren’t quite ready to build a mobile application yet will probably never make it that far.
So we end up with someone who has smashed out a HTML5 mobile app, thought ”wow, this is pretty awful” switched to native and produced a superior result. This causes a disproportionate amount of bad HTML5 applications when compared to bad native applications. Conclusion: Hybrid apps have poor performance.
If we take that same developer, and get them to spend some time really understanding how to create high performance HTML5 mobile applications, then the result would be a lot better.
That’s not to say that all native apps are good, I’ve seen some pretty awful ones, but in general there is a larger proportion of good native apps.
It’s kind of similar to the situation with the PHP programming language. It’s a very beginner friendly language that is pretty relaxed on the rules, so it attracts a lot of beginners who make bad applications with it. But if you take someone who knows how to use PHP properly, then it is a very capable language (and that person will probably have to deal with people on Internet forums telling them how bad PHP is).
2. If You Don’t Use a Framework, a Good One, Then You Will Get Poor Results
It’s so important to use a good HTML5 framework. These frameworks (the good ones) are built specifically to deal with the shortcomings of HTML5, specifically things like:
- Tap Delay
- Memory Usage
- Animations
- DOM Manipulation
so that you can focus on just building your app. There’s so many little things that these frameworks take care of to make sure you can produce a smooth, native like experience that it’s completely unfeasible to build a good HTML5 mobile app without one (unless you’ve got some serious coder-power).
Naturally, some frameworks are better than others. jQuery is quite popular since most people are already familiar with it, but it doesn’t perform as well on mobile as other frameworks do. Ionic is based on AngularJS which works very well for mobile, and Sencha Touch is another example which is its own powerful beast (a beast that is transforming into EXT JS 6).
3. People Don’t Think Hybrid HTML5 Apps Have Offline Capability
There’s two parts to this assumption usually:
- People assume that hybrid apps require an Internet connection to function
- People don’t think hybrid apps have the ability to store data offline
Addressing the first assumption, that’s simply not the case. A HTML5 mobile application can be packaged with PhoneGap and distributed through app stores. All the applications files are stored in the application, along with a built in browser, and there is no need to access the Internet to run the application (unless of course the app uses the Internet).
On the second assumption, the default storage for HTML5 apps is usually the browsers local storage. This isn’t bad, and is usually quite suitable for most apps but it does have size limitations and can be unreliable. One solution to this is to store the data on a server and retrieve it in the application when necessary, but then what if you want to allow your users to use the app offline as well?
There are solutions for this. First of all HTML5 mobile applications can quite easily access native like storage by using the SQLite PhoneGap plugin, and if the app requires syncing online and offline data you can use something like PouchDB.
4. People Think HTML5 Can’t Do as Much as Native Apps
As an extension to the last point, some people don’t realise that a hybrid HTML5 app can do everything a native app can do. This includes things like:
- Accessing the devices GPS
- Using the devices camera
- Using BlueTooth
- Running tasks in the background
- Receiving Push Notifications
- In App Purchases
- Game Center Integration
Typically PhoneGap is used when building HTML5 mobile apps and the PhoneGap native wrapper is a native app. So the HTML5 mobile application can access everything a normal native application can by using PhoneGap as a middle man.
If you want to learn more about how PhoneGap works you can check out my free eBook.
5. Elitism
This is a cultural problem in the programming community, and a very ugly one. These debates and flamewars go back forever: HTML5 vs Native, Mac vs PC, PHP vs Ruby and so on. Many people believe that whatever thing they pick is the right thing, and anybody who uses the other thing is clearly an idiot.
It’s great to discuss and debate the strengths and weaknesses of different approaches, but often these discussions devolve into an “us vs them” mentality and it quickly becomes completely unproductive. People become emotionally invested in the programming languages they choose, and when you might devote years to learning something this is completely understandable – nobody wants to be on the “losing” side.
The more sinister side of this is that for some people there is an element of self preservation. If you know one particular tech really well, and something comes up to rival it then it is in your interest to make that tech go away. What if your clients start coming to you and saying:
that would be pretty bad for an Objective-C based business, so it would make sense for Objective-C developers to make their clients (and the general population) believe that HTML5 is not a viable option or that nobody really uses Android anyway.
I don’t believe that this is some war where one side will win out in the end, different goals call for different solutions. Sometimes that solution will be native, sometimes that solution will be HTML5, a lot of the time it won’t matter which approach is used.
6. People Don’t Know Good HTML5 Apps Are Created with HTML5
It’s not hard to spot a poorly built HTML5 app, but it is hard to spot a good HTML5 app because… you can’t tell the difference between it and a native app (and that’s exactly the point). In Syd’s talk he said:
So if people see a poorly built mobile app they assume it’s built with HTML5, and if they see an awesome mobile app they assume it’s native. This reinforces that misconception that well performing apps are built natively, and poor performing applications are built with HTML5.
Your thoughts?
My view is that for most mobile applications a HTML5 / Hybrid approach is more than suitable, you would rarely ever be able to tell the difference if it is built well, and it has the huge added bonus of being able to be deployed to multiple platforms.
I don’t think that means that native applications are going anywhere though, I think native will be required for specialised applications for a long time to come, and for some teams a workflow of creating two native apps may be preferable and workable. When comparing one solution to another the only legitimate concern is the end goal. How you get there just comes down to what works for you or your team.
It’d be great to hear some thoughts from both HTML5 and Native developers in the comments, but can we all just get along? 🙂