What is alphaTab?
As of today alphaTab is not a drop-in component that provides all functionality out of the box. You should rather consider it as an SDK or Library to build components in the way you need it in your website. The needs to music sheets vary from application to application and website to website. You will need a certain development skillset to integrate alphaTab into solution.
On high level alphaTab can be structured into the following submodules:
- The data model
- The file importers
- The render engine
- The audio engine
All these 4 modules together make up alphaTab and allows you to provide modern and interactive music notation into your website or application.
The different flavours version of alphaTab are sharing the same source code. We take our TypeScript code and compile it to C# and other languages using a special toolchain. This way all platforms benefit from the same new features we add. For the future we plan to extend alphaTab to more platforms like Native Android and iOS.
alphaTab follows a "web first" approach and the related package is provided as NPM package. Most development and testing happens on this web version. alphaTab runs on all major and modern browsers supporting ES6. We do not maintain a full list of browsers as most of modern browsers are auto-updating anyhow.
ES6 compatible browsers
- Google Chrome 58+
- Microsoft Edge 79+
- Mozilla Firefox 54+
- Safari 10
- Opera 55
Main Web Technologies we use
- Typed Arrays (https://caniuse.com/typedarrays)
- HTML5 Canvas (https://caniuse.com/canvas)
- SVG (https://caniuse.com/svg)
- Web Workers (https://caniuse.com/webworkers)
- Web Audio API (https://caniuse.com/audio-api)
- Intersection Observer API (https://caniuse.com/mdn-api_intersectionobserver)
- Resize Observer API (https://caniuse.com/resizeobserver)
- TextEncoder/TextDecoder (https://caniuse.com/textencoder)
alphaTab brings everything you need to get it running in modern browsers, no 3rd party dependencies are needed.
Internet Explorer support was dropped in version 1.2. If you still need to support the Internet Explorer on your website (I hope you don't 😅) I recommend to use version 1.1 where we still had basic IE support. We also do not officially support test against the old Microsoft Edge before it was based on Chromium.
The data model
The data model which holds all information about a piece of music. This includes general information like song title and artist but goes down to individual note level. Everything alphaTab needs to render or play music sheets is stored in this data model.
The file importers
To fill the data model alphaTab uses so called
Importers. There exist various file formats in the market which can hold
the information about music sheets. alphaTab has importers for:
- Guitar Pro 3-5 files
.gp5which are a proprietary binary format from Arobas Music
- Guitar Pro 6 files
.gpxwhich are a proprietary archive format storing the music information as XML
- Guitar Pro 7 files
.gpwhich are a zip archive storing the music information as XML
- MusicXML files
.xmlwhich is an open XML based standard by an open consortium.
.capwhich is an open XML based standard by Capella Software.
- alphaTex which is a text based format optimized writing music notation in a textual format
There exist many dialects of MusicXML and due to its very nature of describing music sheets in a very visual way, only a limited subset of MusicXML is actually supported. If you encounter issues or missing features do not hesistate to contact us on Gitter or GitHub to add support for missing features.
The render engine
This engine is what makes the music sheet visible. alphaTab takes all the information stored in the data model and does a visual layouting and rendering which is called music engraving.
For this alphaTab builds up a visual tree represntation of all the symbols following the rules of music notation. Using this model alphaTab can very efficiently provide dynamic resizing and relayouting.
To bring the music to life, alphaTab comes with a MIDI synthesizer embedded. To play the music sheet, alphaTab will convert the data model into MIDI commands, which are then played by a MIDI synthesizer based on TinySoundFont.
We take the data model, convert it to MIDI, put this midi together with a SoundFont2 into the audio engine and violà, we have the song being played for human ears.
alphaTab can provides user interactivity and a visual cursor out of the box.