OSMD 1.5.0 was just released (see changelog) and is now 30-60% faster! How, you ask? The short answer: batch processing and WebGL.

How OSMD got a 30-60% speed boost

It all started with Github user paxbun‘s addition of WebGL and batch processing in pull request 1158. There were some reviews and additions by OSMD main developer sschmidTU, but basically we have to thank paxbun for contributing this huge performance improvement to OSMD!

WebGL creates shaders that are executed on the graphics card, which is famously faster than CPUs for this kind of parallel processing.

Take a look at this performance graph:

Microsoft Edge 99
Render time in milliseconds, lower is better. Medium size sheet.

Safari and Firefox: Faster without WebGL

Unfortunately, WebGL is currently only faster in Edge and Chrome, which are both based on the Chromium Engine.
Safari and Firefox seem to always be slower with WebGL, so we disable it there by default (check the EngravingRules DisableWebGLInSafariAndIOS and DisableWebGLInFirefox).

Still, batch processing also brings a ~30% performance improvement to Safari and Firefox!

Safari 15 4
Render time in Safari

Choosing the fastest method

In general, it appears that batch processing and especially WebGL are slightly slower for very small scores, but much faster for very large scores.
We can roughly sketch performance by increasing length of the sheet:

Render time depending on length of sheet using various methods. WebGL and batch are slower for very small scores, but much faster for large scores

Batch and especially WebGL appear to have a sort of startup cost, in the case of WebGL probably creating the WebGL context and shaders.

That’s why by default we currently only use batch processing for scores with at least 5 graphical measures, and WebGL with at least 80 graphical measures. (see EngravingRules SkyBottomLineBatchMinMeasures and SkyBottomLineWebGLMinMeasures)

Our default MusicXML sample “Beethoven – An die ferne Geliebte” takes around 400ms with WebGL and 350ms without,
but the very large sample “Actor – Prelude” with 759 graphical measures (33 measures x 23 staves) takes around 4000ms with plain, and only 2500ms with WebGL!

Of course, performance depends on systems and benchmarks, so we would appreciate if you contribute your own benchmarks and experience with the new OSMD performance! Join the OSMD 1.5.0 release discussion on Github.

Other improvements in OSMD 1.5.0

There were a few other improvements in this release, though let’s be honest, the performance boost steals the show!

You can now change the text of accidentals in chords, e.g. from “b” to “♭”.
Also, you can now disable time signatures for a measure with measure.ShowTimeSignature = false.
Other than that, there were various small fixes and improvements, see the 1.5.0 changelog.

The OSMD Audio Player (in early access)

Work on the official OSMD Audio Player is also progressing steadily. It is currently in early access for Github sponsors. Github sponsors make it possible for us to dedicate more time not only to the audio player, but also to main OSMD and other new features. So we would really appreciate if you could sponsor OSMD on Github to help make OSMD even better!

We added support for tempo changes in pieces (read from XML), while still allowing the developer to set a custom tempo. We also improved pedal display, added helper functions to start playback from a time in milliseconds, and made many other improvements. The performance improvement should be integrated into the player very quickly after this 1.5.0 release.

Future plans

We are still looking at migrating to Vexflow 4, which is currently work in progress on the branch feat/vexflow4. Unfortunately there are still a few problems with the new formatter. But we and especially the ever productive Rodrigo Vilarl from Vexflow are trying to work out the last few kinks.

Other than that, we are always working on new features and improvements, trying to prioritize the most critical issues for the most people. Keep an eye on updates!

Let’s stay in touch

Feel free to join our Discord channel, if you want to talk to us and other OSMD developers more directly, or showcase your projects.
You can also become a sponsor to get exclusive goodies and early releases to our builds like the audio player, or just try the OSMD demos.

And that’s it for this update, we hope you enjoy using OSMD!

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top