25
Blurring the difference of web & native apps with HTML5 and IE 9 Saurav Srivastava about.me/ gxsaurav

Blurring the difference between native and web apps with HTML5 & IE9

Embed Size (px)

DESCRIPTION

My presentation at Microsoft TechEd On the road, New Delhi on June 4 2011. Demo slides are not yet uploaded. I will be updating them soon.

Citation preview

Page 1: Blurring the difference between native and web apps with HTML5 & IE9

Blurring the difference of web & native apps with

HTML5 and IE 9

Saurav Srivastavaabout.me/gxsaurav

Page 2: Blurring the difference between native and web apps with HTML5 & IE9

Traditional app development

Page 3: Blurring the difference between native and web apps with HTML5 & IE9

Cross platform development

Page 4: Blurring the difference between native and web apps with HTML5 & IE9

Cross platform development

Page 5: Blurring the difference between native and web apps with HTML5 & IE9

New cross platform development

= $$$

Page 6: Blurring the difference between native and web apps with HTML5 & IE9

HTML5 based cloud connected app to rescue

Page 7: Blurring the difference between native and web apps with HTML5 & IE9

Cloud app development

Page 8: Blurring the difference between native and web apps with HTML5 & IE9

+

Page 9: Blurring the difference between native and web apps with HTML5 & IE9

Why HTML5?

?

Page 10: Blurring the difference between native and web apps with HTML5 & IE9

Why HTML5?

• Easier to make web apps

• Work like native apps.

• Drag & drop

• Video and Audio

• Form control

• Local Storge

• Offline database storage

• Drawing on Canvas

• Geolocation

• Offline app cache

• WebSockets

=

and more…

http://html5demos.com/

=

Page 11: Blurring the difference between native and web apps with HTML5 & IE9

They are already available

Page 12: Blurring the difference between native and web apps with HTML5 & IE9

They look and work just like native apps

HTML5 websiteNative Android app

Page 13: Blurring the difference between native and web apps with HTML5 & IE9

Support for HTML5 Audio as well as Flash

Page 14: Blurring the difference between native and web apps with HTML5 & IE9

Automatic scaling for devices

Page 15: Blurring the difference between native and web apps with HTML5 & IE9

Native drag and drop of files

http://net.tutsplus.com/tutorials/html-css-techniques/implementing-html5-drag-and-drop-new-premium-tutorial/

Page 16: Blurring the difference between native and web apps with HTML5 & IE9

Native audio and video

Playback controls available by default in IE 9

Page 17: Blurring the difference between native and web apps with HTML5 & IE9

Flash to HTML5

Page 18: Blurring the difference between native and web apps with HTML5 & IE9

Resolution & DPI independent images using Canvas, even games

Page 19: Blurring the difference between native and web apps with HTML5 & IE9

WebSockets - Two way communication over TCP

http://net.tutsplus.com/tutorials/javascript-ajax/start-using-html5-websockets-today/

Page 20: Blurring the difference between native and web apps with HTML5 & IE9

IE 9 makes web apps work like native app

Page 21: Blurring the difference between native and web apps with HTML5 & IE9

IE 9 makes web apps work like native app

Office Web apps: Lightweight version of Microsoft Office

Page 22: Blurring the difference between native and web apps with HTML5 & IE9

IE 9 gives Offline access to apps using AppCache & LocalStorage

http://www.html5rocks.com/tutorials/appcache/beginner/

+No reloadingFaster responseOffline

=

Page 23: Blurring the difference between native and web apps with HTML5 & IE9

IE 9 hardware accelerates HTML5

Page 24: Blurring the difference between native and web apps with HTML5 & IE9

IE 9 hardware accelerates HTML5

+ =

Page 25: Blurring the difference between native and web apps with HTML5 & IE9

Where to begin

http://msdn.microsoft.com/en-us/ie/aa740469

http://blogs.msdn.com/b/ie/

http://technet.microsoft.com/en-us/ie/gg252704