Desktop HTML5 vs. Mobile HTML5, with Aditya Bansod

Recorded at:

1. We’re here in QCon San Francisco 2011 with Aditya Bansod to talk about HTML5 application development. Hi, Aditya. Would you like to introduce yourself?

Sure. My name is Aditya and I run the Product Management Team at Sencha. Sencha is a vendor of HTML 5 tools, frameworks and cloud service that help developers get on to mobile and desktops as quickly and as efficiently as possible.

2. What are the main reasons that made you interested in working with the HTML5 platform? Why was it more attractive than older platforms?

Certainly. So, my background actually was building latest capabilities and components in the Flash team and Adobe. And one of the things that I saw when I was starting to look at the ecosystem as a whole was the ability and the new capabilities that are available in HTML5 and more than anything, the prevalence of HTML5 in mobile.

So, with that capability, you know, I kind of got really attracted for the ability for developers to create rich application, really on the desktop but more specifically in mobile and their ability to get access to, you know, things that were not possible to forth in the traditional web where these were hardware-accelerated graphics, canvas, vector drawing, WebSockets, Web SQL, WebGL - all these new capabilities made the web a really attractive platform.

I kind of personally felt that I was attracted to the evolution of development paradigms that people can actually use. And also the Web is an open development platform completely disaggregated with search and links as kind of main discovery mechanism.

So, those are things which really brought me into the Web and we thought the Web would be very powerful place especially the Open HTML5-driven web.

3. So, coming from a Flash background as you mentioned, how do you see things like tooling compared to HTML5 platform?

Even if we take Flash and use this as a kind of generalization of Flash, Java, a lot of the other kind of native platform, ObjectiveC or Android. You know, the tooling there is very sophisticated. They got years of both vendor development for the tools but also really heavy computer science and how to do debugging, stack trace analysis, injections -all that sort of stuff.

So, when I look at the Web and I see two major things on the tooling that made a big difference. One is kind of about two years ago, three years ago, the Renaissance, and actually I can apply computer science way to approach JavaScript. So you have V8, Nitro, SquirrelFish Extreme even some of the work Adobe did with the Tamarin engine. I think that really helped catalyze a lot of the reinvigoration of really heavy hitting computer science types to use the Web and JavaScript in particular and upgraded to a first rate development platform.

The tools kind of came along with that - the new Chromes, the new Safaris are really very powerful, our Web inspectors and developers consoles step-by-step debugging, inspectors, conditional breakpoints - so you get all of that in one side.

And the other is the actual developer tools like I am actually writing an application and so what we see there is companies like Sencha and others in the field making tools like Sencha Animator for timeline and visual-based animations to make kind of rich interactive content and things like our other product Sencha Designer. So, like actual engineers who want to write software but visually assemble their application, do a lot of work there.

I think the Web, in general, has a ways to go to have the development tools and the place where the native and some quasi-native tools are. But I think that’s kind of where the first step of that evolution. So, I think the core framework and the core platform technology is very on equitable ground now. I think the next major step is really around the tooling.

So, first step in place but I think there’s a couple of years of innovation left there.

4. We talked about the core platform. So, with HTML 5 being a huge collection of specifications, what technologies do you find more interesting and why, especially in the mobile field where Sencha is the leader?

Yes. So, there’s a kind of core API that you need to build an application. So, I look at APIs like CSS3 and CSS 3D, 2D and then CSS animation and transformation specs. Those are the kinds of CSS3 specs set. I think it’s one of the underlying, underpinning capabilities to let HTML 5 on mobile really where we’ll get the hardware-accelerated benefits, really shine and that’s where we’re going to get the time platform so that we can actually get to a place where it will be competitive with native.

The other side is the cool kind of innovative stuff. We saw this kind of battle between IndexDB and Web SQL that was going on and we’ll kind see what that nets out but either one of those technologies will get a very capable kind of client environment that restores structured and semi-instructored data. So, I think that’s one very exciting area. The second one, really, I think, a lot about WebSockets; so, there’s a lot of vendors who are really doing really interesting things on WebSockets -whether it’s on the real-time Web or the Web for gaming purposes or whatever it is. I think that’s going to be a very interesting kind of second major area. And then the third one is kind of in a gaming segment. You know, when you look at what you need to build the last real realm where native holds a superior position is really in gaming.

