A research report by VisionMobile, in collaboration with Telefonica, exploring HTML5 development and investigating its pros and cons versus native development. There is a lot of discussion around HTML5 vs. Native, and it’s usually polarized. But most people express opinion, rather than facts. In this report, our aim is to answer some of the key questions with hard data.
Download the full report at http://www.developereconomics.com/downloads/can-html5-compete-native/
5. HOW CAN HTML5 compete with Native?
There is too much F.U.D, too many opinionated rants on how HTML5
apps fair against native apps. Things are painted too much in black and
white.
The question is how can HTML5 compete by closing the gap with
native?
Rather than opinion, we address this question with research,
interviews and hard data.
As part of the process we also challenge three myths of HTML5 mobile.
Page 5
6. HTML5 mobile: Myth vs reality
Myth
Reality
Performance is slow
• It is not about performance, it is about tools and the ability to
measure performance and improve.
• Technology gets better (asm.js), but browser vendors choose to
ignore it. Better performance depends on browser politics.
Lack of APIs
• 37% of Android apps could be implemented using HTML5 via the
Mobile browser, 49% via Phonegap, 63% via Appcelerator and 98%
via Firefox OS.
• The APIs that would make the biggest difference in app addressable
market are not even on the browser roadmap.
Ease of development
• Instrumentation tools, especially debugging and memory profiling
are sorely missing.
Page 6
7. More findings from our research
61%
of HTML5 mobile developers go direct to browser when
developing a mobile website or app. The browser is the most
popular route to the mobile market. Yet…
63%
of Android apps (US) cannot be implemented via the mobile
browser due to lack of APIs.
+
Page 7
21%
is the rise in the number of apps that can be created with
HTML5 if W3C and browsers supported a Power
Management and WiFi API.
8. HOW CAN HTML5 compete with Native?
39%
of HTML5 mobile developers go beyond the browser. There
are 3 other routes to market that HMTL5 mobile developers
are using: hybrid tools (e.g. PhoneGap), web to native
converters (e.g. Appcelerator) and native JavaScript APIs
(e.g. Firefox OS, Windows 8).
49%
of Android US apps can be developed using hybrid tools,
63% using web to native converters, and 98% using native
JavaScript APIs.
Page 8
9. METHODOLOGY: HOW WE BACKED OUR RESEARCH
30,339
Android apps from Google Play (US) analyzed in terms
of categories and API permissions;
6,000+
mobile developers worldwide surveyed in April – May
2013 as part of the 5th Developer Economics survey
42
HTML5 tools mapped across Architectural frameworks,
UI frameworks, Gaming engines, Web wrappers, Webto-native converters, Native Javascript APIs;
32
developers, industry experts and tool vendors
interviewed, from Angular.js (Google) to Financial Times
Page 9
11. HTML5 ROUTES TO MARKET
How can a web developer reach the mobile market?
Input
Distribution
channel
Output
Mobile browser
HTML, CSS,
JavaScript
WWW
Web document
Web wrapper
HTML, CSS,
JavaScript
App store
Hybrid package
JavaScript
App store
Native package
HTML, CSS,
JavaScript
App store
Native package
Web-to-native converter
Native JavaScript API
Page 11
Key players
12. NOT ALL ROUTES TO MARKET ARE EQUAL
61% of HTML5 mobile developers go direct to browser
Page 12
Source: Visionmobile, Developer Economics 2013 Q3 | Survey conducted in April – May 2013 | n = 2275
13. KEY PLAYERS IN HTML5 tech
What are the most important HTML5 development tools?
Architectural
frameworks
JavaScript
UI frameworks
Web wrappers
Web-to-Native
Converters
Page 13
CSS
UI frameworks
Native
Javascript APIs
2D
Gaming Engines
3D
Gaming Engines
14. ROUTES TO MARKET: HOW THEY DIFFER?
1. Performance
UI responsiveness & computational load.
2. Reach
Reach of multiple platforms.
3. API depth
Efficient API access to hardware components and services.
4. Monetization
Availability of 1-click billing, ads, in-app purchases, etc.
5. Ease of development
A measure of how easy it is for a web developer to get started.
Page 14
15. ROUTES TO MARKET: THE MOBILE BROWSER
API depth
Reach
Perfomance
Monetization
Ease of development
! Apps/games run on the device’s browser, e.g. iOS Safari.
! They are available on the web, discoverable through search engines, links &
advertisements.
Page 15
16. ROUTES TO MARKET: THE WEB WRAPPER
API depth
Reach
Perfomance
Monetization
Ease of development
! Apps/games run in a chromeless browser with access to the device’s hardware
APIs and services.
! They are distributed via an app store.
Page 16
17. ROUTES TO MARKET: THE WEB-TO-NATIVE CONVERTER
API depth
Reach
Perfomance
Monetization
Ease of development
! Apps/games are compiled from JavaScript to native code with access to the
device’s hardware APIs and services.
! They are distributed via an app store.
Page 17
18. ROUTES TO MARKET: THE NATIVE JAVASCRIPT API
API depth
Reach
Perfomance
Monetization
Ease of development
! Apps/games run on Operating Systems that expose their services and hardware
components through native JavaScript APIs.
! They are distributed via an app store.
Page 18
20. HTML5 GAPS
Where does HTML5 fall short in comparison to Native SDKs?
1. APIs
Access to hardware components and services.
2. Performance
UI responsiveness and computational load.
3. Tools
Tools for debugging, editing and profiling.
4. Education
Developer education on the advantages and best practices of HTML5.
5. Marketing
App stores, monetization options and profits.
Page 20
21. WHAT STOPS MOBILE DEVELOPERS FROM USING HTML5?
Performance issues
45.72%
APIs
37.34%
Limited access to hardware APIs
Difficulty to integrate native elements
29.18%
Can't create cutting edge UI/UX
Performance
28.30%
Lack of mature frameworks
Tools
20.53%
Steep learning curve for quality apps
Lack of large app stores
13.52%
3rd party APIs plugins are outdated
Education
13.53%
12.00%
Limited monetization options
Not as profitable as Native
Other
0.00%
Page 21
Marketing
9.55%
6.00%
5.21%
20.00%
40.00%
Source: Visionmobile, Developer Economics 2013 Q3 | Survey conducted in April – May 2013 | n = 1518
60.00%
80.00%
100.00%
22. What DRIVES mobile developers TO using HTML5?
Page 22
Source: Visionmobile, Developer Economics 2013 Q1 | Survey conducted in January 2013 | n = 1974
23. ANALYZING API USAGE: Android vs HTML5 APPS
The story of an app store analysis in terms of app categories and APIs
In June 2013 we analyzed 30,339 apps from Google Play (US) store to
determine the usage of APIs.
The question we aimed to answer was: Which APIs are the most popular
within Android apps?
We then compared missing HTML5 APIs with popular Android APIs to
conclude on the most important APIs to fix.
Page 23
24. app categories IN GOOGLE PLAY (us)
music & video
medical & fitness
utilities
business &
productivity tools
communications &
social networking
education &
reference
media
enterprise
maps, navigation &
lbs
entertainment
games
30,339 apps and games in Google Play – June 2013
Page 24
25. THE IMPORTANCE OF APIs per app category IN GOOGLE PLAY (US)
API
app category
utilities
calendar
music & video
medical & fitness
media
bluetooth
maps, navigation & lbs
games
entertainment
battery
enterprise
education & reference
audio settings
communications & social
networking
business & productivity tools
0%
Page 25
20%
40%
60%
80%
% of apps per category in Google Play US store
100%
26. THE IMPORTANCE OF APIs per app category IN GOOGLE PLAY (US)
API
app category
utilities
geolocation
music & video
medical & fitness
media
filesystem
maps, navigation & lbs
games
entertainment
contacts
enterprise
education & reference
camera
communications & social
networking
business & productivity tools
0%
Page 26
20%
40%
60%
80%
% of apps per category in Google Play US store
100%
27. THE IMPORTANCE OF APIs per app category IN GOOGLE PLAY (US)
API
app category
utilities
power management
music & video
medical & fitness
media
nfc
maps, navigation & lbs
games
entertainment
network
enterprise
education & reference
mic
communications & social
networking
business & productivity tools
0%
Page 27
20%
40%
60%
80%
100%
% of apps per category in Google Play US store
28. THE IMPORTANCE OF APIs per app category IN GOOGLE PLAY (US)
API
app category
utilities
wifi
music & video
medical & fitness
media
vibration
maps, navigation & lbs
games
entertainment
telephony
enterprise
education & reference
sms
communications & social
networking
business & productivity tools
0%
Page 28
20%
40%
60%
80%
% of apps per category in Google Play US store
100%
29. WHICH ARE THE MOST USED APIs IN GOOGLE PLAY (US)?
90%
network
filesystem
64%
power management
33%
wifi
29%
vibration
28%
geolocation
26%
camera
10%
0%
20%
40%
60%
80%
% of Android apps in Google Play US store using the specific API
Page 29
100%
30. ONLY 37% OF ANDROID APPS CAN BE DEVELOPED FOR a mobile browser
% of apps in Google Play US store that can be implemented with each HTML5 route to market, that utilise
APIs available through that HTML5 route to market alone.
37.22%
Mobile browser
Web wrapper
48.62%
63.41%
Web-to-native converter
Native JavaScript API
0.00%
97.76%
20.00%
40.00%
60.00%
80.00%
% of Android apps in Google Play US store
Page 30
100.00%
31. 61% of HTML5 DEVELOPERS ARE CONSTRAINED TO 37% OF APPS
Page 31
Source: Visionmobile, Developer Economics 2013 Q3 | Survey conducted in April – May 2013 | n = 2275
32. HTML5 API coverage, for each app category
Mobile browser
Business &
productivity tools
Communications &
social networking
Education &
reference
Enterprise
Entertainment
Games
Page 32
Web wrapper
Web-to-native
converter
Native
JavaScript API
33. HTML5 API coverage, for each app category
Mobile browser
Maps, navigation &
LBS
Media
Medical & fitness
Music & video
Utilities
Total
Page 33
Web wrapper
Web-to-native
converter
Native
JavaScript API
34. WHICH ARE the most important APIs to fix?
Which API, if implemented, would make the greatest difference in the
number of apps, for each route to market?
WiFi
Power
management
Power
management
21%
13%
Calendar
12%
1.4%
Mobile browser
Page 34
Web wrapper
Web-to-native
converter
Native
JavaScript API
35. PR
CR
LCWD
Standardization Status
the gaps between W3C APIs and browser adoption
Over-standardised
Under-standardised
WD
ED
None
Number of adopting browsers
0
1
" ED: Early Draft
" WD: Working Draft
Page 35
2
3
4
" LCWD: Last Candidate
Working Draft
5
6
7
" CR: Candidate Release
" PR: Production Release
36. PR
CR
LCWD
WD
Standardization Status
the gaps between W3C APIs and browser adoption
◦Geolocation
◦Vibration
◦Battery
◦Compass
◦Network
◦Microphone
◦Camera
◦Notifications
◦SMS
◦Calendar
◦Filesystem
◦Telephony
◦Contacts
◦NFC ◦WiFi
None ◦Power management
◦Audio Settings
◦Bluetooth
ED
0
1
" ED: Early Draft
" WD: Working Draft
Page 36
◦Motion
Number of adopting browsers
2
3
4
" LCWD: Last Candidate
Working Draft
5
6
7
" CR: Candidate Release
" PR: Production Release
37. HTML5 GAPS: Performance IS THE MOST COMMON COMPLAINT
“JavaScript will be always slower due to
it’s nature (high level language).”
Max Flirtman, Author - Speaker - Web developer
“We put all our efforts in performance and
user experience.”
Gabriel Tavridis, Product Manager, Appcelerator
“Quality and user experience is top
priority for us. Therefore, we prefer going
with a Native API.”
Apostolos Papadopoulos, Author of 4sqwifi
Page 37
HTML5 is slower by
definition
Performance as a value
proposition for tool
vendors
Developers choose
Native SDKs for
performance reasons
38. HTML5 GAPS: JAVASCRIPT Performance IS ALL ABOUT POLITICS
JavaScript performance is highly debated. Nevertheless …
1. CPUs get better;
e.g. iPhone 5S has twice the CPU power of iPhone 5.
2. JavaScript compilers improve;
e.g. JIT is 5 times slower than native performance. Asm.js promises approx. 1.3
times slower.
But the real problem is browser politics.
! Besides Opera, all major browser vendors are mobile OS vendors;
! Google promotes Native Chrome Apps;
! Apple is keen to implement all latest standards but leaves out
performance related APIs, e.g. WebGL.
Page 38
39. HTML5 GAPS: browser politics
“We need to attract more developers to
create a need that will inevitably force the
browser vendors to implement new
standards and improve the performance.
Right now browser vendors have all the
power and we need to somehow entice
them – create the demand.”
Ran Ben Aharon, Head of Front End Development,
Everything.me
Page 39
Use developers
as lobbyists
40. HTML5 GAPS: DEVELOPMENT TOOLS
“Hearing Mark Zuckenberg denounce
HTML5 made me angry at first, but then I
looked at some data and realized that the
main reason was not performance or APIs
but the lack of memory management and
debugging tools.”
Ran Ben Aharon, Head of Front End Development,
Everything.me
“It would be great to have something like
yslow (debugging tool) for game
developers.”
Louis Stowasser, Author of CraftyJS
Page 40
Profiling and debugging
tools are missing from
HTML5
41. HTML5 GAPS: DEVELOPMENT TOOLS
“The biggest issue for HTML5 is the
maturity of tools.”
Robert Shilston, Director of FT labs, Financial Times
Existing tools are not
good enough
“Right now, HTML5 is missing a toolchain,
from prototyping to publishing […] it lacks
the one-package onboarding that comes
with Native SDKs.”
HTML5 is missing a
toolchain, not just
individual tools
Andrea Trasatti, Developer Evangelist, Nokia
Page 41
42. HTML5 GAPS: EDUCATION
“Some use cases are not ready for HTML5
to support. For others HTML5 is already
ahead.”
Robert Shilston, Director of FT labs, Financial Times
“From a business standpoint, there's a lot
of education needed for the acceptance of
HTML5. There's a gap between what we
developers can provide and what the
clients think we can provide.”
Ciprian Borodesku, CEO, Web Crumbz
Page 42
Need to educate the
market on HTML5’s
capabilities
44. Power management and wifi APIs: BIGGEST CHANGE DRIVERS
Power Management and WiFi are the two most important APIs
currently missing from HTML5.
!
The mobile browser is the most popular route to market;
61% of HTML5 mobile devs use the browser to develop a mobile app.
!
Yet only 37.22% of Android apps (US) can be implemented with HTML5 via
the mobile browser;
!
Implementing Power Management and WiFi APIs in the mobile browser
would result to an astonishing 20.83% rise in the number of apps that can be
created with HTML5;
Recommendation:
- Implement Power Management and WiFi APIs.
Page 44
45. PACKAGED WEB APPS: fragmentation delays adoption
Standardization of packaged web apps (native JS apps) reduces the cost
for HTML5 developers to reach more devices.
!
Each vendor currently has its own specification of how native JS apps are
packaged;
e.g. Firefox OS, Blackberry Webworks, Windows 8, Tizen, etc.
!
Standardization would set the foundation for HTML5 to reach more devices;
Apps created for Firefox OS or Tizen would be possible to run Windows 8 or
BB WebWorks
Recommendation:
- Standardize packaged web apps.
Page 45
46. Device identity API: A BETTER SOLUTION TO COOKIES
! Identity is critical to advertising and search business models.
! It’s also critical for content personalization, device adaptation, user
tracking, user analytics, customer support, bug tracking, campaign
management and many more functions.
! Mozilla already has the Persona identity feature
Recommendation:
Propose a device identity API as a better alternative to cookies that eases
privacy concerns and follows the user across mobile and desktop.
Page 46
47. THE HTML5 BRAND suffers from F.U.D.
HTML5 has received endless criticism, centered on opinion, not facts.
Best way to address that is with more facts. Best facts are success stories
from high profile HTML5 apps, addressing specific developer concerns.
!
Mobile developers identify performance being the #1 reason that stops them
from using HTML5 as a main developer platform;
Stoppers: Performance 45.7%, APIs 37.3%, Tools 20.5%, Monetization 16.1%
!
Robert Shilston, director of FT labs, argues the problem is not performance,
but the maturity of [instrumentation] tools.
Recommendation:
- Showcase where HTML5 apps can go (e.g. www.HTML5cando.com);
- Educate around big brands (FT, game publishers) using HTML5;
- Educate developers around HTML5 routes beyond the browser
Page 47
48. HTML5 TOOLS: A CAR without a Dashboard
HTML5 is like a car without a dashboard. Debugging, editing, profiling
and instrumentation tools are missing.
!
34% of mobile developers say HTML5 needs better development environment
to compete with native SDKs;
!
Each browser vendor has its own development tools. Chrome dev tools is the
most popular.
Chrome dev tools 65%, Firebug 38.6%, Firefox dev tools 31.2%.
!
Developers need more profiling tools like YSlow;
Yslow gives insights on what to fix, not just data on the problem.
Recommendation:
- Implement a Debug API to create a platform for debugging tools.
Page 48
49. BROWSER POLITICS
Politics play key role to API browser adoption.
!
Vibration and Battery API, both in W3C Candidate Release state (pre-final)
are implemented by just a single mobile browser: Firefox;
!
Filesystem API, still a W3C Working Draft, is implemented by all 7 popular
mobile browsers.
!
Motion API, still in W3C Early Draft state (the very first state an API is
introduced), is implement by 6/7 mobile browsers.
Recommendation:
- Use developers as lobbyists on the need for browser vendors to
implement missing APIs.
- Make sure that missing APIs become a competitive metric for browser
vendors. Create a leaderboard for shaming browsers for missing APIs.
Page 49
50. Thanks for listening!
Knowledge. Passion. Innovation.
Questions / comments?
hello@visionmobile.com
Want to follow the discussion?
@visionmobile
@tefdigital
Want to learn more?
visionmobile.com/blog
blog.digital.telefonica.com12 November 2010
Updated:
Page 50
Copyright VisionMobile 2011
52. VisionMobile | THE LEADERS IN APP ECONOMY RESEARCH
Developer Economics
Mobile Innovation Economics
Trends watch
The biggest, most global developer
research platform
Thought-leading economics for
managing disruption and reinventing
your business
Tracking app and developer trends
Tier-1 clients
Digital ecosystem experts
Media coverage
trusted by the top brand names in
mobile
Thought leaders in the economics of
ecosystems and telecoms in the
software era
Global media reach
Page 52