Thursday, May 2, 2013

Politics, Lies and HTML-5- Part I



"Three Rings for the Elven-kings under the sky,
Seven for the Dwarf-lords in their halls of stone,
Nine for Mortal Men doomed to die,
One for the Dark Lord on his dark throne
In the Land of Mordor where the Shadows lie.
One Ring to rule them all, One Ring to find them,
One Ring to bring them all and in the darkness bind them"
- Lord of the Rings

This poem typically describes the "promise" of HTML-5. HTML-5 has been touted as the "Holy Grail" of development. A language that finally delivers what Java Applets could not, a way to write applications once and make them work on all platforms Web/Mobile any OS anywhere. Managers(especially high-level CTO's) are typically taken in by this and dictate that instead of writing everything multiple times we shall write it once in HTML-5 and use it across. 

However, the recent "Facebook" volte face on HTML-5 and my own experiences as an HTML-5/CSS programmer has shown that managers must choose extremely carefully if they want to tread the path of HTML-5. If you go on the internet, there are people opinionated on both sides. There are ardent HTML-5 Fans and ardent HTML-5 haters. 

In a series of post's I will like to talk about HTML-5, broadly as follows:

Part-1 :The politics and history behind HTML
Part-2: The contemporary state and when to and when not to use HTML-5
Part-3: Evaluation of the best JavaScript frameworks for mobile development


History Lesson: The Making of HTML-5
So what is HTML-5 ? Where did it come from ? And what happened (or might have happened) behind the scenes to suddenly make it such a marketable term.

Let's look at the computing scenario a few years ago(say 2005):
1.) Dominant Consumer Operating System(Mainly PC's and Laptops): Windows (>90%)
2.) Dominant Browser: Internet Explorer(>90%)
3.) Dominant Server Platforms: Fragmented

Whenever a platform is fragmented, there is always a push to try and make "Cross-Platform" code. Most of the code written in the world is not rocket-science and so it is a pain for small startups and shops to write code for every platform. It is this "fragmentation" that was exploited by SUN/Java to make J2EE a dominant enterprise software platform. However, as most people from the early 2000's know, J2EE is and was very slow. Writing, anything cross-platform reduces  performance.

Something happened around this time, we call this the Web 2.0 phenomenon. Computing started moving towards the web and away from the PC. The logical culmination of this is the cloud. Thus PC's began to transform into nothing but portals for the web.

This was fueled by two things:-

1.) Better User-Interfaces using ActiveX, Flash, SilverLight...
2.) Better(But not as great as Point 1) User-Interfaces using Web 2.0 technologies.

The best UI's were written in Flash(or ActiveX for enterprisy programs like Test Director). Web 2.0(AJAX) improved the Ux, but nothing could match Flash. 

Why was the famed- "Web 2.0" not able to replace Flash:- Because they could not hook into native os code, like the way flash did in a manner consistent on all platforms.

Flash became the JVM that never was. You program to flash and flash would ensure it would work cross-platform. It was a great deal.

If you have to program in "Web 2.0" you needed to take care of a multitude of things:-
1.) Will it work in IE 6,7,..
2.) Will it work in Firefox
3.) It might be right code, but oops..IE has a bug in rendering it that way
4.) Did you know there are 2 different Ajax objects....
etc..etc..etc...

Add to that the following:-

5.) JavaScript rendering was slow
6.) No way to do Video, Audio, Animations, etc...
7.) Very little tooling support(Firebug was not invented yet)
8.) No standardized way to integrate.

In other words writing a serious Web 2.0 app was a major challenge. On the other hand Flash had a drag-and-drop IDE with full tooling support. 
Flash promised the one thing Web 2.0 couldn't- Predictability.




The Empire Strikes Back- The politics and rise of HTML-5

So when did we move Web 2.0 to HTML-5 and what problems does it solve. Well HTML-5 attempts to solve some of the problems above, but does not manage to solve any of them completely.

Let us consider the thinking behing HTML-5 and why it was being developed by the major software platform vendors:-

1.) Microsoft had no interest in developing HTML-5. They were pushing for Silverlight and proprietary extensions. A lof of what you can do in HTML-5 could be done using Active-X.

2.) Google(Pre Android Acquisition) had the most stake in developing HTML-5. Google, wanted the "Web" to be the OS and wanted to control it via "Chrome"(Browser) and later "Chrome OS". Hence. it needed a new platform- HTML-5.

3.) Firefox(Mozilla) wanted to beat IE, and hence bet on HTML-5.

and then it happened: then came the iPhone and the mobile 'revolution'

The entry of Apple

