Fonts were the heaviest thing on our pages, heavier than the JavaScript. A good Arabic family carries a great deal: every letter in up to four joined forms, marks, ligatures, and a set of stylistic alternates and swashes for designers who want them. A visitor on a slow mobile connection downloads all of it before the headline appears in the right typeface.
Most of those alternates are never used on a website. A browser applies the features Arabic needs on its own, joining, required ligatures, mark positioning, kerning, and leaves the decorative ones off unless the stylesheet asks for them. Removing the unused ones, and the glyphs only they reach, is ordinary font subsetting. On our two main files it saved 20% and 16%, with every character still present.
The hard part is trust. Arabic shaping is a chain of lookups, and if a subsetting step removes the wrong one, letters stop joining or a mark drifts off its letter. That is easy to miss by eye, in a language the reviewer may not read, on a page nobody checks after launch.
So we made the check mechanical. Every string the site renders, Arabic and English, is run through HarfBuzz, the same shaping engine Chrome, Firefox and Android use, twice: once with the original font and once with the subset. The glyphs, their widths and their positions must match exactly. If a single string differs, the original file is kept and the run fails. On our site that is about 1,800 strings.
We have published the tool under the MIT licence at github.com/Revaluar/arabic-webfont-subset. It works on any font, not only Arabic, and it reads the strings straight from your source files. Two cautions before you use it: the check is only as good as the text you give it, so add samples of anything your site generates at runtime; and check your font's licence, because some licences do not allow subsetting.