Packaged fonts show as system fonts on iOS but not Android

Discussed in https://github.com/Shopify/react-native-skia/discussions/2257

^{Originally posted by murattil February 27, 2024}
The fonts packaged as assets in my RN app (assets/fonts/[font].ttf) show up as system fonts on iOS when listed with listFontFamilies(), and I am able to use them in the Paragraph API directly without passing a custom font manager. On Android however, they don't show up, and a call to listFontFamilies() just lists a couple of basic Android fonts.

What is the reason for that discrepancy? Is there any way to make the bundled fonts show as system fonts as well, similar to the behaviour on iOS? I know you can create a custom font manager (useFonts), however, as I have >500 fonts that need to be loaded, doing require('...') on all of them takes a very long time, and sometimes crashes the app on lower-end Android devices. On iOS this is not an issue, as they are usable without loading them into a custom font manager.

There are two issues here:

1. On Android, packaged fonts must be loaded into a custom font manager instead of being usable immediately like on iOS, which means additional code and additional time in the render path before fonts become usable
2. When using require(...) with a resource, Metro packages that resource into the bundle. In the case of fonts that have also been packaged in the app using the assets directory, this means that the asset is now packaged twice, increasing total bundle size unnecessarily

Start by comparing Android and iOS behavior for listFontFamilies(), Paragraph API font lookup, and the useFonts path. Reproduce the case with fonts under assets/fonts/[font].ttf and inspect how require(...) packages those resources. Done means bundled fonts are discoverable on Android without loading every font into a custom manager and are not packaged twice.