Sencha Inc. | HTML5 Apps

Blog

IE10 Preview: HTML5 First Look

September 23, 2011 | Michael Mullany

Internet Explorer 10 logo

Over the last year we’ve been putting every new major mobile platform through a battery of tests to assess how they stack up as an HTML5 application platform. So far, it’s been thumbs up on Apple, RIM and HP tablets and thumbs down on Android tablets. But we’re still crossing our fingers that the Ice Cream Sandwich release of Android will make the grade.

To date, we haven’t spent time on Windows phones, mostly because the Windows Phone 7 browser was so poor that it wasn’t worth evaluating. However, at the Windows Build conference last week we got our hands on a developer preview tablet running Windows 8 and Internet Explorer 10. We wanted to share our first impression of the HTML5 experience. Simply put, (and with the caveat that we were running on the notably overpowered developer preview hardware) the IE10 HTML5 experience is one of the best we’ve seen on any platform to date. After a decade of web neglect, Microsoft is back with a vengeance.

The Windows 8 Web Platform

Windows 8 Metro platform

Before we go into the details of HTML5 support in Win8/IE10, it’s probably worth stepping back and covering some essentials of Windows 8. Windows 8 represents a big shift in Microsoft strategy because it makes web technologies a Tier 1 development option for native Windows apps.

To repeat: applications developed in JavaScript/HTML/CSS can now be built and distributed as native Windows applications.

The core Windows services for graphics, i/o, device access etc. all have JavaScript bindings equally as rich as the bindings for developers working in .NET or C++. The Microsoft message is that you can now build any native Windows app using web technologies.

So… what will be the differences between simply developing a web-based app for use by IE10 and developing a web app that gets delivered as a Win8 native app? The first difference is the resources that you’re allowed to access and how you’re allowed to access them. As a web-based app, you don’t get access to protected system resources such as camera, printers etc. To package your web app as a native app, you must create a permissions manifest file describing the protected resources that your app wants to access, and then submit your app to the (forthcoming) Windows app store. On submission, it will be checked for compliance with a battery of technical and policy tests.

Although it wasn’t altogether clear from Build, our guess is that app store compliance testing will be Microsoft’s mechanism for controlling web technology evolution on the Windows platform.

HTML5 Support

So, what’s new in IE10? A huge number of new features, particularly in the area of UI elements and effects. The IE10 preview supports almost every visual HTML5 and CSS3 feature that’s been introduced in the last three years and several more besides. IE9 was already a serious step-up for Microsoft with capabilities such as hardware accelerated Canvas, but IE10 introduces much more including:

  • CSS Transforms and Transitions: 2D and 3D transforms work smoothly and at high quality. Anti-aliasing and perspective handling for 3D transformed elements is visibly superior to many other browsers. And the smoothness of transforms is impressive which means that they’re probably hardware accelerated.
  • CSS Animations: are fully implemented with the syntax pioneered by WebKit. This is very exciting for us because it means that Sencha Animator animations play easily on IE10 with a simple find/replace of –webkit to –ms.
  • CSS3 Shadows: both text and box shadows are completely supported (including inset shadows!). Combining shadows with other effects works flawlessly.
  • CSS3 Gradients: fully supported with new style webkit/mozilla syntax which allows circular and elliptical radial gradients among all the other options
  • And that’s just the start. There are also web workers, web sockets, web fonts, Indexed DB, SVG filters, flexbox layout. Border-image seems to be the only thing not implemented.

Remarkably, particularly for developers trained to look out for Microsoft platform tie-ins, there are none on this list. Microsoft simply implemented the draft standards with no extensions or gotchas.

Microsoft Gets Some Firsts

In addition to substantial catchup on UI-related features, IE10 also pioneers some new technologies that haven’t made it into other browsers yet such as CSS Regions and positioned floats. CSS Regions is a working draft authored by Adobe that enables newspaper style layouts with features like irregular inserts that span multiple columns, as well as configurable text flow around floating elements. These are very useful for publications that want to duplicate print-style layouts on the web. (Finally, Microsoft is still pushing grid layout, although it continues to be the sole browser that implements it, and predecessor specs have languished in the CSS working group for years.)

