Closed shuding closed 2 years ago
Found https://github.com/fontsource/google-font-metadata where contains the metadata (unicode-ranges) of all Google Fonts. However the raw data is too large (14.6 MB, can be optimized to <300 kB?).
Also a way to load the data for individual font: https://unpkg.com/browse/@fontsource/noto-sans-jp@4.5.5/unicode.json (82.2 kB).
Goal
When rendering dynamic content, especially user input, it's possible that it contains some characters which are not included in the loaded fonts.
We want to solve this problem in both Node and Edge runtimes.
Proposal
To solve this, we can make use of Google Fonts'
?text
API:Make sure to request this API with
curl
so it won't return modern formats such as woff2. This gives us a small font file that we can use as the fallback to render the dynamic content.As for font choice, Google's Noto font family can be a good built-in fallback, which supports almost all languages in the world:
Implementation
satori
an async API (await satori(...)
) so it is able to load dynamic fonts (+Emojis). We can remove thegraphemeImages
option with a more user-friendly API (twemoji: true
).