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

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

3. 1. More Interoperability

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

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

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

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

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

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

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

11. Project Spartan
Microsoft EdgeHTML
Evergreen

13. Mobile Chromium usage across forks
Chromium versions
<10
Chromium 39 – 3%
Chromium 37 – 2%
Chromium 30 – 1%
Chromium 30 – 18%
Chromium %
Source:

14. Introducing “Project Spartan”

16. Project Spartan Microsoft EdgeHTML Microsoft EdgeHTML Evergreen

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

18. 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

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

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

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

22. 2. New Features

23. New & updated HTML5 features
CSS
@supports
Flexbox standards update
dppx unit
transform-style: preserve-3d
Filter effects
Storage & networking
HTTP/2
Content security policy
Web Crypto API updates
HSTS (HTTP Strict Transport Security
Media & RTC
Media capture
HLS
WebAudio
Video Tracks
WAV Audio support
Input & Editing
Touch events
Pointer lock API
Media Queries L4 - Interaction
Selection API
Gamepad API
JavaScript
ES6 Math, Number, String, RegExp & Object built-ins
Arrow functions, Enhanced object literal, Template strings, Default, Rest, Spread
Map, Set, Weakmap, __proto__, Proxies
Let, Const, Promises, Classes
DOM & Graphics
SVG foreignobject
SVG attribute animation
Complete WebGL support
DOM event constructors
DOM Level 3 XPath
Shipped
Preview Release
In development

24. 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 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, 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.

25. DEMO: STATUS.MODERN.IE

26. DEMO: NEW RENDERING ENGINE

27. 3. Less boundaries between web and apps

28. Web Apps spectrum Packaged Web App Hosted Web App Web Site
Discoverable and presented through a browser
Hosted Web App
Majority of app hosted on a web server
Access to native APIs
Distributed through a Store
Packaged Web App
Content inside app package
Can use Cordova or WebView

29. Hosted Web Apps

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

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

32. Hosted Web apps Bring your website experience to the Windows Store
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

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

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

35. DEMO: Hosted Web Apps

36. Hosted Web Apps Manifest
<uap:ApplicationContentUriRules> <uap:Rule Type="include" WindowsRuntimeAccess="all" Match=" /> <uap:Rule Type="include" WindowsRuntimeAccess="allowForWebOnly" Match=" /> <uap:Rule Type="include" WindowsRuntimeAccess="none" Match=" /> <uap:Rule Type="include" Match=" /> </uap:ApplicationContentUriRules>

37. W3C Standard Manifest for Web Apps http://w3c.github.io/manifest/ {
"name": "Super Web App",
"short_name": "SuperWA",
"start_url": "
"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

38. Packaged (or Hybrid) Web Apps

39. Enhanced WebView control
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

40. What’s next for Cordova
11/12/2018
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
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

41. 11/12/2018
Summary
© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

42. Evolving the Web Platform
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 Less boundaries between web and apps Enabling Hosted Web App to access Universal APIs via standard approach More advanced WebView and Cordova tooling

43. Thank You!
@boyofgreen