IE10 also has some nice extensions for touch interfaces that control scrolling and pan/zoom on elements. For example, the new -ms-content-zooming CSS property controls zoomability and the -ms-scroll CSS properties control scrolling behavior. These do not seem to be standards track yet, so it would be good to see some working drafts from Microsoft covering these new properties.

What’s Missing From IE10?

With all the substantial catchup, there are a number of notable HTML5 technologies that haven’t appeared in IE10, and given Microsoft’s platform strategy, seem unlikely to ever show up there. First, WebGL is explicitly off the menu. To work with 3D graphics, it seems that web developers will have to use the JavaScript bindings to Windows Direct graphics APIs and distribute their apps only as Windows apps. Similarly, media capture and Device APIs are missing and given the thrust of the strategy, seem unlikely to show up anytime soon. These are the types of API’s that Microsoft wants you to consume via native bindings.

And What Will Ship?

If you couldn’t tell already (!) we’re very excited by Windows 8 and IE10. We think it cements HTML5 as the standard cross-platform app development tech. We wish we didn’t have to use native packaging to get access to interesting device API’s, but Microsoft is unlikely to implement these without a competitive spur. The final, but major, caveat is whether all these technologies will retain their speed and performance when Windows 8 is squeezed onto next year’s $299 tablets which are likely to have a GigaByte of memory and a lower-powered ARM processor.

We certainly hope so.

There are 25 responses. Add yours.

Murali Srinivasan

3 years ago

Does it mean Sencha will support IE10 in future?

Mitchell Simoens

3 years ago

“Microsoft is back with a vengeance.”

Who would of thought :D

Jay Garcia

3 years ago

Great post, Michael.  Should be interesting to see how the enterprise adopts metro.

Michael Mullany Sencha Employee

3 years ago

@Murali - yes we will be supporting IE10 in future releases of Ext JS - we’re a cross browser framework and we have to work on everything with any reasonable usage share (including IE6)

Murali Srinivasan

3 years ago

Actually I meant Sencha Touch apps, not ExtJS.

bhan

3 years ago

Sencha Rocks…...........

Marco Berrocal

3 years ago

Great, I am cautiously optimistic. The real hindrance is to get people moving to new platforms, as I have to say it is still somehow divided between 45% using XP and the rest a combination of Vista and Windows 7. These are rough stats, if someone has something more accurate, do share.

I have to ask, are these new CSS3 properties, vendor specific? -ms-transition {all 0.3 ease-in;}, etc…

John

3 years ago

Will it be bug free (or at least bug-lite). That is the important question.

Peter Kellner

3 years ago

Michael,
I can’t tell from this article if you think Sencha will create tools that run inside the WinRT native windows 8 environment.  That is, MIcrosoft will provide a dozen or so JavaScript widgets that can access the native calls.  Will Sencha enhance this with it’s toolkit somehow?

Michael Mullany Sencha Employee

3 years ago

Peter - the impression I got at Build, was that’s not just a dozen JavaScript widgets, it’s the entire WinRT API will come in a JavaScript flavor. But we’re still just digging into the Win8 JavaScript stuff here - too soon to tell what we could do.

Michael Mullany Sencha Employee

3 years ago

Marco - yes the new stuff is vendor-prefixed (just as it’s vendor prefixed on the other browsers). So get ready for lot of repetitive -webkit, -ms, -o, -moz typing

Peter Kellner

3 years ago

Hi Michael,

I think it is some of both.  WinRT is available through a very thin layer from both JavaScript as well as C#/VB.  That gives you the basic async HTTP PUT’s GET’s, File System Open’s, Play Video, etc.  That is really just the API Layer, not the UI itself.  I believe the dozen controls MS will deliver are the UI (and I think leaving a gaping hole for control vendors all try and fit themselves through). 

