App developer @

Developer of

and

@florianrival

github.com/4ian

Desktop, C++ powered app

Full JS app running

in browsers

• Compiles your C or C++ code using LLVM+Clang

$ emcc main.cpp -o output.js

• The intermediate representation (~assembly like) is then converted to asm.js (a subset of JS) instead of machine code

• Functions or classes are exposed using bindings.

• The generated code is working on a single, (very) large array representing the C++ program memory.

var HEAP = [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0

Base classes (Project, scene, objects...)

Backend (Node.js + Express)

GUI & dialogs

libGD.js

Webapp (Angular.js/Pixi.js/React)

Filesystem

Game to code generation

Extensions 

(new objects...)

class Project : public ClassWithObjects {
public:
    void setName(const std::string & name_) { name = name_; };
    const std::string & getName() { return name; };

    // ...
}

$ path/to/emscripten/tools/webidl_binder.py Bindings.idl .
$ emcc main.cpp glue.cpp -o output.js --post-js glue.js

interface Project {
    void SetName([Const] DOMString name);
    [Const, Ref] DOMString GetName();
}

a few apis/libs are provided by emscripten

exclude or abstract the rest

• Program output is piped to the console
• In-memory file system.
• A few more advanced libraries are available, like OpenGL (mapped to WebGL).

const project = new gd.Project();
project.setName("My new game");

console.log(project.getName());
// "My new game"

everything exposed is in module.*

classes are instanciated like usual js objects

//I wrapped Module into gd
gd.Project; //A C++ class
gd.sayHello("world"); //A function taking an argument

const obj = new gd.Parent();
const obj2 = new gd.Child();

obj.f();
obj2.f(); // Works
gd.expectAParent(obj2); //Works

types are converted TRANSPARENTLY

inheritance works as expected

//bool myFunction(gd::Project & p, std::string str, double d); 
const str = "A JS string";
const p = new gd.Project();
gd.myFunction(p, str, 3); //

app.post('/my-express-route', (req, res) => {
    const project = new gd.Project();
    project.setName("MyNewProject");

    // Do something useful...

    project.delete(); // Release Emscripten object
});

objects created must be deleted

memory size is finite

class MyClass {
    bool makeAllTheThings();
}

//Binding:
interface MyClass {
   void makeAllTheThings(); //Oops
}; 

expect(obj.makeAllTheThings()).to.equal(true);

app.use((req, res, next) => {
    if (req.originalUrl === "/libGD.js") {
        req.url = "/libGD.js.gz"; // Silently switch to the .gz file
        res.setHeader('Content-Encoding', 'gzip');
        res.setHeader('Content-Type', 'application/javascript');
    }
    next();
});

https://github.com/4ian/GDevelop.js

need an example of a real codebase?

Unity, emulators...

Physics engines, image processing...