Development for Mobile Devices Part Deux

IDC has reported that it believes 1.3 billion (that’s about 1/5 of the world’s population) will be connected to the internet via mobile phone by the end of this year. With that much thin-client capability and connectivity, it’s hard to ignore the mobile browser as a very viable means of putting mobile applications in the hands of the consumer.

Developing for mobile browser however is a tricky business since the choice of browsers running on mobile devices is much greater than in the desktop world. The good news is that thin client development allows many organizations to reuse most, if not all, of the backend of their applications. Getting the apps to the device is also a lot easier. It’s the user interface portion of the application that needs to be addressed to support the mobile browser thin client.

Most of the mobile devices come with the built in browser however more and more devices allow you to download third party browser.

Here is the list of built-in default browsers:

• Android (mobile phone platform) by Google (based on WebKit)
• BlackBerry Browser by Research in Motion (proprietary)
• Blazer by Palm, installed on all newer Palm Treos and PDAs (based on NetFront).
• Danger browser by Danger (proprietary), installed on all Danger-designed devices including the T-Mobile Sidekick.
• Embider by Infraware[4] (proprietary).
• Internet Explorer Mobile by Microsoft
• jB5 Mobile Browser by Jataayu Software, available on Symbian Series 60, Windows Mobile and Linux Platforms
• MOTOMAGX by Motorola (based on WebKit).
• NetFront by ACCESS Co., Ltd. (proprietary).
• Nokia Series 40 Browser by Nokia (proprietary).
• Novarra nWeb (proprietary).
• Obigo Browser by Obigo AB (Sweden), 100% owned by Teleca AB (proprietary).
• Openwave Mobile Browser by Purple Labs (newly aquired from Openwave) (proprietary).
• Opera Mobile by Opera Software ASA (Norway). - Capable of reading HTML and reformat for small screens (proprietary).
• Picsel Browser by Picsel Techologies (Scotland) (proprietary).
• PlayStation Portable web browser by Sony (based on NetFront).
• Safari by Apple Inc on iPhone and iPod Touch (based on WebKit).
• Iris Browser by Torch Mobile for Pocket PCs (based on WebKit).
• Wapaka Browser Java micro-browser by Digital Airways.
• Web Browser for S60 by Nokia (based on WebKit).

And here is the list of browsers that can be downloaded and install on your mobile device:

• Bluelark Bluelark bought by Handspring Inc.
• Deepfish Beta from Microsoft
• Doris by Anygraaf Oy (Vantaa, Finland)
• iPanel for Palm OS,
• jB5 Mobile Browser Beta from Jataayu Software.
• JOCA by InteracT!V, another proxy-rendering free software.
• Minimo by Mozilla Foundation (based on Gecko).
• Opera Mini by Opera Software - supports most features of stand-alone Opera, but can run on less capable phones by offloading memory-intensive rendering to proxy server (based on Opera Mobile running on a server).
• Opera Mobile by Opera Software - supports all modern web standards supported by desktop browsers, including XHTML, CSS2 and Ajax. Has advanced Small Screen Rendering that adapts regular pages to small screen (proprietary).
• Pixo by Sun Microsystems (Pixo acquired by Sun July 2003)
• PocketWeb by tlogic.de
• RocketBrowser Rocket Mobile, Inc.
• SAS
• Stanford Power Browser created in Stanford’s InfoLab
• TeaShark - a free Java-based browser with a desktop-like layout
• ThunderHawk by Bitstream Inc.
• UCWEB by UCWEB Technology
• Universe by OpenMobl Systems
• Webby Mobile by AnOriginalIdea
• WebViewer - a free Java based browser by Reqwireless
• WinWAP by Winwap Technologies

As you can see the diversity is staggering. However there is good news on the horizon – Forrester assures as that:

“over the next few years, the highly fragmented mobile browser market will begin to settle out as regular Web developers target fully capable browsers like Opera Mini and Internet Explorer (IE) Mobile and those based on WebKit.”