I’m hoping you guys have WinRT and those 10 controls spread out all over the floor of the sencha office and are trying to figure out how to get to those 450 million desktops MIcrosoft seems to think Windows 8 will reach.

Richard

3 years ago

Internet Explorer is the devils sporn and I try to avoid it as much as that old bloke at the end of my street who smells like a mixture of stale urine and scrambled eggs.

TBH, I wouldn’t care if Internet Explorer became a fully artificially intelligent browser with quantum capabilities, I still would switch to it because its none of Microsofts business what I had for supper this time last week.

You see, my privacy is very important to me and likewise, if your privacy is important to you, then you should stay well clear of the Mephistopheles of internet browsers as all IE users just like Faust, selling their soul.

Martialen

3 years ago

Oh come now, Richard.

john

3 years ago

Regarding IE: It sucks. We’ll see if IE 10 ( that’s version t-e-n people!) will at last be better. Of course if running it requires installing ( read : buying ) another new and expensive M$ OS, then I might just as well buy an Apple machine.

Bob

3 years ago

@Richard:  OMG you have no hope with that attitude.  You are blinded by your biggotry and hate.

@john:  Yeah because Apple stuff is soooooo much cheaper.  Nice one.

Bz

3 years ago

Except that MS isn’t back.
It will be back next year. When they actually ship W8. If they ship next year.
By that time, I’m guessing they’ll be obsolete again.

Can you guess what W8 stands for? (Wait and see..)

Lennie

3 years ago

@john I expect IE10 will be available for Windows Vista and up. The problem is obvious: IE on Windows XP

@Richard You forgot to mention Google Chrome, same problem

@Michael Mullany The lock-in will be with the OS-specific extensions for the Windows Store apps (WinRT) and the VisualStudio support which will use those extensions to ‘create really exciting applications’ which will not work on the normal web.

Michael Mullany

3 years ago

@Lennie - according to Cnet, Microsoft has already said that IE10 will only be available on Win7 and above (no Vista). The silver lining apparently is that because almost every company skipped the Vista generation, it’s in the low single digits of desktop share. (And agreed on the lockin sources)

Satish Srivastva

3 years ago

Good One..!!

Lennie

3 years ago

IE10 is kind of useless if you can’t tell users on Vista and XP* to upgrade to it.

IE on Windows XP is the new IE6 and IE9 on Vista is the new IE8. :-(

* Same with pre- Windows Phone 7 obviously. Not sure if Windows Phone 7 will have IE10. I think IE9 is available ?

Cary Hartline

3 years ago

I never really like Windows and I absolutely despise Internet Explorer.  There are so many exceptions in code to be made for Internet Explorer that i stopped trying so hard to make it look the same as other browsers.  Hopefully, IE 10 will stop all of these exceptions and weird additions that are made to websites that make everything instantly awful so I can actually go back to trying to make things look nice in IE.  It’s really sad though that so many people use Windows and IE that we cannot ditch it for a better system and better browser.

????????????? ??????????????????

3 years ago

? ?????????, ???????? ?????? ????????????? ???? ??????? ???????? ?? ??? ???? ??????? ??????, ???? ?? ???? ??????? ???. ??? ????????? ????? ????????? ??????? ? ??? ??????? ? ??????? ?????????, ??? ??????? ? ????? ???????, ? ????? ???’?. ?? ?????? ? ???????????????? ??? ????????? ? ??? ??? ?? ???? ???? ???????? ?????????? ???????? ?? ??????? ???? ? ?????? ???????? ?????????????? ???? ? ???????? ??????. ?? ?????????? ???? ?????’??????? ?????? ??????? ????? ???-????????, ? ????? ????????? ????????, ??? ????? ????? ????????? ???? ?????? ???????????? ??????????? ?????? ??????? ???. ???????, ?? ?? ??? ??? ???? ???????.

Rita

2 years ago

Okay I’m cnoivnced. Let’s put it to action.

Ray

2 years ago

“I would not use this Window 8 after trying it for all the windows 7 software for free”

Comments are Gravatar enabled. Your email address will not be shown.

Commenting is not available in this channel entry.