Keon and Peak: Two Firefox OS smartphones tested

Browser Reloaded

A single program runs on the hardware described here, and that is the browser. The phone apps the user perceives as applications are technically sites that you open by clicking on a link. However, these are not static HTML pages but web applications. Thanks to many new Internet standards, the differences between native desktop programs are even more blurred now than was the case with the first generation of Ajax applications (Figure 8). Because it also works offline, the client-side JavaScript run-time environment is particularly in demand, but you can also use server-side programming.

Figure 8: Many new technologies from the HTML5 environment make the browser a powerful run-time environment for phone apps.

The technologies attributed to HTML5 provide graphical and multimedia features that were impossible to implement without plugins in HTML4: Free-form drawing in real time (Canvas), animations (CSS3, SVG), sound without plugins ("audio" tag), and even OpenGL-based 3D graphics (WebGL). Modern browsers also store data sets locally (local storage, Files API) that far exceed the size of a cookie.

With IndexedDB, they can even provide a simple NoSQL database. Cache manifests instruct the browser to keep resources from the Internet even after terminating the online connection. Additionally, WebSockets and server-sent events finally implement true, two-way communication between client and server. Web workers launch background threads that do not block the GUI.

Regardless of whether these new APIs are mature enough to use on public websites, they are definitely available for apps in Firefox OS.

Table 2 lists the Mozilla documentation for the aforementioned technologies.

Table 2

New Web Technologies in Firefox

Technology

URL

Multimedia

Sound

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio

Video

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video

Canvas

https://developer.mozilla.org/en-US/docs/HTML/Canvas

WebGL

https://developer.mozilla.org/en-US/docs/Web/WebGL

Storage

Cache API

https://developer.mozilla.org/en-US/docs/HTML/Using_the_application_cache

Local Storage

https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Storage

File API

https://developer.mozilla.org/en-US/docs/Web/Reference/File_System_API

FileHandle API

https://developer.mozilla.org/en-US/docs/WebAPI/FileHandle

IndexedDB

https://developer.mozilla.org/en-US/docs/IndexedDB

Hardware/Communication

Web workers (threads)

https://developer.mozilla.org/en-US/docs/Web/API/Worker

Web API (access to phone hardware)

https://developer.mozilla.org/en-US/docs/WebAPI

Server-sent events

https://developer.mozilla.org/en-US/docs/Server-sent_events

WebSockets

https://developer.mozilla.org/en-US/docs/WebSockets

Open Web Apps standard

Overview

https://developer.mozilla.org/en-US/docs/Web/Apps

https://developer.mozilla.org/en-US/docs/Web/Apps/Getting_Started

Installation

https://developer.mozilla.org/en-US/docs/Web/Apps/JavaScript_API

Local installation

https://developer.mozilla.org/en-US/docs/Web/Apps/Packaged_apps

Permissions

https://wiki.mozilla.org/WebAPI

Hiding browser controls

https://developer.mozilla.org/en-US/docs/Web/Apps/Manifest

User interface

Touch API

https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Events/Touch_events

Drag and Drop API

https://developer.mozilla.org/en-US/docs/DragDrop/Drag_and_Drop

HTML5 forms (for date input, etc.)

https://developer.mozilla.org/en-US/docs/Web/HTML/Forms_in_HTML

Hardware

Web applications that you expect to behave like normal Android or iOS apps need regular access to the hardware of the mobile device. The W3C Geolocation API [7] that lets a browser access the current GPS coordinates is a start, but obviously not enough: The phone apps need access to the cellular network status, display lighting, and battery status.

Hardware access is mainly controlled by Mozilla's Firefox OS focused Web API (Figure 9) [8]. A manifest [9] requests the permissions that the user can grant or deny a particular domain (application) [10].

Figure 9: Depending on their origin, some web applications are only granted various rights to access the hardware after the user confirms.

Some rights are always reserved for locally installed apps (packaged apps), and some even only for privileged apps from the Mozilla App Store. They receive this status after a review by the store operator. Firefox assigns packaged apps to a pseudo-random domain locally during installation; this domain handles the rights management of the browser as for normal web pages.

Look and Feel

Certified apps (i.e., Firefox OS system applications) reside at the top level. They are the only apps given critical authorizations, such as the ability to dial a phone number. Again, these are web applications whose rights the browser manages in line with the guidelines of the Web API [8].

Despite the use of advanced HTML5 techniques, they do not feel like apps (Figure 10) while the programs run in a browser window. The Open Web Apps standard [11] lets you hide all of the browser elements. At the same time, a start icon appears in the Start menu of the Gaia GUI.

Figure 10: The browser goes into hiding: Web apps usually start in full-screen mode.

In Firefox OS, the starter icons end up on a home screen that looks no different from that of other mobile systems (Figure 11). The aforementioned app manifest governs the building of elements like the starter icon. Each web page can link apps with Firefox OS via a JavaScript interface [12].

Figure 11: The buttons on the home screen of Firefox OS are just links to HTML pages.

Buy this article as PDF

Express-Checkout as PDF
Price $2.95
(incl. VAT)

Buy Linux Magazine

SINGLE ISSUES
 
SUBSCRIPTIONS
 
TABLET & SMARTPHONE APPS
Get it on Google Play

US / Canada

Get it on Google Play

UK / Australia

Related content

  • Firefox Phone

    The ZTE Open C Firefox phone costs less than $70. The integrated developer environment in Firefox makes Firefox OS ideal for users who always wanted to develop their very own apps.

  • Firefox OS vs. Android

    Firefox OS has come out of nowhere to challenge Android and iOS in the mobile operating system market. We'll show you what is different about Firefox OS and compare a recent Firefox OS phone with a comparable Android device.

  • Firefox 4 Beta 4 Released

    Sync, improved HTML5 support, WebGL support* top the list of new enhancements to the beta.

  • Firefox 4 Beta Loves HTML5

    The beta release of Mozilla's new browser adds more HTML5 features including support for WebM.

  • Firefox for Mobile (Fennec)

    Firefox goes mobile – a “desktop” browser in the palm of your hand.

comments powered by Disqus

Direct Download

Read full article as PDF:

Price $2.95

News