Some of the browsers mentioned above such as Opera Mobile or Safari can display HTML (or XHTML) complete with cascading style sheets and client-side scripting. Therefore, the “normal” web site written largely with HTML/XHTML, CSS and client side scripts might be completely accessible in these browsers, even if they don’t always offer the best interface given the constrains of display space and interactivity. However, in other cases, a web site or web application may need to be rewritten or otherwise dynamically converted into an alternative markup/wireless protocol. Again, there are plenty of choices. However there seems to be increased consolidation toward XHTML-Mobile Profile (MP). A lot depends on where (United States vs. Japan vs. …) and when (today, in a couple of years, etc.) you intend to offer your application and on what types of devices. Below is the list of most popular markup options in use today.

Another option for developers of the mobile Web applications is to use Mobile Development Platform such as Netbiscuits or Swift. I will describe how such platform may be used using Netbiscuits as an example.

When a mobile device requests a URL of your Mobile Web Application, this HTTP Request

will be routed to and processed by the Netbiscuits platform. The platform is working similar to a proxy server. In a first step, Netbiscuits will forward the HTTP-request to your Web- & Application-Server (e.g.

Apache, Tomcat, IIS, etc.) which hosts the BiscuitML (BiscuitML is an XML-based markup language used to build mobile web pages with the Netbiscuits Platform)Application. As in a normal web application, you will process the request and retrieve content from a Content Management System or database for example. Instead of creating HTML output, your application has to send a HTTP response back containing a valid BiscuitML document. The BiscuitML markup will then be processed by the Netbiscuits platform and be transcoded into the right markup (XHTML MP, WML etc.), specifically optimized for the mobile device that sent the initial request (Software such as WURFL or DeviceAtlas is used to determine parameters of the device) . Although BiscuitML pages can be static pages, in most cases you would create dynamic applications, of course. You can do that by using your preferred programming language like Java, PHP, C#/VB.NET, etc., whatever you find useful to create dynamic web applications. Plugins for certain IDEs are available as well, which make development with BiscuitML easier. The page content itself and also images that should be displayed inline in the pages of your mobile portal can reside on your Web- and Application server. Other multimedia files, especially those used as downloads (e.g. wallpapers, videos etc.), need to be uploaded to the Netbiscuits Media Repository first.

Below is high level architecture diagram of a Netbiscuits web application:

Mobile Web 2.0?

Now we know how create Web Apps for Mobile devices. Next question is – Can we make it Rich? Can we give customers what they come to expect using regular Web? It may be surprising but the Rich Mobile Internet dubbed Mobile 2.0 is the current battleground , with companies such as Microsoft, Sun and Adobe offering their own solutions. Unlike their desktop counterparts, mobile RIA solutions are not always integrated as part of the browser. So each technology/RIA application may require users to install yet another engine the mobile device in order to load and display. This certainly blurs the line between RIA applications and other native or resident applications for the mobile devices. So what are the options for RIA on mobile platforms?

Flash Lite

Adobe’s Flash Lite is a scaled-down version of Adobe’s ever-popular Flash Player that is engineered specifically for mobile devices.

This RIA technology provides access to a mobile device’s features, including Bluetooth, camera, microphone, and GPS. Developing with Adobe Flash products is considered easy, and a large and active community is available for support and help. Flash Lite’s strength is that it uses vector-based graphics (although it also supports bitmapped graphics) which scales well on screens of varying resolutions—but sometimes at the cost of poor performance. You can conveniently convert desktop Flash content to mobile Flash Lite displays with minimal effort, which helps if your organization already uses a lot of Flash on its web site or in its web applications. Flash Lite can also run on top of other runtime environments such as Java ME or BREW.

Flash Lite has not been widely available on mobile devices outside of Japan and Korea, but this is rapidly changing. Adobe’s 2007 Financial Analyst Meeting notes indicate that over one billion handsets will include Flash capability before the end of 2009. Access to Flash Lite content can be expected to blossom as more carriers and devices support the platform. Most of the major cell phone providers (LG, Motorola, NEC, Nokia, Sony Ericsson, etc.) now ship with products that have Flash Lite pre-installed.

