Verovio

Using Verovio for Neon.js

Neon's rendering and editing backbone is Verovio. Ultimately the fork used here tends to differ from the upstream version. Here are some tips for using Verovio in the context of developing for Neon.js:

Toolkit and EditorToolkit

There are two toolkit classes in Verovio, the toolkit (vrv::Toolkit) and the editor toolkit (vrv::EditorToolkit). The toolkit is the class closest to the frontend and is what is called by both main.cpp in the CLI and which is given Javascript bindings by emscripten. The editor toolkit adds the experimental editor actions that Neon relies on, and is accessed through the edit function of the regular toolkit (vrv::Toolkit::Edit). Editor actions are send to the editor toolkit through a JSON object.

Building for size

Verovio is big, especially when built in javascript. There are two things that can reliably minimize the Verovio package: change optimizations and remove features unused in Neon. This means cutting out unused fonts and not building extra loaders for non-MEI formats and replacing the -O3 optimization in emscripten with -Os. Or, instead of building with

./buildToolkit -H

you build with

sed -i '' "s/-O3/-Os/" buildToolkit
./buildToolkit -x "Gootville,Leipzig" -DHPX

This can get the size down to 3.9 MB from 6.0 MB.