So Apple in 2007 unveiled the iPhone and iOS. The device took the mobile world, by storm and it became the dominant computing platform for mobile phones. This was followed by the iPad another revolutionary device.

But it was more than that, it was an "Eco-system". Apple earned on app-store submissions and via native apps.

So what did Apple want:"They wanted developers to develop native apps and stick to their platform".

This sparked the whole question:- "Mobile Apps or Mobile Web". 

A enemy of an enemy is a friend 


The question that Apple asked is:- "Who is the biggest competitor to my user-experience?". The answer was not HTML or Web 2.0 , it was Flash.  Had Apple, allowed Flash to run on iOS people would have programmed even more in Flash as now they could do complete cross-platform using it.

So what did Apple do:- "They promoted HTML-5 by attacking flash". All the comments about Flash being unusable and a battery hog, were only partially true. Apple wanted to kill Flash/Silverlight etc and replace it with a puppet ruler: HTML-5, which they know isn't strong enough to challenge native authority.

And to ensure that it cannot: "Apps developed using HTML-5 do not have access to the Nitro JavaScript engine in mobile safari thus being even slower than a mobile web".

This was simple old-school colonialism:- Replace the current king who can resist, with a weaker puppet and further diminish his powers all the time .

Apple single handedly made  HTML-5 Cool....so that any user-experience other than native could not dominate.

Meanwhile...back in Google Land
Google suddenly found that their dreams of the web being the true platform were being overtaken by the mobile revolution. What do they do? They acquire Android.

Now, one must remember this: Android and Google were different companies and this still reflects.


Android was the answer the to the iPhone and became more mass-market. But Android, had the same aim as iPhone:- "Make native apps cool".

Google still had the aim to make the web-cool, so they continued investing in Chrome, however Android did not catch-up.

Android's default browser did not catch-up with Chrome and hence it continues to have a horribly bad performance vis-a-vis chrome.  The team put HTML-5 as a "lower priority".

How to make HTML-5 Cool?

So how did Apple and Google make a sub-standard or not ready platform - "Cool" for everyone to use.

Let us first understand what makes a platform cool. It can be bought down to just one word-  "Animations".

Try this out, open an iPhone and Android and play with it, then open the mobile website and play with it. Everything in iPhone and Android animates  smoothly.  Whether it is going from the homescreen to the apps or vice-versa.

To make HTML-5 Cool, it was critical that we had "animation" built into the browser.

Enter the Vikings- WebKit

So what really made HTML-5 cooler than Web 2.0. The answer surprisingly  lies in a software developed by a company which is widely considered dead in innovation:- Nokia.

Nokia, developed the "Webkit" engine which is the "rendering" engine that  powers a host of browsers. It all started with an effort to make a desktop UI for Linux(KDE) and then a "cross-platform" framework for native development(QT). The Webkit project was collaborated on by devs from Apple, Google and Nokia to define a system to make great UI's, great transitions etc.

Later it formed from KDE to develop into a rendering engine, and this was the rendering engine that powers Chrome and Safari.

So how to make it cool:- "Add webkit specific properties to do things like animations etc."
Webkit, allowed rounded corners, animations , video and a host of other features that meant you could make a UI that would look just liked the native animated cousins.

On top of that Apple added a bunch of tags to make it look like you can make great apps by wrapping webkit inside an app and could make great web-sites etc. by adding hardware acceleration etc.

However, there was a catch. "Android" did not implement all the features fast-enough and Apple made sure the WebKit experience was great in "mobile safari" but always lower than native apps. For example till iOS 6, you could not do file uploads in mobile safari and with iOS 6 you can only do this for Photos and the Gallery.

What about the other kings...


1.) Mozilla reacted to the growing increase in Chrome usage and in mobile safari by adding some of the same effects(using -moz tags). Later, everyone agreed to make them a standard in HTML-5.

2.) Microsoft, was loosing out big time. Neither was their browser king anymore nor their mobile platform and the OS was well only being used because it was legacy. It needed, do something fast. It did the stupidest thing imaginable. It removed support for Silverlight and joined the HTML-5 bandwagon with IE 10.

3.) Blackberry(Previously RIM) and other mobile vendors like HP realized that they needed to get WebKit on their side. So, they re-wrote their browsers by even buying companies, so they could get WebKit and hence "HTML Developers" to write code for them.

and hence was bor HTML-5, the true cross-platform language.

What's the current state


So, is HTML-5 really a puppet king, really sub-standard. Well, as the Americans learnt about the Taliban and Dr. Frankenstein about his monster, be careful who you make a puppet king, he may just come back and rebel...in the next post we will see where HTML-5 is and what can be done with it....