June BellaVita Monthly Update and Training with Gary Hasson, President
Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In...
-
Upload
jonas-potter -
Category
Documents
-
view
218 -
download
0
Transcript of Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In...
![Page 1: Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In Motion.](https://reader035.fdocuments.in/reader035/viewer/2022062500/56649e9c5503460f94b9d4ef/html5/thumbnails/1.jpg)
Beyond the Browser: HTML5 and the Evolving Mobile Web
Chris Smith & Laurent HassonResearch In Motion
![Page 2: Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In Motion.](https://reader035.fdocuments.in/reader035/viewer/2022062500/56649e9c5503460f94b9d4ef/html5/thumbnails/2.jpg)
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
![Page 3: Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In Motion.](https://reader035.fdocuments.in/reader035/viewer/2022062500/56649e9c5503460f94b9d4ef/html5/thumbnails/3.jpg)
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 HDML
TTML
.mobi
1st Gen Mobile Web
![Page 4: Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In Motion.](https://reader035.fdocuments.in/reader035/viewer/2022062500/56649e9c5503460f94b9d4ef/html5/thumbnails/4.jpg)
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
![Page 5: Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In Motion.](https://reader035.fdocuments.in/reader035/viewer/2022062500/56649e9c5503460f94b9d4ef/html5/thumbnails/5.jpg)
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
![Page 6: Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In Motion.](https://reader035.fdocuments.in/reader035/viewer/2022062500/56649e9c5503460f94b9d4ef/html5/thumbnails/6.jpg)
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
![Page 7: Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In Motion.](https://reader035.fdocuments.in/reader035/viewer/2022062500/56649e9c5503460f94b9d4ef/html5/thumbnails/7.jpg)
7
Pure Native Pure Web
Native UI Browser-based UI
All 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
![Page 8: Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In Motion.](https://reader035.fdocuments.in/reader035/viewer/2022062500/56649e9c5503460f94b9d4ef/html5/thumbnails/8.jpg)
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
![Page 9: Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In Motion.](https://reader035.fdocuments.in/reader035/viewer/2022062500/56649e9c5503460f94b9d4ef/html5/thumbnails/9.jpg)
Web Inspector: Ultimate Web Dev Tool
![Page 10: Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In Motion.](https://reader035.fdocuments.in/reader035/viewer/2022062500/56649e9c5503460f94b9d4ef/html5/thumbnails/10.jpg)
Ripple: Open Browser-based Emulator
![Page 11: Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In Motion.](https://reader035.fdocuments.in/reader035/viewer/2022062500/56649e9c5503460f94b9d4ef/html5/thumbnails/11.jpg)
• 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
![Page 12: Beyond the Browser: HTML5 and the Evolving Mobile Web Chris Smith & Laurent Hasson Research In Motion.](https://reader035.fdocuments.in/reader035/viewer/2022062500/56649e9c5503460f94b9d4ef/html5/thumbnails/12.jpg)
Thank You
http://www.blackberryparnerstfund.com/challenge
http://www.blackberry.com/developers