Mix11: retour sur la partie HTML5 du 1er keynote avec IE9/10, HTML5Labs et ASP.NET MVC3

  • Article

Nous sommes plusieurs à avoir à nouveau la chance d’être présents à Las Vegas pour couvrir le MIX annuel. Cette année sera orientée HTML5, IE9/10, Windows Phone 7.5 et Silverlight 5. Bref, plein de bonnes et belles choses à découvrir. Je vais me concentrer pour ma part dans ce billet à ce qui touche à HTML5.

Commençons par découvrir cette première plénière présentée par Dean Hachamovitch & Scott Guthrie que vous pouvez revoir ici : https://live.visitmix.com/Keynotes

Internet Explorer

Tout d’abord, Dean est revenu sur notre stratégie de développement du navigateur et la manière que nous avons choisis d’implémenter de nouvelles fonctionnalités au travers des Platform Preview. IE9 comporte ainsi un certain nombre de fonctionnalités d’HTML5 et CSS3 que nous considérons comme “Site Ready” ou autrement dit, prêts à être utilisés en production. Vous n’êtes pas sans savoir en effet que de nombreuses spécifications de CSS3 par exemple sont encore à l’état de brouillon (Working Draft).

Nous avons ensuite fait de belles démonstrations d’applications purement HTML5 dans IE9 grâce à notre excellent support de l’accélération matérielle :

- une façon unique de découvrir Foursquare en 3D isométrique avec Foursquare Playground : https://foursquareplayground.com/
- une très impressionnante démo d’un manga animé entièrement réalisée en SVG : https://jsdo.it/event/svggirl (ceci n’est pas une vidéo !).
- la possibilité de faire un montage vidéo des clips de Bon Jovi : https://director.bonjovi.com/ avec l’utilisation de canvas, SVG et bien sûr la balise vidéo.
- le plus grand PacMan au monde : https://worldsbiggestpacman.com/ ! Sourire Merci à <canvas> à nouveau. 

Nous avons ensuite annoncé la disponibilité de la 1ère Platform Preview d’IE10 ! Vous pouvez la télécharger ici : https://ie.microsoft.com/testdrive

Au programme, des nouveautés très intéressantes :

- CSS3 Flexbox
- CSS3 Grid Alignment
- CSS3 Multi-column
- CSS3 Gradients
- ECMAScript5 Strict Mode

Vous trouverez toutes ces nouveautés détaillées ici : Internet Explorer Platform Preview Guide for Developers

Pour les développeurs Silverlight, CSS3 Flexbox ressemble tout simplement au container <StackPanel> et CSS3 Grid au container <Grid>. Je peux vous dire que ces nouveautés, combinées à CSS3 Media Queries, vont permettre la réalisation de sites ou d’applications HTML5 pouvant facilement s’adapter à des téléphones, des tablettes ou des PC. Une session était d’ailleurs dédiée à ce thème : IE 10 Platform Preview 1: The Future of Adaptive Web Design. Elle est particulièrement intéressante et donne un aperçu du futur je pense. A regarder !

Pendant le keynote, il y a eu également de belles démonstrations de CSS3 Transitions et CSS3 3D Transform qui arriveront dans une PP suivante. Le rythme des Platform Preview sera de 8 à 12 semaines (alors qu’IE9 avait un rythme de 6 à 8 semaines).

Pour finir sur IE, Steven Sinofsky himself est venu nous faire les démos d’IE10 le tout sur… une machine disposant d’un CPU 1 Ghz à architecture ARM (un Tegra 2 de nVidia) ! La grosse surprise du keynote sans aucun doute !

Stanislas a fait également un très beau billet sur cette partie du keynote sur notre blog IE France : Internet Explorer 10 Platform Preview 1 présenté à MIX 2011

HTML5Labs

Notre stratégie est différente de celle des concurrents sur le travail autour des spécifications expérimentales. Nous ne les mettons pas directement dans le navigateur comme le font par exemple Google ou Mozilla avec le risque de devoir mettre à jour le navigateur puis ensuite son code pour avoir par exemple la dernière version du protocole WebSockets. Notre travail s’effectue autour d’une méthode différente proposée par notre groupe d’interopérabilité et nommée HTML5Labs : https://html5labs.com

Une nouvelle version du site a été annoncée au keynote. On trouve désormais 4 spécifications présentes sur le site :

- WebSockets
- IndexDB
- FileAPI
- Media Capture API

J’ai pu assister à une session très intéressante Hot from the Labs: HTML5 WebSockets sur laquelle je reviendrais dans un billet séparé.

ASP.NET MVC3, WebMatrix et Entity Framework 4.1

Pour finir sur les annonces autour d’HTML5, ASP.NET MVC3 a été mis à jour : https://asp.net/mvc et supporte désormais des templates HTML5. Au programme : nouveaux tags sémantiques (comme header, section, footer) et utilisation de quelques parties de CSS3 comme les border-radius. Bonne nouvelle : ASP.NET MVC3 livre désormais par défaut la très célèbre librairie JS Modernizr. Cela permet (entre autres) d’utiliser ces nouveaux tags sémantiques HTML5 sans perdre pour autant le fonctionnement du site avec IE8 et inférieurs.

Scott Hanselman a alors fait une superbe prestation de 8 min où il a utilisé ces nouveaux templates, Entity Framework 4.1 Code First, jQuery pour créer un back office puis ensuite un frontal en WebMatrix. Très belle démonstration de la maturité de ces produits et des cibles différentes de chacun d’entre eux. Scott est aussi un excellent speaker !

D’autres comptes rendus en Français :

- Nicolas Clerc : https://nicolasclerc.wordpress.com/2011/04/13/mix-2011-cest-parti-keynote-du-11-avril/
- David Catuhe : https://www.catuhe.com/post/Mix2011–Keynote–Day-1.aspx
- Christophe Lauer : Mix11 Las Vegas : Les choses à retenir du premier keynote . Un très beau billet de Christophe à lire ! (même s’il se moque un peu de moi quelque part… Clignement d'œil)

A demain pour la suite !

David