【问题标题】:javascript matrix script, inefficient/slow for some reasonjavascript矩阵脚本,由于某种原因效率低/慢
【发布时间】:2023-03-07 22:23:02
【问题描述】:

我已经编写了一个脚本以在 JavaScript 中实现“矩阵效果”(在后台使用)。我使用了 Canvas 元素,但由于某种原因它有点慢,但我不知道为什么。

矩阵效果:那些从上到下滚动的(绿色)文本行。

脚本: http://dominiquedebrabander.nl/matrix/matrix.js

我已经链接了脚本,因为它对这个文本区域很长。希望大家知道原因,或者给点建议。

你好,多米尼克

【问题讨论】:

标签: javascript performance canvas matrix


【解决方案1】:
  • 如果您只想用黑色填充它,为什么还要调用 clearRect?删除该呼叫
  • 如果字体从不改变,请不要一遍又一遍地设置,只需在开始时设置一次即可。
  • 绘制文字,见我的帖子here。考虑将每个字母绘制到第二个不可见的画布上,并使用 drawImage 将该画布的一部分绘制到您的真实画布上

如果您真的希望以现在的方式完成它,那么如果您将所有内容都绘制到一个大的屏幕外画布上并且您只是一遍又一遍地绘制该单个画布,那么您将不会这样做能够让字母以不同的速度落下。如果你这样做,它看起来更像矩阵,比如把 y 放在 += Math.random()*4.5 (左右)而不是 0.5

【讨论】:

  • 感谢您的快速回复,我不会轻视您的建议 ;)
  • thnx 快速回复,我不会轻视你的建议;)但是关于你对 clearRect 的建议,如果我不这样做,你会得到一些奇怪的效果,其中字母只是一遍又一遍地绘制,每给定数量的(y)像素。那我再看看其他方法。
  • 删除 clearRect 行,但不删除 fillRect 行。见这里:jsfiddle.net/Qs3Q2/6
  • 我注意到它现在有点快了,虽然不是很快,但是 thnx。 (我现在在 pc 上使用 FF5.0+firebug 进行 JSdebugging)。我现在正在寻找其他改进的可能性。我只是需要时间思考。 dominiquedebrabander.nl/matrix/matrix.js .. 我一修改就上传/更新脚本
猜你喜欢
  • 1970-01-01
  • 2020-10-02
  • 1970-01-01
  • 1970-01-01
  • 2012-08-19
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多