Microsoft Edge ¸ »°‚„¾€¼° ²µ±-€¸»¾¶µ½¸¹ ² Windows 10 / ¾½‚°½‚¸½ ¸‡¸½¸¹

  • View
    368

  • Download
    6

Embed Size (px)

Text of Microsoft Edge ¸ »°‚„¾€¼°...

  • Microsoft

    Microsoft Edge - Windows 10

  • MICROSOFT EDGE

    EDGEHTMLCHAKRA

    WEB APPSBRIDGE

    Windows 10

  • Microsoft

  • CEO

  • Microsoft Edge

  • ?

  • !

  • 1995

    3 41 2 5.5 65 7 84.x 9

    2015

    9 10 11

  • 1995

    3 41 2 5.5 65 7 84.x 9

    2015

    9 10 11

    HTML4, ES3, CSS2

    !DOCTYPE

    QUIRKS STRICT

  • 1995

    3 41 2 5.5 65 7 84.x 9

    2015

    9 10 11

    IE5QUIRKS

    IE7COMPATIBILITY

    VIEW

    IE8STANDARDS

    MODE

    CSS2.1HTML4, ES3, CSS2

    !DOCTYPEx-ua-compatiblecontent="edge"

  • 1995

    3 41 2 5.5 65 7 84.x 9

    2015

    9 10 11

    IE8STANDARDS

    MODE

    IE9STANDARDS

    MODE

    CSS2.1HTML4, ES3, CSS2 HTML5, SVG, ES5

    !DOCTYPEx-ua-compatiblecontent="edge"

    IE5QUIRKS

    IE7COMPATIBILITY

    VIEW

  • 1995

    3 41 2 5.5 65 7 84.x 9

    2015

    9 10 11

    IE5QUIRKS

    IE8STANDARDS

    MODE

    IE9STANDARDS

    MODE

    CSS2.1HTML4, ES3, CSS2 HTML5, SVG, ES5

    IE7COMPATIBILITY

    VIEW

    !DOCTYPEx-ua-compatiblecontent="edge"

    QMEQuirks Mode

    Emulation

    IE10STANDARDS

    MODE

  • 1995

    3 41 2 5.5 65 7 84.x 9

    2015

    9 10 11

    IE5QUIRKS

    IE8STANDARDS

    MODE

    IE9STANDARDS

    MODE

    IE7COMPAT.

    VIEW

    !DOCTYPEx-ua-compatiblecontent="edge"

    QMEQuirks Mode

    Emulation

    IE10STANDARDS

    MODE

    Legacy WebCSS2.1

    Modern WebHTML5, SVG, ES5, CSS3HTML4, ES3, CSS2

    EMIEEnterprise Mode

    IE11STANDARDS

    MODE

  • -

    - .

    !

  • 1995

    3 41 2 5.5 65 7 84.x 9

    2015

    9 10 11

    ActiveX (COM/OLE)BHOs (Actions)DX Filters/TransitionsVML VBScript (IE8)

  • 1995

    3 41 2 5.5 65 7 84.x 9

    2015

    9 10 11

    ActiveX (COM/OLE)BHOs (Actions)DX Filters/TransitionsVML VBScript (IE8)

  • 1995

    3 41 2 5.5 65 7 84.x 9

    2015

    9 10 11

    ActiveX (COM/OLE)BHOs (Actions)DX Filters/TransitionsVML VBScript (IE8)

    220k+

    6

    300+ APIs

  • , , , Enter , . 45 ( , !).

    , . ,

    : , .

    Jacob Rossi

  • 1995

    3 41 2 5.5 65 7 84.x 9

    2015

    9 10 11

    -

  • 1995

    3 41 2 5.5 65 7 84.x 9

    2015

    9 10 11

    -

  • MSHTML

    , ,

    : ActiveX, BHO,

    WINDOWS 8

  • Internet Explorer 11: MSHTML

    , ,

    : ActiveX, BHO,

    Microsoft Edge: EdgeHTML

    (++)

    WINDOWS 10

  • EdgeHTML, Chakra

  • 300k+

    49

    4200+

    EdgeHTML

  • Microsoft Edge (EdgeHTML)

    Mozilla/5.0 (Windows NT 10.0;

    WOW64) AppleWebKit/537.36

    (KHTML, like Gecko)

    Chrome/36.0.1985.143

    Safari/537.36 Edge/12.0

    EdgeHTML

  • User-Agent String

    Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko)

    Chrome/39.0.2171.71 Safari/537.36 Edge/12.0

    Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_1) AppleWebKit/600.1.25 (KHTML, like Gecko)

    Version/8.0 Safari/600.1.25

    Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko)

    Chrome/40.0.2214.93 Safari/537.36

    Mozilla/5.0 (Windows NT 10.0; WOW64; rv:35.0) Gecko/20100101 Firefox/35.0

  • User-Agent String

    Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko)

    Chrome/39.0.2171.71 Safari/537.36 Edge/12.0

    Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_1) AppleWebKit/600.1.25 (KHTML, like Gecko)

    Version/8.0 Safari/600.1.25

    Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko)

    Chrome/40.0.2214.93 Safari/537.36

    Mozilla/5.0 (Windows NT 10.0; WOW64; rv:35.0) Gecko/20100101 Firefox/35.0

  • Inte

    rop

    2

    Inte

    rop

    1

    Inte

    rop

    3

    Inte

    rop

    0

    IE11

    ,

    UserVoice

  • dev.modern.ie

  • 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

  • Chakra

    JIT

    ()

    Asm.js

    ES15 I18N

    SIMD

    ES16

  • Benchmarks

    0

    20

    40

    60

    80

    100

    120

    140

    160

    Internet Explorer

    11

    Microsoft Edge Chrome Canary

    43.0.2369.0

    Firefox Alpha

    40.0a1(04-14)

    JetStream

    0

    5000

    10000

    15000

    20000

    25000

    Internet Explorer

    11

    Microsoft Edge Chrome Canary

    43.0.2369.0

    Firefox Alpha

    40.0a1(04-14)

    Octane 2.0

  • about:flags

  • MSHTML.dll

    JSCRIPT9.dll

    EdgeHTML.dll

    Chakra.dll

    WINDOWS 10

  • User Agent

    String

    Windows 10

    UserVoice, Twitter,

    Connect

  • -

  • VS.

    ?

  • +

    ?

  • VS.

    ?

  • ?

    +

  • -HTML

    CSS

    JS

  • Packaged Apps

  • HTML

    CSS

    JS

    app

    HTA (1999)

    Prizm (2007)

    CEF (2009)

    WinRT + UWP

    Electron

    NW.js

  • HTML

    CSS

    JS

    app

    HTA (1999)

    Prizm (2007)

    CEF (2009)

    WinRT + UWP

    Electron

    NW.js

    Windows

    FirefoxOS

    ChromeOS

    TV

    Apache

    Cordova

  • HTML

    CSS

    JS

    app

    HTA (1999)

    Prizm (2007)

    CEF (2009)

    WinRT + UWP

    Electron

    NW.js

    Windows

    FirefoxOS

    ChromeOS

    TV

    Apache

    Cordova

  • Hosted Apps

  • -HTML

    CSS

    JS

    -

  • -HTML

    CSS

    JS

    -

    Manifest for Web Appshttp://w3c.github.io/manifest/

  • W3C Standard

    Manifest for Web Apps , -

    http://w3c.github.io/manifest/

    {"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"

    }

  • -HTML

    CSS

    JS

    Manifest for Web Appshttp://w3c.github.io/manifest/

  • -HTML

    CSS

    JS

    Manifest for Web Appshttp://w3c.github.io/manifest/

  • -HTML

    CSS

    JS

    .appx

    Manifest for Web Appshttp://w3c.github.io/manifest/

    Windows 8.1 & Windows Phone 8.1

    Web Application Template (WAT)http://wat.codeplex.com/

  • -HTML

    CSS

    JS

    .appx

    Manifest for Web Appshttp://w3c.github.io/manifest/

    Windows 8.1 & Windows Phone 8.1 + Android

    Web Application Template (WAT)http://wat.codeplex.com/

  • -HTML

    CSS

    JS

    .appx

    Manifest for Web Appshttp://w3c.github.io/manifest/

    Windows 8.1 & Windows Phone 8.1 + Android

    Web Application Template (WAT)http://wat.codeplex.com/

    WebView

    Custom BridgeNative Code

    WinRT

  • -HTML

    CSS

    JS

    .appx

    Manifest for Web Appshttp://w3c.github.io/manifest/

    Windows 10

    Universal Windows Platform

    Project Westminster

    WinRTCSP, Manifest Rules

    WebView

    Native Code Windows APIs

  • HTML

    CSS

    JS

    .appx

    Manifest for Web Appshttp://w3c.github.io/manifest/

    Windows 10 (UWP)

    Project Westminster

    Windows APIs

    if (window.Windows) {

    // Create an appointment

    Windows.ApplicationModel.Appointments.Appointment();

    }

    Trip to Barcelona3/25/2015 All Day

    Notes: Return to work

    WinRTCSP, Manifest Rules

  • DEMO -

  • -HTML

    CSS

    JS

    .appx

    Manifest for Web Appshttp://w3c.github.io/manifest/

    Windows 10 (UWP)

    WebView API

    addWebAllowedObjectclearTemporaryWebDataAsync

    WinRTCSP, Manifest Rules

    WebView

    Native Code Windows APIs

    "MSWebViewNewWindowRequested""MSWebViewPermissionRequested"

  • WinRT?

    -?

  • -HTML

    CSS

    JS

    .appx

    Manifest for Web Appshttp://w3c.github.io/manifest/

    Windows 10

    Apache Cordova + UWP

    Project Westminster

    WinRTCSP, Manifest Rules

    Native

    Code

    Windows

    APIs

  • Code

    Visual Studio

    Notepad++

    B