So, WebGL and hardware-accelerated canvas; so, you have the 3D and the 2D world. I think that can make a big difference. I’m really excited and pretty bullish about where that’s going. The reason is, if you look at iOS 5, really the HP touchpad as well and what they did on hardware-accelerated canvas, it’s faster than in many cases in the desktop.

And so, especially on mobile, you know, those are the kind of capabilities that let you pull developers into other ecosystems and make kind of first party grade A titles. On top of it you’re actually see it in enterprise a lot too, right - where you have the kind of whatever we talk right now, the consumerization of enterprise. So, we’re really rich in visual kind of applications for high quality customer enterprise engagement.

5. You talk about WebGL hardware acceleration, do you what’s the current state of the art?

There are two kinds of ways to look at hardware-acceleration: one’s in the 2D world and that’s on canvas; and one’s on 3D world which is WebGL and then if you can bifurcate that again by looking at desktop versus mobile. So, we’re seeing at the first steps of hardware-accelerated 2D canvas. iOS 5 supports hardware-accelerated , HP touchpad, Web OS did. Android was initially very good but that has been leap frogged on canvas with this new hardware-acceleration capabilities. So, I think they’ll catch up as well.

On desktop, you know, IE10 really is kind of I think the leader in canvas performance. They’re incredibly fast. They have got a really strong work to make it really rocket fast - that’s a 2D universe. The 3D universe and WebGL mobile is very, very - it’s a major lagger in adoption. The only place you can really use WebGL right now in mobile is if on iOS if you’re an iAd developer. iAds are the only thing that have access to the WebGL capabilities.

Now, people put together on the Web, they resemble some hacks so they can get access to on jail-broken devices because APIs are all there. They’re protected from you; but WebGL is kind of really far from, I think, maybe another six to twelve to eighteen months for really strong adoption on mobile. You know, kind of very bullish on how that’s going to go but it’s really leading in desktop right now. We’re seeing very powerful WebGL capabilities and hardware-accelerated WebGL capabilities on the desktop with Chrome and Safari and all the other major browsers.

6. Actually yesterday, Chrome announced they re-launched the Android.com with some really good-looking canvas 2D and 3D effects, which actually on MacBook spins both of my cores to 70%.

It’s funny so you know, on those cases, it’s another example, where mobile is leading right?

7. What do you think are the biggest challenges that developers face with HTML 5 apps and what are usually the best practices to overcome them?

One was we’ve got covered a little bit earlier is the tooling gap. So, I think that one is going to be addressed with time, you know, as function of companies like Sencha helping out there. The other big one that challenges developers face is the difference between different browsers. So we’d all like to believe HTML 5 is kind of the gold standard across platform compatibility but in practice anyone who has spent time with the platform knows that’s truish - it’s not completely true. Android’s got certain limitations. iOS got certain limitations. Windows phone is going to be a whole new beast, because it’s the only one that will not use Web. It’s using it Trident rendering engine.

I think the other one is a lot of vendors and company, like of, a lot of media companies, enterprises have attempted to build applications that go straight to the browser, use HTML5 and pure semantics and a lot of them are finding that’s not been the best approach and so they’re going back to frameworks whether it’s a Sencha Touch, jQuery mobile -take your pick but a lot of them are really finding that writing pure at a browser layer itself, you need one level of abstraction to build components in advance, messaging and all that sort of stuff.

So, we’re seeing then as a way that these developers are overcoming it is going to these frameworks.

8. We talked about how the mobile space moves in a different speed. Do you see these tools continue to diverge? I mean in the mobile space you have the good thing that you get new devices, so, you have grade-A browsers. How do you see those things?

