photopea / Typr.js

Typr.js - process fonts in Javascript
MIT License
917 stars 73 forks source link

Issue with Typr.js Font Loading - Browser Crash #55

Open Augus opened 1 day ago

Augus commented 1 day ago

Hi, I wanted to bring to your attention an issue we've encountered with Typr.js when loading certain fonts. Specifically, we've noticed that loading fonts from the following repository causes browser crashes: https://github.com/ButTaiwan/genseki-font/tree/master/ttc.

Could you please take a look into this matter and possibly investigate the underlying cause of these crashes? It would be greatly appreciated if you could provide us with some insights or updates at your earliest convenience.

photopea commented 1 day ago

Hi, could you provide precise steps, what should I do to make a browser crash? Does it crash in all existing browsers or just in one browser? It might take me ages to see the problem, trying various fonts and various browsers. Or maybe it happens to you on iOS, but you are not saying it?

Augus commented 11 hours ago

@photopea During the tests, I used the code snippet below to load fonts, and parse() it:

function loadFont (url, resp) {
    var request = new XMLHttpRequest();
    request.open("GET", url, true);
    request.responseType = "arraybuffer";
    request.onload = function(e) { resp(e.target.response); };
    request.send();
}

loadFont("https://github.com/ButTaiwan/genseki-font/raw/refs/heads/master/ttc/GenSekiGothic2-B.ttc", function (response) {
    console.log(Typr.parse(response));
});

This particular code causes an Uncaught RangeError: Invalid array length error. The problem seems to originate from the readUshorts() function as shown below:

readUshorts : function(buff, p, len)
    {
        console.log(len)
        var arr = [];
        for(var i=0; i<len; i++) {
            var v = Typr["B"].readUshort(buff, p+i*2);
            arr.push(v);  // <<<<< this line
        }
        return arr;
    },

I noticed that the array length becomes unexpectedly large, leading to a significant increase in browser memory usage and occasionally causing the browser tab to crash. The issues are particularly prevalent with fonts from this repository: GenSeki Gothic Fonts.

Could you look into this matter and suggest a possible fix, or update on how to handle such cases? Any guidance would be greatly appreciated as it will help prevent potential disruptions for users dealing with similar font files.

photopea commented 6 hours ago

Which version of Typr.js do you use? Do you use the latest one from this Github account?