BlackBerry PlayBook Browser HTML5 support

The PlayBook tablet from RIM is about to be released in the following months. Its browser seems to have advanced (de facto) standards support, including Accelerometer, Adobe Flash Player, Web Sockets and Web Workers. In this post I will analyze browser’s compatibility.

2011 will be remembered as “the tablet year“. In a few months we will have at least 10 different tablets from major vendors in the market, including the one that started this new category, Apple iPad (iOS) and the followers Samsung Galaxy Tab (Android), RIM PlayBook (Tablet OS), Motorola XOOM (Android 3.0) and HP TouchPad (webOS).

In this case, I’ve made a research inside the RIM/BlackBerry PlayBook’s Browser that is available today inside the PlayBook Simulator. If you want to install it and try it for your self, see the “Mobile Emulators Ultimate Guide”. This is just a pre-release version of the OS and the browser, so it may have some little differences with the final version to be released in next months.

The browser, called just “Browser” inside the QNX-based Tablet OS, has a WebKit-based engine with an excellent HTML5 and new API’s support. In fact, it’s just behind Safari on iOS in terms of modern mobile browsers.

HTML/HTML5 webapp support

First of all, the PlayBook allows us to create three kinds of HTML5 experiences:

Browser-based webapps: just a website hosted on the web with an URL

Packaged webapps aka WebWorks apps: a compiled ZIP package with the contents of the webapp. A widget API is available.

AIR applications: with an embedded web browser using a hybrid technique.

The browser supports HTML5 and CSS3 like other modern mobile browsers.

Features available

It supports also some key APIs not available so much out there: Web Sockets, Web Workers and DeviceMotion API (the one I’ve discovered on iOS 4.2 for accelerometer detection). I should wait to test the accelerometer on the real device, but the API is available on JavaScript.

The browser supports:

CSS3 new visual effects

CSS3 animations

CSS3 2D transformations

CSS3 transitions

SVG and inline-SVG

Touch events & device orientation events

Viewport meta tag

Data URI for embedding images

File uploads

Font-face

Web SQL API

Web Sockets API

Web Workers API

Device Motion API (aka Accelerometer API)

W3C Geolocation API

HTML5-classic stuff: AppCache, Canvas, new input types, contenteditable, video & audio (even it’s not working right now on the emulator).

What APIs are not supported yet? 3D Transformations (like the one available on iOS), IndexedDB and WebGL (there is no mobile browser supporting it right now, but in iOS 4.2 is available but not working).

Plugins and extensions

I didn’t try the JNEXT Framework yet, but the framework site looks promising. I don’t know yet if we can access native code from a browser webapp or if it is restricted to packaged webapps. There is also a qnx.callExtensionMethod function available for connecting JavaScript code with Adobe AIR applications. I’m not sure if we can use it for a non-AIR application.

Using the browser

The browser is still in a beta stage: I had to restart it many times while doing my testing (for example, testing sms: protocol links).

Opening popups with window.open creates a new tab and there is no simple closing mechanism. For tabbed browsing, you need to use your fingers to create a swipe down gesture from the middle-top of the screen.