Browsers have not been great at providing accurate text metrics and shaping to the JS layer. This has improved over the years, with actual bounding boxes, but access to actual glyph paths is still behind a scary prompt to the user.
In 2015, I explored how practical it was to ship subsetted fonts to the browser, and use FreeType/Harfbuzz/FriBidi through Emscripten to render text accurately. The result is the Shaping library, which can be used to render text with accurate metrics and shaping. It also provides bi-directional text support, which is a must for Arabic and Hebrew, and my particular needs at the time (bi-directional embeddings).
It uses FreeType to extract glyphs and font information, Harfbuzz for the shaping and complex layout, and FriBidi for bi-directional text support.
Demo
Change the input text below. It will be rendered in SVG (inspect element to grab the SVG path data if desired). For general debugging purposes, the logical and visual order of text is displayed (showing each unicode code point individually).
Noto Serif, Noto Naskh Arabic, and Noto Sans Hebrew are currently embedded. To replace or install fonts for certain scripts, upload a file:
Default:Arabic:
Hebrew: