Repository files navigation

ProvidingHarfBuzz shapinglibrary for client/server side JavaScript projects.

See the demohere.

1. Install emscripten
2. ./build.sh

Download from thereleases tab.

hb=require("hbjs.js")WebAssembly.instantiateStreaming(fetch("hb.wasm")).then(function(result){fetch('myfont.ttf').then(function(data){returndata.arrayBuffer();}).then(function(fontdata){varblob=hb.createBlob(fontdata);// Load the font data into something Harfbuzz can usevarface=hb.createFace(blob,0);// Select the first font in the file (there's normally only one!)varfont=hb.createFont(face);// Create a Harfbuzz font object from the facevarbuffer=hb.createBuffer();// Make a buffer to hold some textbuffer.addText('abc');// Fill it with some stuffbuffer.guessSegmentProperties();// Set script, language and directionhb.shape(font,buffer);// Shape the text, determining glyph IDs and positionsvaroutput=buffer.json();// Enumerate the glyphsvarxCursor=0;varyCursor=0;for(glyphofoutput){varglyphId=glyph.g;varxAdvance=glyph.ax;varxDisplacement=glyph.dx;varyDisplacement=glyph.dy;varsvgPath=font.glyphToPath(glyphId);// You need to supply this bitdrawAGlyph(svgPath,xCursor+xDisplacement,yDisplacement);xCursor+=xAdvance;}// Release memorybuffer.destroy();font.destroy();face.destroy();blob.destroy();})})

More examples:

1. npx pad.js
2. Openhttp://127.0.0.1/examples/hbjs.example.html orhttp://127.0.0.1/examples/nohbjs.html

1. (cd examples && node hbjs.example.node.js)

We provide a tiny wrapper (hbjs.js) around the main functionality of harfbuzz, but it's also easy to use other parts. (Seeexample/nohbjs.js as an example. However, you may need a custom build to expose additional functionality.)

Can be added withnpm i harfbuzzjs oryarn add harfbuzzjs, see the examples forhow to use it.

harfbuzzjs uses a stripped-down version of Harfbuzz generated by compiling Harfbuzz with-DHB_TINY. This may mean that some functions you need are not available. Look atsrc/hb-config.hh in the Harfbuzz source directory to see what has been removed. For example,HB_TINY definesHB_LEAN which (amongst other things) definesHB_NO_OT_GLYPH_NAMES. If, for example, you really need to get at the glyph names:

1. First, undefine the macro in question, by adding e.g.#undef HB_NO_OT_GLYPH_NAMES toconfig-override.h.
2. Next, export any function that you need by adding a line tohbjs.symbols; in this case_hb_ot_get_glyph_name.
3. Now the function will be exported through the WASM object, but you need to add Javascript to bridge to it - in this case, handling the memory allocation of thechar * parametername and marshalling it to a JavaScript string withheapu8.subarray. The best way to do this is to look athbjs.js for functions which use similar signatures.

If you have extended harfbuzzjs in ways that you think others will also benefit from, please raise a pull request. If there are parts of Harfbuzz that you need but the instructions above don't work, describe what you are trying to do in an issue.

Seeharfbuzz port inside emscriptenandemscripten-ports/HarfBuzz, basically all you need is to use-s USE_HARFBUZZ=1 in your build.

Optionally you can installbinaryen and usewasm-opt like:

wasm-opt -Oz hb.wasm -o hb.wasm

binaryen also provideswasm-dis which can be used for,

wasm-dis hb.wasm | grep exportwasm-dis hb.wasm | grep import

with that you can check if the built wasm file only exports things you need anddoesn't need to import anything, as usual with wasm files built here.