jmq*_*jmq 5 javascript canvas sprite html5-canvas fabricjs
我打算有一个FabricJS画布,可以显示潜在的几十个不同的图形,可以作为单独的图像文件或精灵提供.对于每个图形,特定图形可能会在画布上显示0到数十次.我知道FabricJS具有裁剪能力,这可以使精灵的使用成为可能,而且我知道,一般来说,网络上的精灵比单个图像更受欢迎,例如CSS.
但是,我也听说过围绕画布的浏览器行为/怪癖,你可能会发生一些优化,不要 - 我现在找不到链接,但我记得有一个大帆布尽管不与屏幕外观相关,但Chrome中的内容元素仍然需要相当长的时间来计算/"渲染".
那么,是否有任何已知的期望是否n个单独的非裁剪图像对于FabricJS画布被剪裁n次的精灵是否优选/不优选？如果它很重要,这将不是一个动画严重的FabricJS画布; 例如,在拖动时,事物可能会移动,但在这种情况下,常量动画不是所涉及的.
只需亲自进行测试，找出导致电脑速度变慢的原因。这取决于PC、浏览器和显卡。
我对 Fabric.js 一无所知，但计算机 CPU 和显卡可以轻松处理剪切/图形操作。您不会像 3D 游戏那样显示数百万个多边形，所以应该没问题。
这是一个网站，解释了 CSS 精灵与单个图像网络性能的提高： https://medium.com/parlay-engineering/emoji-at-scale-render-performance-of-css-sprites-vs-individual-images-f0a0a2dd8039