Ordering the font array is how satori renders hanja instead of tofu boxes

The mechanism is worth stating precisely, because it changes what you go shopping for. Satori walks the string and, for each character, tries the faces in the array in the order you passed them ^[5]. Nothing in that loop cares what your font claims to cover. It cares whether the glyph is present. The author's framing is the useful one: this is the `unicode-range` trick from CSS `@font-face`, relocated from the stylesheet into a JavaScript array ^[7]. So a display face covering Hangul and Latin stays first, and a second face carries only the hanja ^[6].

The arithmetic on the loader is where the design earns its keep. Two faces at 2 MB each is 4 MB of file reads per image ^[21]. The comment in `og-fonts.ts` says the loader runs per request ^[8], which would put the 60 Pinterest pins at 240 MB of font reads with no cache ^[22]. That figure only transfers if those 60 renders land on one warm instance. The cache is a module-scope variable holding a promise, assigned with `cached ??=` ^[9], so it lives exactly as long as the module instance does, and every cold invocation pays the 4 MB again. If your deploy target discards module state between requests, the cache buys you nothing and the real fix is a subsetted font rather than memoisation.

Then there is bundling, which is the failure that does not reproduce locally. The path has to be a literal `path.join(process.cwd(), '...')` because Vercel's output file tracing follows the literal string when deciding what to ship with the function, and a dynamically built path leaves the file absent at runtime ^[11]. Static analysis can only see strings that exist at build time. A route that computes its font path will pass on your laptop, where the file is simply on disk, and 500 in production.

The last edge is Yoga. Satori's layout engine requires that a `div` with more than one child declare `display: 'flex'`, and if it does not you get a runtime error rather than a silent fallback ^[17]. This is documented, and the author still hit it three times, always on inner wrappers such as the little row holding element, stage and seated god ^[18]. The standing rule now is that every `div` in an image route gets `display: 'flex'` unless it has exactly one text child, and `span` is only ever for text ^[19]. A layout engine that throws instead of guessing is doing you a favour, though it does not feel like one on the third occasion.

What makes the font ordering the load-bearing decision rather than a nicety is what the card is for. A day pillar is two characters, and the author calls the hanja the payload ^[20]. Everything else on the image degrades gracefully. The second face is carrying the two glyphs the card exists to show, which is why coverage order deserved more attention here than any of satori's missing CSS features.