Beyond the Browser: HTML5 and the Evolving Mobile Web

Chris Smith & Laurent HassonResearch In Motion

BlackBerry Loves the Web

• Industry leading webkit browser with best in class standards support• Full Web Application platform across tablet and smartphones• Leading edge web dev tools for inspection, debugging, emulation

Terrible user experienceDumbed down, constrained contentNon-standard, completely fragmentedNo security model, not-sticky, sandboxedBrowser chrome (yuck)No local content & storage

WMLMobile Profiles

WAP

XHTML/Mobile

Flash Lite HDMLTTML

.mobi

1st Gen Mobile Web

Full Desktop web content on Mobile Web Standards driven (HTML CSS, JavaScript) Mobile Optimized

The rise of HTML5 and CSS3• Store large data using HTML5 storage and stop sending fat cookies over-the-air• Use webWorkers to move heavy processing and blocking communications off the main thread• Take advantage of HTML5 app cache so your application will work out of coverage• Use HTML5 form controls, they do good things on mobile

2nd Gen Mobile Web

HTML5 address key native integration constraints by providing offline storage, proper threading, content cache and data access (geolocation)

But … native integration is sandboxed and not-extensible

Without a security model sensitive user data remains out of reach

There is no way to escape the browser chrome to support alternate entry points and navigation modes

The full Native application experience remains out of reach

Browser Limitations

User interface entirely authored in HTML/CSS

Application logic written in JavaScript with full support for standard frameworks

Full support for HTML5 APIs for threading, local storage, Geolocation

Complete security model allowing full access outside the browser to file system, user data and applications

Deeply integrated native application experience without the browser chrome

Push enabled to allow content providers to target their audience whenever they want wherever they are

Benefits of both native and browser discovery and distribution

Next Gen Mobile Web

BlackBerryWebWorks

7

Pure Native Pure Web

Native UI Browser-based UIAll Native logic Mostly native logic

Mostly Browser logic All Browser logic

Some local web resources All remote web resources

All local web resources

Hybrid model gives developers choice to leverage best of native and web without compromises

Hybrid

Application Continuum

A BlackBerry WebWorks app is a standalone application, created using standard web technologies, that provides full integration with native APIs

OSS Community http://www.github.com/blackberry

BlackBerryWebWorks

BlackBerry WebWorks Framework

Web Inspector: Ultimate Web Dev Tool

Ripple: Open Browser-based Emulator

• HW acceleration with CSS3 in mobile Web browsers is underutilized– Nothing much has changed in the past 4 years since slide/fade/zoom/flip.– Flash in comparison for instance has many libraries of very cool effects

• Smartphones and tablets have the horse power to do better– Some samples out there, but results in lots of CSS and JS to setup, requiring

lots of skills• Alice (A Lightweight Independent CSS Engine) is a micro-library

focused on packaging advanced hardware accelerated visual effects for Web apps– Framework and application independent (can be plugged into Dojo, jQuery,

Sencha Touch or other libraries)– Single-line-of-code setup– Physics and Organics– Rich visual effects like bounce, toss, flip, fold

Alice: Micro-library of visual effects

Thank You

http://www.blackberryparnerstfund.com/challenge

http://www.blackberry.com/developers