Edge pour les développeurs web
Laurent Duveau
MS DEV MTL – 07 Décembre 2015
Internet Explorer…
“On January 12, 2016, we will stop
support for all versions of IE
except IE11”
- Microsoft
https://support.microsoft.com/e...
IE6 funeral cake!
Usage IE6 < 1% aux USA en 2011
IE6 < 1% au Canada en 2012
Un dev sur MAC essaye de tester pour IE…
• WebGL
• WebSockets
• CSS3 Gradients
• Blocked scoped
variables
• Pointer Events
• Fullscreen API
• Device Orientation
• ...
http://browseryoulovedtohate.tumblr.com/
Pourquoi tester pour IE ?
Netmarketshare.com
StatCounter.com
IE Developer Guides
http://bit.ly/iedevguides
IE Compatibility Cookbook
http://bit.ly/iecompatcookbook
Web Platform
Trident
Browser
Internet Explorer
Web Platform
Blink
Browser
Chrome
Web Platform
Webkit
Browser
Safari
Web Platform
Gecko
Browser
Firefox
3 41 2 5.5 65 7 84.x 99 10 11
Trident
1995 2015
Quirks Strict
HTML4, ES3, CSS2
Trident
3 41 2 5.5 65 7 84.x 99 10 11
1995 2015
!DOCTYPE
Quirks Strict
HTML4, ES3, CSS2
Trident
3 41 2 5.5 65 7 84.x 99 10 11
1995 2015
!DOCTYPE
!DOCTYPE
Trident
3 41 2 5.5 65 7 84.x 99 10 11
1995 2015
x-ua-compatible
IE5
Quirks
IE7
Compatibility
View
IE8
Standards
M...
HTML5, SVG, ES5
!DOCTYPE
HTML4, ES3, CSS2
Trident
3 41 2 5.5 65 7 84.x 99 10 11
1995 2015
CSS2.1
x-ua-compatible
IE5
Quirk...
HTML5, SVG, ES5, CSS3
!DOCTYPE
HTML4, ES3, CSS2
Trident
3 41 2 5.5 65 7 84.x 99 10 11
1995 2015
CSS2.1
x-ua-compatible
IE5...
HTML5, SVG, ES5, CSS3
!DOCTYPE
HTML4, ES3, CSS2
Trident
3 41 2 5.5 65 7 84.x 99 10 11
1995 2015
CSS2.1
x-ua-compatible
IE5...
Repartir à neuf!
• User Agent intéropérable
• 4200 fixes d’intéropérabilité
• 45 nouveaux standards implémentés
• Evergreen
• Trident –» Ed...
Interoperable UA string
Le but étant de recevoir le même contenu que les
autres navigateurs…
Mozilla/5.0 (Windows NT 10.0;...
…Camouflage!
Faire de la détection de fonctionnalités
Browser
Firefox
Gecko
Evergreen
Browser
Chrome
Blink
Evergreen
Browser
Edge
Microsoft EdgeHTML
Evergreen
Compatibilité ?
 IE11 est toujours présent sur Windows 10
 IE11 Win10 est identique à IE11 Win 7 & 8
 Entreprises: mode...
Extensions
IE a supporté 30 modèles
d’extensions pendant 20
ans…
Edge n’en supportera aucun
• ActiveX, Toolbars, BHO, …
• ...
F12 Developer Tools
http://bit.ly/f12devtools
Comment tester pour IE et Edge ?
(même si on n’a pas de PC)
Microsoft Edge Dev Portal
http://dev.microsoftedge.com
http://status.microsoftedge.com http://uservoice.modern.ie
Ouverture
Recap
Valider le User Agent de Edge avec votre site
Utiliser remote.modern.ie pour tester la
dernière version of IE
Fai...
Microsoft Edge
MS DEV MTL 07 Décembre 2015
Laurent Duveau
laurent@ldex.ca
AngularJS, Azure et
Xamarin
MVP / MCT / RD @laur...
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Microsoft Edge pour les développeurs web
Prochain SlideShare
Chargement dans…5
×

Microsoft Edge pour les développeurs web

348 vues

Publié le

Présentation par Laurent Duveau au groupe MS DEV MTL (www.msdevmtl.com) le 07 Décembre 2015.

Publié dans : Technologie
0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
348
Sur SlideShare
0
Issues des intégrations
0
Intégrations
33
Actions
Partages
0
Téléchargements
4
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Microsoft Edge pour les développeurs web

  1. 1. Edge pour les développeurs web Laurent Duveau MS DEV MTL – 07 Décembre 2015
  2. 2. Internet Explorer…
  3. 3. “On January 12, 2016, we will stop support for all versions of IE except IE11” - Microsoft https://support.microsoft.com/en-us/lifecycle/search?sort=PN&alpha=internet%20explorer
  4. 4. IE6 funeral cake! Usage IE6 < 1% aux USA en 2011
  5. 5. IE6 < 1% au Canada en 2012
  6. 6. Un dev sur MAC essaye de tester pour IE…
  7. 7. • WebGL • WebSockets • CSS3 Gradients • Blocked scoped variables • Pointer Events • Fullscreen API • Device Orientation • Flexbox • Encrypted Media Extensions • CSS3 Regions • File API • AppCache • IndexedDB • CSS3 Media Queries • Canvas • CSS3 Transforms Pourtant IE11 n’est pas si pire!
  8. 8. http://browseryoulovedtohate.tumblr.com/
  9. 9. Pourquoi tester pour IE ?
  10. 10. Netmarketshare.com
  11. 11. StatCounter.com
  12. 12. IE Developer Guides http://bit.ly/iedevguides
  13. 13. IE Compatibility Cookbook http://bit.ly/iecompatcookbook
  14. 14. Web Platform Trident Browser Internet Explorer
  15. 15. Web Platform Blink Browser Chrome
  16. 16. Web Platform Webkit Browser Safari
  17. 17. Web Platform Gecko Browser Firefox
  18. 18. 3 41 2 5.5 65 7 84.x 99 10 11 Trident 1995 2015
  19. 19. Quirks Strict HTML4, ES3, CSS2 Trident 3 41 2 5.5 65 7 84.x 99 10 11 1995 2015 !DOCTYPE
  20. 20. Quirks Strict HTML4, ES3, CSS2 Trident 3 41 2 5.5 65 7 84.x 99 10 11 1995 2015 !DOCTYPE
  21. 21. !DOCTYPE Trident 3 41 2 5.5 65 7 84.x 99 10 11 1995 2015 x-ua-compatible IE5 Quirks IE7 Compatibility View IE8 Standards Mode HTML4, ES3, CSS2 CSS2.1
  22. 22. HTML5, SVG, ES5 !DOCTYPE HTML4, ES3, CSS2 Trident 3 41 2 5.5 65 7 84.x 99 10 11 1995 2015 CSS2.1 x-ua-compatible IE5 Quirks IE7 Compatibility View IE8 Standards Mode IE9 Standards Mode
  23. 23. HTML5, SVG, ES5, CSS3 !DOCTYPE HTML4, ES3, CSS2 Trident 3 41 2 5.5 65 7 84.x 99 10 11 1995 2015 CSS2.1 x-ua-compatible IE5 Quirks IE7 Compatibility View IE8 Standards Mode QME Quirks Mode Emulation IE9 Standards Mode IE10 Standards Mode
  24. 24. HTML5, SVG, ES5, CSS3 !DOCTYPE HTML4, ES3, CSS2 Trident 3 41 2 5.5 65 7 84.x 99 10 11 1995 2015 CSS2.1 x-ua-compatible IE5 Quirks IE7 Compatibility View IE8 Standards Mode IE10 Standards Mode IE9 Standards Mode QME Quirks Mode Emulation EMIE Enterprise Mode IE11 Standards Mode Modern WebLegacy Web
  25. 25. Repartir à neuf!
  26. 26. • User Agent intéropérable • 4200 fixes d’intéropérabilité • 45 nouveaux standards implémentés • Evergreen • Trident –» EdgeHTML
  27. 27. Interoperable UA string Le but étant de recevoir le même contenu que les autres navigateurs… Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/42.0.2311.135 Safari/537.36 Edge/12.10240 Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/42.0.2311.135 Safari/537.36 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; rv:39.0) Gecko/20100101 Firefox/39.0
  28. 28. …Camouflage!
  29. 29. Faire de la détection de fonctionnalités
  30. 30. Browser Firefox Gecko Evergreen
  31. 31. Browser Chrome Blink Evergreen
  32. 32. Browser Edge Microsoft EdgeHTML Evergreen
  33. 33. Compatibilité ?  IE11 est toujours présent sur Windows 10  IE11 Win10 est identique à IE11 Win 7 & 8  Entreprises: mode pour configurer par défaut IE11 (qui lui-même à un mode d’émulation IE8)
  34. 34. Extensions IE a supporté 30 modèles d’extensions pendant 20 ans… Edge n’en supportera aucun • ActiveX, Toolbars, BHO, … • Problèmes de sécurité, fiabilité et performances. • Support natif pour Flash et PDF. • Modèle d’extensions modernes en JavaScript à venir…
  35. 35. F12 Developer Tools http://bit.ly/f12devtools
  36. 36. Comment tester pour IE et Edge ? (même si on n’a pas de PC)
  37. 37. Microsoft Edge Dev Portal http://dev.microsoftedge.com
  38. 38. http://status.microsoftedge.com http://uservoice.modern.ie Ouverture
  39. 39. Recap Valider le User Agent de Edge avec votre site Utiliser remote.modern.ie pour tester la dernière version of IE Faire de la détection de fonctionnalités Ne pas parser le User Agent
  40. 40. Microsoft Edge MS DEV MTL 07 Décembre 2015 Laurent Duveau laurent@ldex.ca AngularJS, Azure et Xamarin MVP / MCT / RD @laurentduveau Montrealldex.ca

×