javascript - 为什么自定义字体会减慢我的程序速度?
问题描述
所以我在 p5.js 中制作了一个项目,旨在重现矩阵雨代码效果。在我决定加载自定义字体之前,它运行得非常顺利。当我这样做时,我的帧率大幅下降。我尝试加载的每种自定义字体都是这种情况(仅当我使用 loadFont 函数时;如果我使用 textFont 和一些默认字体,它似乎不会变慢)
当然,我在preload函数中使用了loadFont函数,在setup中使用了textFont,所以不知道这是不是已知的东西?我怎么能避免这种情况?
这是问题的最小可行示例:
var characters = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789$+-*/÷=%\"'#&_(),.;:?!\\|{}<>[]^~ "
var font;
var spacing_width = 10;
var spacing_height = 20;
function preload() {
font = loadFont('matrix_font.otf');
}
function setup() {
createCanvas(window.innerWidth, window.innerHeight);
frameRate(60);
background(0);
textFont(font);
fill(255)
}
var lastUpdate;
function draw()
{
background(0);
var timeSinceLastUpdate = new Date().getTime() - lastUpdate;
print(timeSinceLastUpdate + "ms") // prints time elapsed between each frame
lastUpdate = new Date().getTime();
for(var i = 0; i < 40; i++)
for(var j = 0; j < 40; j++)
text(characters[int(random(0, characters.length))], j * spacing_width, i * spacing_height)
}
此代码在 40-50ms 左右的控制台值中打印,但是当我注释掉 textFont(font); 行时 值约为 10-20 毫秒
我正在使用这种字体,但我尝试加载的每种字体都有问题
解决方案
有关此问题的讨论,请参见https://github.com/processing/p5.js/issues/3435
推荐阅读
- python - 带有 for-in 循环的列表的 n 个元素的总和
- reactjs - 包含通过使用 Redux 的渲染道具子项中的更改重新渲染的提供程序
- java - 在 Jbutton 单击时创建对象
- python - 在 python 中抓取和填充 JSON 时出错/使用 python debug pdb
- html - Google Apps 脚本:withSuccessHandler 在不运行 google.script.run.myFunction() 的情况下运行
- css - 子导航
- 为 100% 和下拉的位置变化
- mysql - systemctl 状态 mariadb.service
- java - 假设没有提交的更改,我如何获得项目的 git 版本?
- swift - MacOS:在 Swift 中为图像添加文本覆盖
- c# - 如何注册单数按键