Mobile Web holds the future of embedded multicore

HTML5's Web runtime performance and Write Once, Run Anywhere (WORA) portability have the long-time Internet language speaking to embedded designers.

4Mobile devices such as smartphones and tablets are the current buzz around the water cooler these days. A key technology at the center of mobile device innovation is HTML5, which enables new models of dynamically generated and contextual content. Several features of HTML5 show promise to help solve two of the biggest problems in embedded design: application portability and performance.

HTML5 is the fifth version of the HTML standard, a language for content downloaded from the Internet. HTML had humble beginnings in that it was originally used to create and publish textual and simple graphical information on the Internet. HTML5 has evolved to encompass much more; it aims to provide a complete application platform. Focus areas for this version of the specification include source code readability, multimedia, graphics, device access, performance, offline storage, and connectivity.

A typical HTML5 application comprises a combination of three main components serving different functions:

  • HTML: Specifies page structure.
  • Cascading Style Sheets (CSS): Documents styling and visual effects.
  • JavaScript: Represents application logic.

Figure 1 is a source code example that illustrates how to create dynamic content with these three components. The source code is an HTML file that contains CSS and JavaScript sections. The application embeds an online image into a section with a blue background. When the user clicks a button, CSS is employed to rotate the image in 3D.

Figure1
Figure 1: Sample HTML5 application

Three properties give HTML5 the ability to easily create dynamic and contextual content:

  • Dynamic interpretation: HTML5 applications are packages of HTML, CSS, and JavaScript source code shipped as text. Applications are not statically compiled ahead of time like C or C++ applications. Instead, the language is interpreted during execution.
  • Functions are first-class objects: A function containing JavaScript code can be passed/returned to and from functions. This feature, in addition to dynamic interpretation, enables new code to be easily injected and executed from external sites.
  • Asynchronous support: Internet access is built into the language; it is second nature. External sources of information and content, such as the HTML5 picture in the sample, are easily accessed.

The trivial application detailed here does not represent all of HTML5’s capabilities. A more compelling example is seen at www.zygotebody.com, which presents a 3D model of a human body. [Editor’s note: Browser must support WebGL to view page.] Other compelling HTML5 demos and tutorials can be seen at www.html5rocks.com.

A potential embedded application for dynamic and contextual content generation is futuristic display boards in a shopping mall. Assuming sufficient security and agreed-upon privacy models, the display board identifies passersby, collects their purchasing preferences, queries the Internet for sales, and then feeds the information back to the passersby in the form of custom-generated ads. The three properties of HTML5 make it trivial to pass data and add new functionality to the application. In short, HTML5 provides first-class support for dynamic and contextual content.

Application portability

One of the holy grails of software development is Write Once, Run Anywhere (WORA), which is the ability to write one version of an application that can execute on many different devices. Think of the advantages of being able to download one application and have it execute on any device regardless of whether it is running , iOS, or Windows 8. HTML5 makes this possible.

The application in Listing 1 would function similarly on an Android device, iOS device, and desktop computer, as long as the underlying Web runtime supports HTML5. A Web runtime is the program stack that translates the HTML5 program into the application the user sees. WebKit is the Web runtime used to power the HTML5 experience on a number of Operating Systems (OSs) and browsers including iOS, Safari, Android, Chrome OS, and the Chrome browser. An interesting site that summarizes different browsers’ compatibility with HTML5 is http://html5test.com. Table 1 lists several browsers, their underlying Web runtime, and their HTML5 compatibility score. As can be inferred from the scores, browsers are still a ways off from conforming to the entire standard; over time this situation will improve.

21
Table 1: Scores from http://html5test.com indicate HTML5 compatibility.
(Click graphic to zoom by 1.9x)

Embedded scenarios around WORA are numerous. An embedded developer looking to migrate an application from one architecture to another would only need to focus on providing the same or compatible Web runtimes across platforms. The developer would have the flexibility to more easily adopt different architectures and OSs over a product’s lifetime.

Web runtime performance

In the past, Web runtime performance has limited the breadth of applications that would run well. Two developments are changing this: 1) the use of Just-In-Time (JIT) compilation techniques for JavaScript; and 2) JavaScript language extensions supporting processing.

JavaScript support, a core component of a Web runtime, is typically implemented using interpreters. Traditional languages such as C and C++ employ optimizing compilers that maximize a program’s performance potential. JIT compilation is a halfway point between interpretation and traditional compilation. A JIT compiler creates a representation of the user program in a lower-level language that is optimized and available for reuse as the program iterates over different sections of the application source. Table  summarizes how the introduction of JIT compilation helped improve the performance on two browsers’ SunSpider JavaScript benchmark.

22
Table 2: JIT compilation improved JavaScript performance in Firefox 3.1 and Internet Explorer 9.
(Click graphic to zoom by 1.9x)

Enhancements to the language in the form of API extensions can also improve JavaScript performance. Three noteworthy extensions are WebGL, Web Workers, and Parallel JavaScript.

WebGL

WebGL is a JavaScript API that accesses 3D graphics within the HTML5 canvas object. The HTML5 canvas is a pixel-based drawing surface enabling both 2D and 3D graphics. WebGL gives the developer access to OpenGL ES 2.0, leveraging the power of heterogeneous multicore through graphics accelerators.

Web Workers

HTML5 specifies Web Workers that introduce threads to Web applications and offer the ability to share work within one application. There are limitations with this approach in that the Web Worker does not have access to the Document Object Model (DOM), which is the internal representation of the Web page or application. Message passing enables communication between the main thread and a Web Worker.

Figure 2 shows a sample program employing Web Workers and comprising two files, main.js and task.js.

22
Figure 2: Web Worker sample code of main.js and task.js files.
(Click graphic to zoom by 1.9x)

Parallel JavaScript

Parallel JavaScript extends JavaScript with data-parallel constructs. The technology leverages OpenCL as a building block without exposing the user to its lower-level programming interface. Figure 3 shows two versions of code, one that executes serially and another that employs Parallel JavaScript to leverage multicore processing.

23
Figure 3: Sequential and Parallel JavaScript code
(Click graphic to zoom by 1.9x)

The need for multicore support in embedded applications has been documented for more traditional languages. It is apparent that when HTML5 is adopted for embedded applications, the demand for increased performance will exist as well.

The advent of embedded HTML5

The use of HTML5 in embedded is coming. For example, Mozilla’s Boot to Gecko OS targeting the automotive segment is programmed primarily via HTML5. However, embedded applications face some challenges in adopting HTML5. First, the ability to download text and execute it as a program is powerful, but is also a possible attack point for viruses and Trojan horses. Ensuring the security of HTML5 applications will be just as important as ensuring the security of today’s embedded applications. Second, API access to the embedded market’s unique array of devices and sensors will require some standardization work apart from mainstream HTML.

Challenges aside, HTML5’s qualities of dynamic and contextual content, increased performance, and portability across OSs will gradually lead to broad adoption across the range of embedded applications.

Max Domeika is a software technologist in the Developer Products Division at Intel.

Intel max.j.domeika@intel.com www.intel.com

Follow: Twitter Facebook Google+ LinkedIn YouTube

Topics covered in this article