New trends of web technology on mobile: HTML5, PhoneGap & NaCl - Barcamp Saigon July 2011

www.bkitclub.net/barcamp 1

NEW TRENDS of WEB TECHNOLOGY ON MOBILE

HCMC. University of Technology

Nguyễn Mậu Quang Vũ BKIT Web

Nguyễn Văn Lợi BKIT Mobile

July 24th, 2011

PROBLEMS

HTML5 & JavaScript become new trends of web application JavaScript: 5th popular language (langpop.com)

Fragmentation in Mobile Platforms Can code once, run anywhere ?

JavaScript’s performance is very slow Can play BIG game on web browser ? Combine SAFE & PORTABLE of Web with FAST of C ?


`

PhoneGap HTML5 NaCl

July 24th, 2011

NEW TRENDS

Trends Main idea Characteristics State

HTML5 HTML run in Mobile Browser

Portable Slow Access device

Working Not fully supported

PhoneGap framework

HTML embedded in Native App

Local Slow Access device

Close Beta

Native Client

Native Code embedded in HTML

Portable FAST as C Lack features

First: Feb 2011, beta Only Google Chrome supports


`

PhoneGap HTML5 NaCl

July 24th, 2011

www.bkitclub.net/barcamp

PhoneGap HTML5 NaCl

4

HTML 5 ON MOBILE

HTML5 – NEW WEB APP TREND

More and more developers use HTML5 & JavaScript HTML5 with new strong features

Can play real-time games, video, 3D and more. Strong as desktop / native applications. Access device features as native applications … but not fully supported.

JavaScript Script, dynamic, OOP, functional, garbage collection … Tools from community

SAFE & PORTABLE But SLOW


PhoneGap HTML5 NaCl

5

` July 24th, 2011

SUPPORTED FEATURES

Features IE 9 Chrome 12 FF 6 beta Android 2.2 iOS 5

History

Canvas

Video & Audio

Web Worker

LocalStorage

Offline

Geolocation

Capture API

Messaging API

Device Orientation


PhoneGap HTML5 NaCl

6

` July 24th, 2011

CONCLUSION

Still in working We have to wait in many years

Become new trends of web applications Compared with native mobile applications ?

Visit: www.bkitclub.net/barcamp/2011/web-trends/test-features.html

WE WAIT


PhoneGap HTML5 NaCl

7

` July 24th, 2011

http://www.bkitclub.net/barcamp/2011/web-trends/test-features.html






PhoneGap HTML5 NaCl

8

PhoneGap FRAMEWORK


HOW PHONEGAP WORK ?


PhoneGap HTML5 NaCl

9

July 24th, 2011 `


PHONEGAP CAN `

www.bkitclub.net/barcamp www.bkitclub.net/barcamp

PhoneGap HTML5 NaCl

10

July 24th, 2011


PhoneGap HTML5 NaCl

DEMO


`

www.bkitclub.net/barcamp www.bkitclub.net/barcamp

PhoneGap HTML5 NaCl

12

www.bkitclub.net/barcamp/2011/web-trends

July 24th, 2011

http://www.bkitclub.net/barcamp/2011/web-trends




PhoneGap HTML5 NaCl

13

CONCLUSION `

Creative Still in beta test Use web developer favorite languages: HTML & JavaScript Build Service

Free & Open Source

WRITE ONCE – RUN ANYWHERE

July 24th, 2011


PhoneGap HTML5 NaCl

14

NATIVE CLIENT

INTRODUCE `

JavaScript’s performance is very slow Can play BIG game on web browser ? Combine SAFE & PORTABLE of Web with FAST of C ?

Run Native code in Web Application FAST as 95% Desktop app

5% for sandbox checking

State 2008: Research by Google Feb 2011: First release July 2011: Version 0.4


PhoneGap HTML5 NaCl

15

July 24th, 2011

WHY ?

Reuse code Move Desktop app to Web App easily

FAST as 95% Desktop app Write web app in many languages

C, C++, C#, Python …

SAFE and PORTABLE Sandbox

Games & Multimedia Decode media codec

`


PhoneGap HTML5 NaCl

16

July 24th, 2011

IMPLEMENTATION `


PhoneGap HTML5 NaCl

17

July 24th, 2011

CODE

Files .nmf : Native Client Manifest .nexe: Native Client Executable .html, .js

HTML <embed src="foo.nmf" type="application/x-nacl" />

Pepper API void HandleMessage

(const pp::Var& var_message)

{

PostMessage(var_reply);

}; JavaScript helloModule.postMessage

('sample message');

`


PhoneGap HTML5 NaCl

18

July 24th, 2011

DEMO

www.bkitclub.net/barcamp/2011/web-trends

`


PhoneGap HTML5 NaCl

19

July 24th, 2011





PhoneGap HTML5 NaCl

20

CONCLUSION `

Creative & Fun Combine SAFE & PORTABLE of Web App with FAST of C ! Lack Features Still in development

But Microsoft, Mozilla, Opera do NOT like NaCl

Security ?

ChromeOS & Web Store ?

Or Android ?

WE WAIT

July 24th, 2011


NaCl PhoneGap HTML5

21

NEW TRENDS of WEB TECHNOLOGY ON MOBILE

`

Trends Main idea Characteristics State

HTML5 HTML run in Mobile Browser

Portable Slow Access device

Working Not fully supported

PhoneGap framework

HTML embedded in Native App

Local Slow Access device

Close Beta

Native Client

Native Code embedded in HTML

Portable FAST as C Lack features

First: Feb 2011, beta Only Google Chrome supports


PhoneGap HTML5 NaCl

22

July 24th, 2011 NEW TRENDS


THANKS FOR YOUR ATTENTION

Q & A

HCMC. University of Technology

Nguyễn Mậu Quang Vũ BKIT Web

[email protected] or connect me on FACEBOOK

Nguyễn Văn Lợi BKIT Mobile

[email protected]

mailto:[email protected]

mailto:[email protected]