i Conference
2011, IUB
WEB APP PROS & CONS
A COMPARISON OF DEVELOPMENT
TECHNIQUES
ROB ELLIOTT
VISITING LECTURER,
PURDUE
SCHOOL OF
ENGINEERING AND TECHNOLOGY,
IUPUI
INTRO
“Nati ve” Apps:
Written in a programming language for a targeted operating system
Apple iOS Devices: iOS SDK, using Objective
-
C
Android Devices: Android SDK, using Java
Have access to all features of the hardware
Camera, GPS, Accelerometer, Microphone, etc.
Are distributed via the respective app “marketplace”
iTunes App Store, Android Marketplace
iOS apps are subjected to rigorous testing/acceptance process; Android
apps are submitted to the Marketplace with little oversight
Development fees:
Apple: SDK is free (registration required), $99 to submit apps to App Store
Android: SDK is free, $25 to submit apps to Android Marketplace
NATIVE VS. WEB APPS
“Web” Apps:
Web
-
based applications written with traditional web programming
languages
HTML/CSS, Javascript, PHP/.NET/JSP
Have limited access to device hardware (depends on platform)
Can be used cross
-
platform (some restrictions apply)
Most are intended to be used when the device is online; some have
capabilities for offline use
Most platforms have some semblance of a “web app store,” but the
stores and their contents vary widely
No centralized marketplace for all platforms
NATIVE VS. WEB APPS
INTRO
$$$ (or the potenti al for $$$)
i OS App Store provi des a “fi l ter” for apps, so users have at l east
one means of gaugi ng thei r worth
Al l app marketpl aces provi de rati ngs, comments, ranki ngs
Interacti ng wi th the hardware provi des si gni fi cant app potenti al
Users have been “trai ned” to search the markets fi rst
Many users don’t know the di fference between nati ve and web
apps
Oh, and $$$
NATIVE APPS: WHY SO POPULAR?
INTRO
Context, context, context
Cross
-
platform development is
huge
Disney acquires Rocket Pack (1
y.o
. Finnish startup) for $10m
-
$20m
1
Moblyng
raising $10.9M to make mobile HTML5
games
2
Provide convenient means of entry to existing web
applications w/o extensive new development
When hardware functionality and offline use is not absolutely
critical to the function of the application
If you have a broad user base ready to use your app
WHEN TO USE WEB APPS?
WEB ENVIRONMENTS
The primary layout engines web developers need to use today
include:
Webkit
(Firefox, Chrome/Android, Palm, Symbian, Blackberry 6.0+)
Trident (Internet Explorer/IE Mobile)
Presto (Opera, Opera Mini)
3
LAYOUT ENGINES
ENVIRONMENTS
LAYOUT ENGINE MOBILE USAGE
}
Webkit
Presto
4
LAYOUT ENGINE MOBILE USAGE
}
Webkit
Presto
5
Open
-
source engine for web browsers
Most modern mobile browsers are
webkit
-
based
BIG exceptions: Internet Explorer, Opera
Supports the most common features of HTML5 & a large
amount of CSS3
Natively supports Javascript interaction with the DOM
(Document Object Model)
Critical for correctly rendering web applications on various platforms
and resolutions
WEBKIT
ENVIRONMENTS
ENVIRONMENTS
New! Improved! But i s i t sel l i ng?
Wi ndows,
obvs
, has huge, dedi cated fan base
Good reports on usabi l i ty, functi onal i ty of the
platform
and
hardware
. Not so good on the browser
Sti l l dependent on IE
No true HTML5/CSS3 statistics on IE Mobile 7
Desktop IE 9 supports 25% of HTML5; less than half of Desktop
Firefox
,
less than 1/3 of
Chrome
Late to the game (2.5
–
3 years after fi rst i Phone)
Where wi l l Noki a partnershi p l ead them?
No Wi ndows tabl et unti l Q3 2012??
WHAT’S UP WITH WINDOWS 7 MOBILE?
DEVELOPING WEB APPS
DEVELOPMENT
Can produce vivid, dynamic websites with high levels of
interaction
Can integrate web services (no need for local
datasources
)
HTML5 affords video, audio input
CSS3 includes animation, some 3D rendering
No need for Flash (!!!!!!)
Browser support varies widely
http://caniuse.com
Great comparison charts
Most data
-
driven features require the app to be used “online”
HTML 5 + CSS3 + JAVASCRIPT
Free with Apple SDK registration
Provides means to create Mac “widgets” and Safari/Mobile
Safari web apps
Gives developers a nice IDE for web app development
Includes images and usage guidelines to create a native iOS
-
looking web app
Produces web apps that look like iOS apps on any other
mobile browser
DASHCODE
DEVELOPMENT
DASHCODE
INTERFACE
DEVELOPMENT
One of a few products making their way into developers’
toolboxes
“Mobile Javascript Framework”
Allows developers to write standards
-
compliant code that then
renders uniquely on each supported mobile browser
Trending: write
-
once,
use
-
anywhere
Handles touch events,
offline storage
SENCHA
TOUCH
Source:
sencha.com
A twist on the write
-
once use
-
anywhere methodology
Imports web apps and produces
native
applications for 6
mobile platforms
Claims “thousands” of apps developed with
PhoneGap
Open
-
source, free
PHONEGAP
DEVELOPMENT
Source:
phonegap.com
CASE STUDIES
USE CASE
Had past experience
developing/supporting a
native app
Posted for iOS
dev
for
Basecamp Mobile app
Realized Android popularity
and were immediately
faced with hiring two
developers
Instead used in
-
house
development teams to
create mobile versions of
existing, highly
-
profitable
desktop web apps
37SIGNALS: BASECAMP MOBILE
Source: 37signals.com
USE CASE
Very well
-
received
web app in summer
2010
Reviews suggest
superior functionality
to native application
(HQ video option)
Ties directly into
users’ YouTube
account; favorites,
comments, ratings
YOUTUBE
CONCLUSIONS
CONCLUSIONS
PROS
No new
prog
. language
required
Cross
-
platform dev. is
significantly easier
Updates don’t require
re
-
approval (iOS)
Many SDKs and tools
available to speed
development
CONS
Limited access to
device hardware
No centralized market
for all platforms
Difficult to charge $
Offline usage can be
tricky if not done
properly
WEB APP PROS & CONS: SUMMARY
CONCLUSIONS
1.
Di sney
l ooks beyond apps wi th HTML5 game maker Rocket
Pack
http://venturebeat.com/2011/03/03/di sney
-
rocket
-
pack
-
acqui si ti on
/
2.
Mobl yng
rai si ng $10.9M to make mobi l e HTML5 games
http://venturebeat.com/2010/12/24/mobl yng
-
rai si ng
-
about
-
11m/?obref=
obi nsi te
3.
Opera: State of the Mobi l e Web,
http
://www.opera.com/smw/2011/01
/
4.
StatCounter
Gl obal
Stats,
http://gs.statcounter.com/#mobi l e_browser
-
ww
-
monthl y
-
201003
-
201102
-
bar
5.
StatCounter
Gl obal Stats,
http://gs.statcounter.com/#mobi l e_browser
-
na
-
monthl y
-
201003
-
201102
-
bar
REFERENCES
Enter the password to open this PDF file:
File name:
-
File size:
-
Title:
-
Author:
-
Subject:
-
Keywords:
-
Creation Date:
-
Modification Date:
-
Creator:
-
PDF Producer:
-
PDF Version:
-
Page Count:
-
Preparing document for printing…
0%
Σχόλια 0
Συνδεθείτε για να κοινοποιήσετε σχόλιο