Downloaded 12 times
Uploaded byFrédéric Harper
485 views
DevTeach Ottawa - Silverlight5 and HTML5
This document summarizes a presentation given by Frédéric HARPER and Laurent DUVEAU comparing the web development technologies Silverlight and HTML5. Some key points:- Silverlight is a plugin that allows developing rich desktop-style applications for web browsers, while HTML5 can be used on any device with recent browsers without plugins. - Both support development with Visual Studio and provide controls and capabilities for graphics, media, 3D, and data binding, though Silverlight controls and capabilities are more extensive currently.- Performance benchmarks comparing row processing, vector graphics, and bitmap manipulation between the two technologies were demonstrated.- The presenters concluded there is no clear winner currently as both technologies continue advancing
Recommended
More Related Content
What's hot
Viewers also liked
Similar to DevTeach Ottawa - Silverlight5 and HTML5
More from Frédéric Harper
Recently uploaded
DevTeach Ottawa - Silverlight5 and HTML5
- 1.
- 2.Frédéric HARPER Laurent DUVEAU RunAtServerfredh@microsoft.com laurent@runatserver.comhttp://blogs.msdn.com/b/cdndevs/ http://weblogs.asp.net/lduveau/@fharper @LaurentDuveau
- 3.SILVERLIGHT IN 10SDevelopfor the web with managed code (.NET) for: Windows/Mac OS All major browsers Windows PhoneBrowser pluginInstallation base : 77%First version : 2007
- 4.• SilverDiagram• HouseBuilder 3D
- 5.HTML 5 IN10S Available in the core of major browsers Access on all devices with a recent browser Computers Tablets/slates Smartphones In "development" since 2009 Still draft, but already widely used
- 6.• Angry Birds•Never Mind The Bullets
- 7.ONCE UPON ATIME… Hello! Silverlight is a cross-browser, cross-platform web client runtime for building rich interactive applications on the web Life is good…
- 8.AGENDA Adoption Toolsand languages Controls DataBinding Graphic, media, 3D and text System integration Performances
- 9.ADOPTION S I LV E R L I G H T HTML 5 Browser Plugin to install Already include in the last once version of all major PC, MAC, Linux browsers PC, MAC, Linux Windows Update Adoption strategies optional Lowest Common Major websites help: Denominator Olympics, NCAA, … Polyfill Enriched 77% of browsers Alternate Experiences
- 12.TOOLS AND LANGUAGES S I LV E R L I G H T 5 HTML 5 VS 2010 SP1 VS 2010 + Web upd. Blend 5 VS 2011 & Blend 5 Sketchflow WebMatrix Notepad… XAML C# ou VB HTML / CSS JavaScript
- 14.CONTROLS S I LV E R L I G H T 5 HTML5 Silverlight 5 HTML5 ~38 controls 16 elements Silverlight Toolkit 9 structure tag ~40 controls 13 new input type Open source Third Party Codeplex, … PhoneGap, KendoUI… Third party JavaScript Telerik, DevExpress, … jQuery, Modernizr, Knockoutjs, .. CSS Less Framework, 52framework…
- 15.SILVERLIGHT TEMPLATED CONTROLSControlUI (XAML) separated from its behavior (C# or VB)Excellent support in Blend (Control Template, Visual State Manager, …)
- 16.
- 17.• HTML5 elements•KendoUI
- 19.SILVERLIGHT: BINDING ANDXAML Simple but powerful model TwoWay Binding with notifications support (INotifyPropertyChanged) Formatting, converters, … DataTemplate Command Silverlight 5 Binding in styles (Setter) Implicit DataTemplate DataBinding debugging! Ancestor Binding via RelativeSource New event : DataContextChanged PropertyChanged mode supported to update source:<TextBlock Text="{Binding ElementName=lst, Path=SelectedItem.Text,Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
- 20.•Style Binding• Ancestor Binding• DataBinding Debugging• Implicit Data Template
- 21.HTML Use JavaScriptfor DataBinding jQuery, Backbones.js or Knockout.js (use nuget in VS) facilitate it
- 22.• Data Attributes•KnockoutJs Twitter
- 24.SILVERLIGHTVector graphics•Transformations andanimationsDeep ZoomPixel ShaderAudio•WMA, MP3, AACVideo•H.264, WMV, VC-1 (hardware acceleration )•Trick-play•Smooth Streaming•DRM (on/offline)•Remote control support3D APITexte•OpenType, Text Clarity, Pixel Snapping, Text Overflow
- 25.• 3D• BouncingPlane (Animation, Perspective 3D, HD Video, Pixel Shader)
- 26.HTMLGraphics•Canvas•SVGMedias•Video (MPEG-4/H.264, WebMVP8, OGG Theora)•Audio (MP3, WAV PCM, OGG/Theora, ACC)3D•WebGLTexte•Web Open Font Format (aka WOFF)
- 27.• Destruction video•SVG girl• Google Body *
- 29.SILVERLIGHT Silverlight 3 Silverlight 4 Silverlight 5•Isolated Storage •Webcam and •interoperability via•OpenFileDialog and Microphone P/Invoke SaveFileDialog •Out Of Browser •Natives windows•Out Of Browser (OOB) Elevated Trust (OOBE): •Full file system access•Connection detection interop COM (Office, in Elevated Trust mode …), Notifications •Elevated Trust in•Full screen •OOBE: file system browser! access: My* folders •Remote Control •Clipboard Support •Print API •Pinned full screen •Drag and drop
- 30.• System Fontdialog (P/Invoke)• USB drive• Native Windows
- 31.HTMLOffline & storage HTML5 App Cache Local Storage Indexed DB File API specificationDevice Access Geolocalisaton API Microphone access (in progress) Camera access (in progress) …
- 32.• Foursquare Playground•Local storage demo• File API image *
- 34.SILVERLIGHT 5 &HTML 5Lots of features are coming to parity (or very soon)=> Let’s compare the performance!Benchmark: Row performance Vector manipulation Bitmap manipulation
- 35.• Row perf•Vector Graphics• Bitmap Graphics
- 36.SO, WHAT TOCHOOSE?
- 37.
- 38.