Browsers are very smart. https://css-tricks.com/css-basics-fallback-font-stacks-robust-web-typography/ They can find out themselves which characters can't be rendered by the actual font, and render the characters with a fallback.

Unfortunately, we don't have that smartness in pure JS or frameworks like React Native: https://github.com/facebook/react-native/issues/32396

So I have to build this behavior myself for my react native app.

How can I check in pure javascript if a font is unable to render a specific character (if it's e.g: Kanji), so that I can render that specific character myself with a fallback font?

(I can find out which font the character needs with unicode, but I don't want to do that on every text render because it would consume resources (is that right? or is it OK to do that? imagine a text has 500 characters, that would be 500 function calls)). anyway I think it's a better approach (is that right) to do that unicode stuff only onError

So, how can find out in pure javascript if some characters can't get rendered by the font? I basically want to be notified onError, the payload should be the position of the characters within the string.

I know I could find that out if I regex check the supported unicode by my font against the unicode of the text, but that would again consume resources. I want to just render the text in React Native, and then onError catch the errors and render the not working characters with a different working fallback font.

thanks in advance!!