FreeType Versus STBTT

bwip-js version 1.0 used the FreeType font engine, using emscripten to cross-compile to JavaScript. FreeType is an amazing piece of software, with built in auto-hinting and tons of special font rendering strategies. It is also a massive code base.

bwip-js version 2.0 uses [stb_truetype.h], manually translated into javascript. STBTT is equally amazing software. It is a single, ~4500 line file (a large majority being comments), yet it produces excellent letter forms, even at small sizes.

Here is a comparison at scale=2, which corresponds to a 20px/15pt effective font size:

The STBTT letter forms are slightly heavier stroked than FreeType's and a bit fuzzier, but both are highly legible. Considering the complexity of font rendering, that is a pretty respectable result for STBTT. Now lets look at compiled code size:

$ ls -l freetype.js stbtt.js
-rw-rw-r-x  1 bwip-js users 1394208 Sep 19  2016 freetype.js
-rw-rw-r--  1 bwip-js users   56483 Oct 16 14:51 stbtt.js

The above file size comparison is not totally fair. freetype.js contains the embedded OCR fonts, which add about 60K bytes, based on the encoding used by emscripten.

Run time memory usage is drastically different as well. Emscripten pre-allocates a 16MB block of memory (as an ArrayBuffer) that caused issues with using bwip-js on embedded servers, while the new STBTT-based code allocates on demand.