Skip to content

Getting started

Alessandro Pignotti edited this page Dec 14, 2015 · 8 revisions

Cheerp generates JavaScript code, which should be integrated into an HTML page to be executed in a browser. The following trivial example should be ok to start.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Cheerp test</title>
    <script src="cheerp_output.js"></script>
  </head>
  <body>
  </body>
</html>

You can also run the generated JavaScript code directly using a command line JavaScript shell like node.js

Single step JS generation

/opt/cheerp/bin/clang++ -O3 -target cheerp <file1.cpp> <file2.cpp> -o <file.js>

Separate objects compilation and linking

/opt/cheerp/bin/clang++ -O3 -c -target cheerp <file1.cpp> -o <file1.bc>
/opt/cheerp/bin/clang++ -O3 -c -target cheerp <file2.cpp> -o <file2.bc>
/opt/cheerp/bin/clang++ -target cheerp <file1.bc> <file2.bc> -o <linkedfile.js>

Building libraries

Libraries are stored using LLVM binary representation

/opt/cheerp/bin/clang++ -O3 -c -target cheerp <file1.cpp> -o <file1.bc>
/opt/cheerp/bin/clang++ -O3 -c -target cheerp <file2.cpp> -o <file2.bc>
/opt/cheerp/bin/llvm-link <file1.bc> <file2.bc> ... -o <library.bc>

Using cmake

A cmake toolchain file is provided in /opt/cheerp/share/cmake/Modules/CheerpToolchain.cmake it's possible to cross-compile cmake projects for the Cheerp platform using the syntax

cmake -DCMAKE_TOOLCHAIN_FILE=/opt/cheerp/share/cmake/Modules/CheerpToolchain.cmake <regular arguments>

Please note that, currently, only building static libraries is supported.

Accessing Web/HTML5/DOM/Browser APIs

Global variables and types that are provided by the browser environment are accessible through the 'client' namespace

client::document.addEventListener(...)

Of course, being a regular C++ namespace you can reduce code verbosity by

using namespace client;

The relevant headers that defines client interfaces are

#include <cheerp/client.h> //Misc client side stuff
#include <cheerp/clientlib.h> //Complete DOM/HTML5 interface
#include <cheerp/webgl.h> //WebGL interface

By convention the method that will be called first on the client side should have the following signature

void webMain()

NOTE: As usual in JavaScript programming the script will be loaded before the DOM is completely loaded, and so webMain will be called on an incomplete document, to execute a callback after loading is complete you can do this

void loadCallback()
{
        ...
}

void webMain()
{
        document.addEventListener("DOMContentLoaded",Callback(loadCallback));
}

In a similar way you can bind to any other DOM event

Properties of DOM objects are always accessed through setters/getters

{
        auto body = document.get_body();
}

Small examples are included in /opt/cheerp/share/cheerp/examples/

Platform limitations

On the client side (JavaScript) the only actually supported numerical types are 'double' and 'int'. 'float' is supported but it actually has double precision. 16-bit and 8-bit integers support may be inefficient. 64-bit integers are supported using two 32-bit integers and may cause performance issues if used in critical performance paths.

Clone this wiki locally
You can’t perform that action at this time.