php in a mobile ecosystem (zendcon 2010)
DESCRIPTION
A look at PHP's role in mobile web and app development. Delivered at Zendcon 2010 on November 3, 2010. If you like the content or want to give feedback or if you need help with any of the concepts mentioned here, contact me at egeniq.com.TRANSCRIPT
PHP in a Mobile EcosystemIvo Jansch - EgeniqNovember 3, 2010 - Zendcon
1Wednesday, November 3, 2010
About Egeniq
Startup
Mobile
Tech
Knowledge
Geeks
Development
2Wednesday, November 3, 2010
About Me
@ijansch
Developer
Author
Entreprenerd
PHP
3Wednesday, November 3, 2010
Part 1Let’s think about mobile for a few minutes
4Wednesday, November 3, 2010
The Webis increasingly portable
5Wednesday, November 3, 2010
It’s revolutionary
Much like when
the phone lost
its wall socket
6Wednesday, November 3, 2010
The Internet Of Thingsivo-imac:~ ivo$ ping fridgePING fridge (192.168.1.138): 56 data bytes
7Wednesday, November 3, 2010
The Web versus The Internet
8Wednesday, November 3, 2010
Usage Characteristics
On the go
Short attention span
Avoid typing
To the point / ad hoc
Omnipresent
9Wednesday, November 3, 2010
Mobile Technologies
Objective-C (iPhone, iPad, iPod Touch, Apple TV)
Java (Android, Blackberry, Symbian)
HTML5 / Javascript (Any)
PHP (Any)
10Wednesday, November 3, 2010
The App vs. The Browser
11Wednesday, November 3, 2010
Browser based applications
Write once, run anywhere
Online
Requires browser
Page based
‘Stateless’
12Wednesday, November 3, 2010
Native Apps
On- and offline
Event based
Native device experience
Convenient access to device features
Stateful
Monetization through App Stores
13Wednesday, November 3, 2010
Some statistics
Android Market: 100.000 apps
Apple App Store: 300.000 apps
Web: 3.000.000 websites optimized for mobile
Sources:
http://www.bizreport.com/2010/10/dotmobi-2000-growth-in-number-of-mobile-ready-websites.html#
http://twitter.com/AndroidDev/status/28701488389
http://www.silobreaker.com/apples-app-store-crosses-300000-apps-5_2263799272514256896
14Wednesday, November 3, 2010
Predictions
15Wednesday, November 3, 2010
Part 2Browser Based Mobile Apps
16Wednesday, November 3, 2010
Device Detection
It’s all in the User Agent
Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_1 like Mac OS X; en-us) AppleWebKit/532.9 (KHTML, like Gecko) Version / 4.0.5 Mobile/8B117 Safari/6531.22.7
Mozilla/5.0 (Linux; U; Android 2.1-update1; nl-nl; HTC Hero Build/ERE27) AppleWebKit/ 530.17 (KHTML, like Gecko) Version/4.0 Mobile Safari/ 530.17
17Wednesday, November 3, 2010
Device Detection
18Wednesday, November 3, 2010
Device Detection
http://detectmobilebrowsers.mobi/
Downloadable PHP library for device detection
Online code generator
Donationware
Ugly code, well documented
19Wednesday, November 3, 2010
Device Detection
http://www.deviceatlas.com
Database of device properties
Available online, as API and downloadable json file
Free for development
~99$/year for production
http://wurfl.sourceforge.net/
20Wednesday, November 3, 2010
Device Detection
Considerations:
Don’t redirect to homepage
Offer ‘classic’ option
Don’t make assumptions on screen size
21Wednesday, November 3, 2010
Zend Framework Example
Take advantage of ZF’s powerful MVC set up
View scripts determine layout of actions
Layout script wraps everything into main layout
Use Bootstrapper to detect device and setup MVC
22Wednesday, November 3, 2010
layouts/scripts/layout_mobile.phtml
23Wednesday, November 3, 2010
views_mobile/scripts/index/index.phtml
24Wednesday, November 3, 2010
Bootstrap.php
25Wednesday, November 3, 2010
Result
Try it at http://egeniq.com/demo/zf/public
26Wednesday, November 3, 2010
Zend_Http_UserAgent
New in Zend Framework 1.11
Can work with WURFL or Device Atlas
27Wednesday, November 3, 2010
UI Design
Hover = evil
‘Finger Friendly Design’
‘Touch Driven Development’
Screens are getting bigger and (!) smaller
28Wednesday, November 3, 2010
Scalable websites
http://www.niemanlab.org/2010/09/nyts-opinion-pages-continue-the-march-toward-app-inspired-design/
29Wednesday, November 3, 2010
HTML5 is easy
<!doctype html> - period.
<script> or <style> - period.
Semantics: header, footer, section, article tags
30Wednesday, November 3, 2010
HTML5 is powerful
localStorage
<video>
<canvas>
<svg>
<input type=”number”> and many other form fields
navigator.geolocation.getCurrentPosition();
31Wednesday, November 3, 2010
Browsers love HTML5
Browsers supporting HTML5:
Firefox
Safari
Opera
All the mobile browsers
IE (sort of, no support for <article> until IE9)
32Wednesday, November 3, 2010
Things to consider
Don’t just scale the layout, scale content too
Consider ‘scenario based content management’
33Wednesday, November 3, 2010
jQTouch
34Wednesday, November 3, 2010
jQTouch
iPhone experience in HTML5
http://jqtouch.com/
jQuery based
MIT License
Give it a try: http://jqtouch.com/preview/demos/main
35Wednesday, November 3, 2010
Alternatives
jQuery Mobile
1.0 alpha was released at October 16, 2010
http://jquerymobile.com/
Sencha Touch
From the makers of jqTouch
Tablet support
http://www.sencha.com/products/touch/
36Wednesday, November 3, 2010
You already know PHP
Your PHP skills + HTML5 = easy mobile websites
37Wednesday, November 3, 2010
Part 3Native Apps
38Wednesday, November 3, 2010
PHP’s role in native apps
iPhone App
Android App
Blackberry App
API
39Wednesday, November 3, 2010
Optimize APIs for mobile
Content optimization
Scalability
Longevity
Security
Client/Server considerations
40Wednesday, November 3, 2010
Content Optimization
Consider CPU and memory constraints
Prefer JSON over XML
Compress data
Keep responses small
But not too small (connection / routing overhead)
41Wednesday, November 3, 2010
Scalability
AppStore featured/top listings Slashdot effect
Consider the 80/20 rule of app popularity though
42Wednesday, November 3, 2010
Longevity
Apps have different deployment patterns
No ‘quick fix’ in the application as in web apps
Client/Server asynchronous updates
Backwards compatibility
Versioned API URLs:
http://iportfolio.api.egeniq.com/portfolios/1.0/mvb/collections.json
43Wednesday, November 3, 2010
Longevity
How long do you support your APIs?
Can’t force people to delete their Apps
Provide clean fallback
Synchronized instead of real-time data
Implement status check API calls
44Wednesday, November 3, 2010
API Security
TLS/SSL
Basic Auth
OAuth? XAuth!
PKI / TLSAuth
Signed URLs:
?x=1&y=2 &signature=hash(secret, time limit, params)
45Wednesday, November 3, 2010
Client/Server considerations
Image Processing in the API, instead of App
Use Imagick / GD etc.
Trade-off between bandwidth and processing power
Apps support threading / asynchronisity
Fire-and-forget API design
Prepare/getResult call duos
Push features into PHP APIs for reuse
46Wednesday, November 3, 2010
PHP’s role in native apps
PHP has native support for:
Web services
JSON
Compression
Image manipulation
Egeniq’s number 1 choice for App APIs
25-30% of App development time = API
47Wednesday, November 3, 2010
Part 4Best of Both Worlds
48Wednesday, November 3, 2010
HTML5 in the App Store
HTML5 on the server, supports PHP:
IPFaces - http://www.ipfaces.org/
HTML5 on the device, no (or limited) support for PHP:
AppCelerator - http://appcelerator.com/
Phonegap - http://phonegap.com
49Wednesday, November 3, 2010
Part 5Random bits if time permits
50Wednesday, November 3, 2010
Running PHP on the device
First: Why??!
PHP For Android (PFA)
http://phpforandroid.net/
PAMP for Symbian
http://wiki.opensource.nokia.com/projects/PAMP
51Wednesday, November 3, 2010
Symfony Mobile
Mime-type based optimisation
http://www.symfony-project.org/blog/2008/06/09/how-to-create-an-optimized-version-of-your-website-for-the-iphone-in-symfony-1-1
52Wednesday, November 3, 2010
‘Lemon ADE’ AST editor
53Wednesday, November 3, 2010
Resources for PHP/Mobile
http://www.egeniq.com/blog
http://mobile.phpmagazine.net/
http://thoomtech.com/iphone/objc-for-php-developers-part-1/
54Wednesday, November 3, 2010
Thank [email protected] http://www.egeniq.com @ijansch @egeniq
Please leave feedback at: http://joind.in/225455Wednesday, November 3, 2010
CreditsPictures used in this presentation are creative commons attribution licensed pictures. Here are the owners and the URLS where the originals can be found:
‘Dow says POO’ by Stepleton - http://www.flickr.com/photos/29407923@N03/2899705638/
‘The telephone’ by Tylerdurden - http://www.flickr.com/photos/tylerdurden/529028040/
‘Web’ by Kurtxio - http://www.flickr.com/photos/kurtxio/2182760200/
‘Heavy cloud, no rain’ by Robynsnest - http://www.flickr.com/photos/robynsnest/12405841/
‘Wireless fridge’ from http://www.wirelessgoodness.com/tag/srt746awtn/
‘Army iphone app’ by Soldiersmediacenter - http://www.flickr.com/photos/soldiersmediacenter/4271795260/
‘Icon_safari_hires’ by Hans Dorsch - http://www.flickr.com/photos/hansdorsch/2861804087/
‘Thinking’ by Karola - http://www.flickr.com/photos/karola/3623768629/
‘Jus'a web’ by Jusfi - http://www.flickr.com/photos/jusfi/2921202536/
‘iPad :)’ by Korosirego - http://www.flickr.com/photos/korosirego/4334862666/
‘I've got a monkey on my back’ by Keven Law - http://www.flickr.com/photos/kevenlaw/2698946160/
‘Locked steel’ by Darwinbell - http://www.flickr.com/photos/darwinbell/321434733/
‘4 Biscuits’ by Barnoid - http://www.flickr.com/photos/barnoid/2025811494/
56Wednesday, November 3, 2010