1 / 43

Evolving the Web Platform

Evolving the Web Platform. Jeff Burtoft Senior Program Manager, Developer Evangelism @ boyofgreen. More interoperability New features Less boundaries between web and apps. Feedback from developers. 1. More Interoperability. 1995. 2015. Trident. 3. 4. 1. 2. 5.5. 6. 5. 7. 8.

thomasgsmith
Download Presentation

Evolving the Web Platform

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Evolving the Web Platform Jeff Burtoft Senior Program Manager, Developer Evangelism @boyofgreen

  2. More interoperability New features Less boundaries between web and apps Feedback from developers

  3. 1. More Interoperability

  4. 1995 2015 Trident 3 4 1 2 5.5 6 5 7 8 4.x 9 9 10 11

  5. HTML4, ES3, CSS2 1995 2015 Trident 11 3 4 1 2 5.5 6 5 8 4.x 9 9 10 7 Quirks Strict !DOCTYPE

  6. HTML4, ES3, CSS2 1995 1995 2015 Trident 7 8 2 5.5 6 5 3 4.x 4 9 10 11 1 9 Quirks Strict !DOCTYPE

  7. HTML4, ES3, CSS2 CSS2.1 1995 2015 Trident 6 3 4 1 2 5.5 5 8 4.x 9 9 10 11 7 IE5 Quirks IE7 Compatibility View IE8 Standards Mode !DOCTYPE x-ua-compatible

  8. HTML5, SVG, ES5 HTML4, ES3, CSS2 CSS2.1 1995 2015 Trident IE5 Quirks IE7 Compatibility View IE8 Standards Mode 3 7 4 1 2 6 5 9 8 4.x 9 10 11 5.5 !DOCTYPE x-ua-compatible IE9 Standards Mode

  9. HTML5, SVG, ES5, CSS3 HTML4, ES3, CSS2 CSS2.1 1995 2015 Trident IE5 Quirks IE7 Compatibility View IE8 Standards Mode 3 4 1 5.5 6 2 7 9 4.x 9 10 11 5 8 !DOCTYPE x-ua-compatible IE9 Standards Mode IE10 Standards Mode QME Quirks Mode Emulation

  10. Modern Web HTML5, SVG, ES5, CSS3 Legacy Web CSS2.1 HTML4, ES3, CSS2 1995 2015 Trident IE5 Quirks IE7 Compat View IE8 Standards Mode EMIE Enterprise Mode 9 5.5 6 5 7 8 4.x 1 2 9 10 11 3 4 !DOCTYPE x-ua-compatible IE9 Standards Mode QME Quirks Mode Emulation IE10 Standards Mode IE11 Standards Mode

  11. Project Spartan Microsoft EdgeHTML Evergreen

  12. Mobile Chromium usage across forks Chromium 28 – 27% Chromium 33 – 6% Chromium 35 – 1% Chromium 38 – 1% Chromium 40 – 39% Chromium versions <10 Chromium 39 – 3% Chromium 37 – 2% Chromium 30 – 1% Chromium 30 – 18% Chromium 18 - 2% Source: www.quirksmode.org/blog/archives/2015/02/counting_chromi.html

  13. Introducing “Project Spartan”

  14. Project Spartan Microsoft EdgeHTML Microsoft EdgeHTML Evergreen Evergreen

  15. Internet Explorer on Windows 10 For sites requiring ActiveX or BHO By default Interoperability edgehtml.dll Compatibilitymshtml.dll IE5 Quirks IE7 Compat View IE8 Standards Mode New rendering engine EMIE Enterprise Mode IE9 Standards Mode QME Quirks Mode Emulation IE10 Standards Mode IE11 Standards Mode BHO ActiveX

  16. Windows 10 powers a huge range of hardware… 2-in-1s(Tablet or Laptop) Classic Laptop Desktops & All-in-Ones Phone Phablet Small Tablet Large Tablet Windows 10 Surface Hub Xbox HoloLens IoT

  17. Interop progress IE11 on Windows 8.1 With support for –webkit transitions

  18. Interop progress New user-agent Windows Phone 8.1 Remove check for ‘installable’ flag on cross-origin fonts

  19. Interop progress Windows Phone 8.1 With support for –webkit-gradient

  20. 2. New Features

  21. New & updated HTML5 features Shipped Preview Release In development

  22. And more… 2000+ Interoperability Fixes, Preserve-3d, Touch Events, CSS Filter Effects, DOM Clipboard Support, HTML Drag and Drop, Web Audio, CSS Position Sticky, CSS @supports, CSS Flexbox, HTML Beacon, WebDriver, IndexedDB, WebCrypto, Internation Mixed Languages Support, CSS Grid, CSS Variables, srcset, <picture> element, Web Workers Update, DOM4 Events, Font Loading, BDI, Cross-domain, HLS Manifest, Block Ellipsis, WAV, @rules, CSS Text(), CSS Border Logical, Logical Box Model, DOM Gamepad API, DOM FileSystem API, HTML <date> element, HTML <keygen> element, HTML <main> element, HTML <output> element, HTML <summary> element, HTML <detail> element, HTML <time> element, Native PDF, AppCache, SVG Hosting, Mutation Observers, HTML bidirectional, HTML Speech API, SVG animations, SVG transitions, SVG transforms, Canvas Path, Canvas Accessibility API, CSS Select Control, CSS Masking, CSS Clipping, Navigation Error Logging, CSS element(), CSS Shapes, ORTC, CSS Escape, Shared Workers, ES6 Modules, ES6 Promises, CSS Intrinsic & Extrinsic Sizing, Web Components, CSS Scoped Styles, HTTP 2.0, CSS Resize, WebGL, Canvas Blend Modes, CSS Interpolation, CSS Line Grid, CSS Line Box Contain, CSS Ruby, DOM Event Constructors, HTML <ol> Reverse, Server-Sent Events, Viewport APIs, Quota API, etc.

  23. DEMO: STATUS.MODERN.IE

  24. DEMO: NEW RENDERING ENGINE

  25. 3. Less boundaries between web and apps

  26. Web Apps spectrum

  27. Hosted Web Apps

  28. Hosted Web App architecture today App Store (iOS, Android, Windows…) Native app container WebView Web Site Native Code custom bridge

  29. Hosted Web App in Windows 10 App Store Native app container WebView Web Site Windows APIs Native Code

  30. Hosted Web apps Flexibility and reach of the web, with the power of an App • Bring your website experience to the Windows Store • Discoverable, Shell integration, Pinnable, Cortana • Leverage your web investments and developer workflow • Keep web workflow and development process • Access Universal APIs • Notifications, Camera, Contact List, Calendar Liberty’s Cafe

  31. Ability to publish your website to the store Ability to call native Universal APIs from Javascript on your website Hosted Web Apps if (typeofWindows != ‘undefined’) { // Create an appointment with Windows.ApplicationModel.Appointments.Appointment(); } Feature Detect Windows Native APIs Native APIs

  32. Keep your web workflow for updating content Hosted Web Applications Deploy on your service Reach Windows users Use your editor Push to your repo’s Code Push Stage Release Private Cloud

  33. DEMO: Hosted Web Apps

  34. <uap:ApplicationContentUriRules> <uap:Rule Type="include" WindowsRuntimeAccess="all" Match="https://rjs.azurewebsites.net/" /> <uap:Rule Type="include" WindowsRuntimeAccess="allowForWebOnly" Match="https://*.facebook.com/" /> <uap:Rule Type="include" WindowsRuntimeAccess="none" Match="http://bing.com/" /> <uap:Rule Type="include" Match="https://*.microsoft.com/" /> </uap:ApplicationContentUriRules> Hosted Web Apps Manifest

  35. W3C Standard { "name": "Super Web App", "short_name": "SuperWA", "start_url": "http://www.example.com", "icons": [ { "src": "tiny.png", "sizes": "70x70" }, { "src": "square.png", "sizes": "150x150" }, { "src": "apple-touch-icon-72x72-precomposed.png", "sizes": "72x72" }, { "src": "niceicon.png", "sizes": "128x128" } ], "display": "standalone", "orientation": "landscape" } Manifest for Web Apps http://w3c.github.io/manifest/

  36. Packaged (or Hybrid) Web Apps

  37. Enables Windows Runtime access Uses Spartan’s Always-Current engine Full support for rich scenarios AppCache IndexedDB Clipboard New APIs for hybrid scenarios AddWebAllowedObject ClearData Improved performance Enhanced WebView control

  38. What’s next for Cordova Built on top of Project Spartan engine Native JS performance Support for Embedded Cordova Cordova API access inside of WebView Develop for the Windows platform using existing CLI or IDE Cordova tools

  39. Summary

  40. More Interoperability New Project Spartan engine. Try it at insider.windows.com Always up-to-date (3000 interop bugs already fixed) New Features Over 40 new Web standards already (ECMAScript6, HTTP2, WebGL, …) Open development, track on status.modern.ie or ask @IEDevChat Less boundaries between web and apps Enabling Hosted Web App to access Universal APIs via standard approach More advanced WebViewand Cordova tooling Evolving the Web Platform

  41. Thank You! @boyofgreen

More Related