Tip:
Highlight text to annotate it
X
Hi, my name is Henry Bridge and I am the Product Manager for Native Client. I am here today
to talk to you about our developer pre-release of the Native Client SDK. This video will
help you get familiar with the SDK and with developing web apps that take advantage of
native code. For those of you who are new to this technology,
Native Client is an open source project that allows you to run native code in a web browser.
This capability allows you to take the many useful existing libraries written in languages
like C or C++ and use them in your web app. For example, say you wanted to run photo filters
on your web gallery application. You could use existing libraries that allow users to
seamlessly perform smooth image manipulation on your photos without leaving your website,
and without installing other software. Web applications that use Native Client consist
of parts that are written in HTML, JavaScript and CSS, as well as parts that are written
in native code. The HTML, Java Script, and CSS parts are deployed as text files. For
the native code portions, you will need a compiler that produces Native Client binaries.
The Native Client SDK comes with a modified version of GCC that will compile C or C++
code to native code. Imagine you want to write a video editing
application for the web. You can write your UI and basic program logic (such as metadata
field editing and timeline controls) in HTML, JavaScript and CSS. But when it comes to implementing
the code to modify the video data, what is the right approach? You could implement the
video editing on the server but this approach would waste bandwidth and also feel slow.
On the other hand, you could try and implement the video editing code that would run on the
client in JavaScript but this would be difficult to implement and would also be slow. Native
Client allows you to get the best of both worlds: download the data once to the client,
and do the editing there. Periodically, the application can just push a changelog up to
the server for processing -- without impacting performance.
To get started, download our SDK from code.google.com/p/nativeclient-sdk. The getting started guide on this site will
walk you through installing the SDK so you can begin building applications. Once you
have setup your development environment properly, navigate your browser to the hello world example.
Then click the hello world button, and you will get a dialog that pops up that is already
made a round trip into native C++ code! Now, lets see how this works.
You can view source on the web page and see that the hello world HTML page loads the Native
Client module using an embed tag. On successful load, a global variable pointing to the Native
Client module is set. An onclick handler is then set for the hello world button, which
in turn calls the helloworld() function on the Native Client module.
Following this function call down into native code, observe that the Invoke() call determines
what method was called via a string compare. Since the helloworld() function was called,
it then calls InvokeHW(), which copies hello, world into the result buffer. The result is
then passed back to JavaScript when the function returns and is displayed as an alert dialog
in JavaScript. Now try modifying the hello world text that
is passed back. Recompile the Native Client module by opening
up a terminal cd-ing to the sdk/examples directory, and running make.
Reload the web page and the message will change when you click the hello world button.
While this simple hello world example is a long way from a compelling application, we
hope it is clear how Native Client makes it possible to weave high-performance native
C and C++ methods into a web application. To make the best use of the power of running
native code in a web application, Native Client includes APIs to expose useful functionality
beyond message passing between JavaScript and native code.
To handle resource management, Native Client provides a set of low level Linux-like APIs,
such as malloc and mmap that allow you to handle resource allocation in the sandboxed
system environment. In order to access browser resources like the network, or communicate
with the DOM, Native Client exposes NPAPI. Finally, to provide platform independent multimedia
interfaces such as 2D and 3D graphics, and Audio, Native Client modules can interface
with the NPAPI Pepper interfaces to OpenGL ES 2.0 and to a stereo audio system.
As an example of the kinds of compelling experiences you can create with these APIs, here is some
footage of a port we have done of Nexuiz, an open source modern Quake engine that we
ported to Native Client and to OpenGL ES 2.0. If you are attending Google IO, come to our
Beyond JavaScript talk for a deep dive on the SDK, or come meet the team at the Developer
Sandbox. For more resources visit our site at: code.google.com/p/nativeclient-sdk.