Silverlight

Straight from Microsoft’s Silverlight web site, Silverlight is described as: “a cross-browser, cross-platform, and cross-device plug-in for delivering the next generation of .NET based media experiences and rich interactive applications for the web.” What does that mean? Well, Silverlight is intended to be a competitor to Adobe Flash. However, instead of compiled applications (such as Flash delivers), Silverlight applications are delivered to the browser in the form of Extensible Application Markup Language (XAML), which is an XML-based language. The XAML is then read and used by a browser plug-in to display rich content. The plug-in reads the XAML files, which can declaratively specify the UI, and play MP3, WMV, and WMA files without a Windows Media Player or the WMP ActiveX control. Microsoft is expected to make Silverlight available for use with some mobile browsers.

On the positive side, because XAML is text and not a compiled file, supporters say Silverlight applications will be more “searchable” via engines like Google than Flash applications. Silverlight 1.0 is expected to be released for mobile platforms (specifically Windows Mobile 6 platforms and Nokia S60 devices) by the end of the year.

JavaFX Mobile

JavaFX is meant to compete with both Silverlight and Flash. JavaFX is a family of products initially comprised of JavaFX Script and JavaFX Mobile. JavaFX Script (JavaFX for short) is a scripting language meant to provide rich user interfaces using syntax that resembles JavaScript and Scalar Vector Graphics (SVG). As its name implies, JavaFX Mobile is intended to be used on mobile platforms.

JavaFX Script is a scripting language that runs on top of a Java runtime. JavaFX resembles Java, JavaScript, and other scripting languages in some of its syntax, but developers can also use the standard Java syntax and make use of an extensive set of Java APIs. Sun claims that Java is the most ubiquitous application platform for mobile devices and can be found on over 2.1 billion devices—a lead it does not intend to give away to the likes of Silverlight or Flash technology. However, where Silverlight on mobile platforms may be considered a young technology, Java FX is, in fact, an infant technology - Java FX Preview SDK had just been released.

JavaFX Mobile is mostly based on technology which Sun acquired when it bought SavaJe in April last year. Sun has developed Java as a technology which it can license to others. However, JavaFX Mobile has been developed as a product it will sell.

Mobile AJAX

Mobile AJAX is nothing more than AJAX used on mobile browsers, in other words, mobile AJAX is just AJAX. Those who believe that writing native application software is the wrong approach to mobile software development (and that native mobile applications are on the way out) may find additional support for their case in “mobile” AJAX. Some mobile browsers do not provide all the necessary technologies and standards (such as JavaScript, CSS, and DOM) required to create usable AJAX applications on mobile devices. Increasingly, however, and as discussed earlier, many do. Opera Mobile and Mini(version 4), IE Mobile, Mozilla’s Minimo as well as browsers on the Nokia S60 and the iPhone, all run AJAX, albeit sometimes with limitations.

The mobile browsers listed above typically fall on mobile devices classified as smart phones or PDAs (or both). Even on these devices, some limitations of AJAX technologies on the devices can lead to issues. For example, JavaScript performance is quite poor on the first iPhone resulting in slow rendering of AJAX pages (on the new iPhone the performance should be much improved). Also, DOM manipulation and extensive JavaScript execution can tax the devices’ CPU and memory—which can impact the device’s performance and quickly drain its power supply. But as the capabilities of mobile devices increase, the availability and use of AJAX in all its forms may also increase. In fact, mobile AJAX may actually help resolve some of the issues associated with mobile browsing. For example, AJAX can be used to make it appear as if the content loads faster by loading only the necessary parts of a page (typically much smaller), on a mobile device. Also of note, in September of 2007, the World Wide Web Consortium (W3C) and the OpenAJAX Alliance held a workshop on Mobile AJAX.