It’s two-fold really. I mean, I think on the mobile devices, you are doing the hardware refresh cycle, that’s just as much as the software refresh cycle to array which is there is a new iOS pretty regularly; there’s a new Android fairly regularly.

I think we’re actually seeing mobile outpace desktop. It’s not so much in terms of the overall features but actually implementation of those features. So, I mean this is really in the case where mobile requires really deep consideration on how batteries affect them and how performance operates because in the desktop world, you have the benefit of basically free CPU; on mobile you don’t.

The browser is doing all these hardware-accelerated work run on the GPU, run on caching appropriately, cache manifestos are really important no mobile. There’s a latency in networks. So, I think what you‘ll see there is where battery and network come into consideration where mobile will really lead the charge. But it’s kind of just a rich proliferation of features. I think that’s how Apple continues to do that because Chrome can push out from 15, 16 and 17 WebGL and new Web socket, APIs, and new file APIs really rapidly but that’s in pipeline of innovation or the pace of innovation - they don’t have the direct connection to do it on mobile.

So, in case where it’s kind of those feature rich ones, you know, we’ll see that’s innovating faster in the desktop side and use that networking device specific stuff. I think you’ve seen them innovating the mobile much more quickly.

9. You talked about considerations regarding energy. Are you suggesting that this will be directly handled by the actual developers or you mean?

I think you’re seeing that some of the developers absolutely must manage. I’ll give you one very specific example and what the developer has to deal with and what the browser vendor and the platform has to deal with. So, the developer - we have a lot of mobile radios work is if there’s an active connection, active data transfer happening, they’ll keep the radio alive at a full power of the radio stack. But when the connections start to die down, they’ll start to reduce the power of exertion, no need for telephony; there’s no need for data right now.

Imagine if you build an application where every one minute you’re doing a big data pull. So, you’re letting the radio basically die down and so power off and then power back-up so that actually it has to hit the network again. And so there is a kind of sinusoidal way of actually hitting the radio is what the developer can be doing and correctly, we know how that consideration of the desktop.

So, I think developers have spent a lot of attention understanding really specifically and how the network interaction drains the battery and how it can actually affect the way that the data radio actually operates. Then on the browser side, that’s where like other CSS 3 hardware-accelerated comes in. You try then to do a radio just completely destroy your battery.

10. How do you see the HTML 5 platform evolving in the near future? Any predictions, I mean, it was a revolution when it started or something new but after 2D and 3D animations and WebGL, what’s next? Is there something missing from this stack?

Right. So, there is absolutely one major massive, I think, elf in the closet, that’s missing from the browser stack and that’s rich device APIs. Hands down, like the ability access, the camera is very broken across on mobile right now and then the ability access calendar and contacts, especially on mobile, the core device APIs.

I’m not necessarily talking about IMAP payments or all those other things -it’s the core feature of the actual hardware, I think, are a massive whole in the Web platform right now. The Android has started support as Honeycomb they supported they media capture API but they don’t support streaming videos so you can’t actually build a web up that does voice conferencing or video conferencing.

I think that’s like a big whole. I’d say, "How do we get the device APIs?" That kind of road map, I think, for where the Web needs to go is really well settled up and kind of where the media industry will need to push it.

So, I think, in the enterprise in this case, we’re in a good spot now. We’ve got hardware-acceleration, we’ve got really this powerful networking stack with XHR2 and all the new capabilities there but the media stack, I think, it’s where it’s going to get really interesting especially when you get looking at the gaming segment - so graphics again, audio is completely broken in mobile and completely broken in desktop, getting AV sync between characters making motions and speech like this doesn’t work very well right now.

11. This has been the holy grail for ages.

Yes, that’s a really good place like Flash has actually done fairly well because they own the entire AV stack and so, there’s a couple of other areas where I think the Web could innovate too and that’s kind of the delivery of premium video and that - always kind of walk into the DRM conversation. I’m not sure if that’s the right place for the Web to do that but it’s an interesting gap that’s going to exist in the Web for some time, larger because the IP issues that surround that technology side.