如何使用 javascript 获得良好的帧率？
How to obtain good framerate using javascript?
我正在尝试使用像素操作将滤镜应用于 javascript 中的全高清视频。
我使用隐藏的画布、网络工作者和可转让对象创建了一个演示：
结果是使用 web workers 浏览器的选项卡在短时间内崩溃，视频的性能非常低（~5fps）。
如果不使用 select "Web workers: 0" ww，性能会更好（~15fps）并且选项卡不会崩溃。
我该怎么办？目标是获得良好的帧率（~30fps），避免使用 SVG 或 CSS 过滤器。
谢谢。
遍历所有像素并在 CPU 上转换它们不是一个好主意。这就是 GPU 的用途。在过去，这意味着您必须使用一些令人讨厌的东西，例如 Flash。
幸运的是，新技术不断涌现，大多数流行的浏览器都提供图形加速功能。它称为 WebGL，它允许您使用显卡来完成这些事情。
除非你想了解WebGL的所有内部秘密（它相当复杂），否则我建议你使用专为2D动画设计的PixiJS框架。
您可以在此处查看他们的过滤演示：http://www.goodboydigital.com/pixijs/examples/15/indexAll.html
这里有更多演示和示例：https://pixijs.github.io/examples/#/basics/basic.js
我正在尝试使用像素操作将滤镜应用于 javascript 中的全高清视频。
我使用隐藏的画布、网络工作者和可转让对象创建了一个演示：
结果是使用 web workers 浏览器的选项卡在短时间内崩溃，视频的性能非常低（~5fps）。
如果不使用 select "Web workers: 0" ww，性能会更好（~15fps）并且选项卡不会崩溃。
我该怎么办？目标是获得良好的帧率（~30fps），避免使用 SVG 或 CSS 过滤器。
谢谢。
遍历所有像素并在 CPU 上转换它们不是一个好主意。这就是 GPU 的用途。在过去，这意味着您必须使用一些令人讨厌的东西，例如 Flash。
幸运的是，新技术不断涌现，大多数流行的浏览器都提供图形加速功能。它称为 WebGL，它允许您使用显卡来完成这些事情。
除非你想了解WebGL的所有内部秘密（它相当复杂），否则我建议你使用专为2D动画设计的PixiJS框架。
您可以在此处查看他们的过滤演示：http://www.goodboydigital.com/pixijs/examples/15/indexAll.html
这里有更多演示和示例：https://pixijs.github.io/examples/#/basics/basic.js