php in a mobile ecosystem

Post on 15-Jan-2015

5.329 Views

Category:

Technology

0 Downloads

Preview:

Click to see full reader

DESCRIPTION

Updated version of my PHP in a mobile ecosystem talk. Looks at how PHP plays a role in the mobile world, and explains what php developers need to know about mobile development. Presentation delivered at the PHPBenelux 2011 conference and the PHP UK conference 2011.

TRANSCRIPT

PHP in a Mobile EcosystemIvo JanschJanuary 28, 2011 - PHPBenelux Conference

About Egeniq

Startup

Mobile

Tech

Knowledge

Geeks

Development

About Me

@ijansch

Developer

Author

Entreprenerd

PHP

Part 1Let’s think about mobile for a few minutes

The Webis increasingly portable

It’s revolutionary

Much like when

the phone lost

its wall socket

The Internet Of Thingsivo-imac:~ ivo$ ping fridgePING fridge (192.168.1.138): 56 data bytes

The Web versus The Internet

Usage Characteristics

On the go

Short attention span

Avoid typing

To the point / ad hoc

Omnipresent

Context Awareness

‘Pocket Essentials’

Usage - ‘Couch Computing’

Relaxed

Freedom

Consumption

Convergence

Companion

Mobile Technologies

Objective-C (iPhone, iPad, iPod Touch, Apple TV)

Java (Android, Blackberry, Symbian)

HTML5 / Javascript (Any)

PHP (Any)

The App vs. The Browser

Browser based applications

Write once, run anywhere

Online

Requires browser

Page based

‘Stateless’

Native Apps

On- and offline

Event based

Native device experience

Convenient access to device features

Stateful

Monetization through App Stores

Predictions

Part 2Browser Based Mobile Apps

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

Device Detection

Device Detection

http://detectmobilebrowsers.mobi/

Downloadable PHP library for device detection

Online code generator

Donationware

Ugly code, well documented

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/

Device Detection

Considerations:

Don’t redirect to homepage

Offer ‘classic’ option

Don’t make assumptions on screen size

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

layouts/scripts/layout_mobile.phtml

views_mobile/scripts/index/index.phtml

Bootstrap.php

Result

Try it at http://egeniq.com/demo/zf/public

Zend_Http_UserAgent

New in Zend Framework 1.11

Can work with WURFL or Device Atlas

UI Design

Hover = evil

‘Finger Friendly Design’

‘Touch Driven Development’

Screens are getting bigger and (!) smaller

HTML5 is easy

<!doctype html> - period.

<script> or <style> - period.

Semantics: header, footer, section, article tags

HTML5 is powerful

localStorage

<video>

<canvas>

<svg>

<input type=”number”> and many other form fields

navigator.geolocation.getCurrentPosition();

Browsers love HTML5

Browsers supporting HTML5:

Firefox

Safari

Opera

All the mobile browsers

IE (sort of, no support for <article> until IE9)

Things to consider

Don’t just scale the layout, scale content too

Consider ‘scenario based content management’

jQTouch

jQTouch

iPhone experience in HTML5

http://jqtouch.com/

jQuery based

MIT License

Give it a try: http://jqtouch.com/preview/demos/main

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/

You already know PHP

Your PHP skills + HTML5 = easy mobile websites

Part 3Native Apps

PHP’s role in native apps

iPhone App

Android App

Blackberry App

API

Optimize APIs for mobile

Content optimization

Scalability

Longevity

Security

Client/Server considerations

Content Optimization

Consider CPU and memory constraints

Prefer JSON over XML

Compress data

Keep responses small

But not too small (connection / routing overhead)

Scalability

AppStore featured/top listings Slashdot effect

Consider the 80/20 rule of app popularity though

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

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

API Security

TLS/SSL

Basic Auth

OAuth? XAuth!

PKI / TLSAuth

Signed URLs:

?x=1&y=2 &signature=hash(secret, time limit, params)

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

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

Part 4Best of Both Worlds

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

Cross Compilers = Instant Coffee

Part 5Random bits if time permits

Running PHP on the device

First: Why??!

PHP For Android (PFA)

http://phpforandroid.net/

PAMP for Symbian

http://wiki.opensource.nokia.com/projects/PAMP

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

‘Lemon ADE’ AST editor

Thank Youivo@egeniq.com http://www.egeniq.com @ijansch @egeniq

Please leave feedback at: http://joind.in/2486

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/

‘Carbon Fibre Wallet’ by Ryan Loos - http://www.flickr.com/photos/rh1n0/4157547404/

‘Keys’ by Jamison Judd - http://www.flickr.com/photos/jamisonjudd/2419601050/

‘Phone Girl’ by Steffen - http://www.flickr.com/photos/re-ality/460465894/

‘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/

‘Add a spoonful of coffee’ by Martyn Wright - http://www.flickr.com/photos/35521221@N05/5181647830/

‘Locked steel’ by Darwinbell - http://www.flickr.com/photos/darwinbell/321434733/

‘4 Biscuits’ by Barnoid - http://www.flickr.com/photos/barnoid/2025811494/

top related