How to solve the lag when loading more Chinese fonts in threejs

I tried to use the 64kb English json file that comes with threejs, even loading a lot of fonts is very fast, because I need to load Chinese fonts, the font file I use exceeds 25Mb, and different fonts need to be loaded in a loop to the canvas, because you don’t know what the fonts in the data you get are so I can’t use the split method to split the fonts needed in the font source file. How to optimize this problem, thank you very much

Out of curiosity - what kind of font file takes up 25MB :eyes: ? Are you using a JSON font format, or just a usual TTF / OTF ?

I have multiple Chinese with full range of symbols and they rarely exceed 2-3MB.

1 Like

I am using a json file, because I have tried FontLoader to fail to compile the ttf format and woff format and will report an error. I downloaded a font file that contains all Chinese. Its json file does have 23mb, because the font I need is uncertain , so I can only import the json file of the entire Chinese font, not Chinese symbols but text at the same time


like this,19.7mb,I want to know how to optimize and not freeze when loading such a large file

Personally I’d focus on trying to figure out why tff file wasn’t working - since it should, FontLoader easily supports Chinese characters (example.) Using JSON fonts isn’t too practical, besides some trivial cases.

2 Likes

Thank you, your words reminded me, I will study more deeply

Thanks for the demo. Until now I’ve always used FontLoader directy – i.e. I preconverted the font file into JSON file. For larger sets I edited the JSON file manually to keep only wanted characters. The ttfLoader is pretty handy. Maybe it could be mentioned in the Three.js docs as both the pages about FontLoader and about TextGeometry suggest loading JSON files.

1 Like