penpot/frontend/render_v2/cpp

Renderer

How this works?

First of all we need a proper environment to build Skia, this environment is heavily based on the Skia docker image but with some tweaks to support building a C++ WebAssembly module using Emscripten.

Building everything

From the root directory of frontend/renderer just run:

./build

This is going to build the docker image and run the container to build the artifacts and then copy them to the necessary directories.

😸 Be patient, the first time the docker image is built usually takes a few minutes.

Building the Skia build tools Docker image

To build just the Skia build tools image:

cd frontend/renderer
docker build . -t skia-build-tools

Building the renderer WebAssembly module

Just run the container and it will generate all the necessary artifacts in the out directory.

cd frontend/renderer
docker run -t -v ${PWD}:/tmp/renderer skia-build-tools

Once the renderer.js and renderer.wasm are created in the out directory we need to move them where Penpot can have access to them, so we need to execute ./scripts/copy-artifacts.

C++ <-> JS

To add some extra functionality to the exported Module by the Emscripten compiler, we use a series of javascript scripts that exist on the js directory.