javascript - 对于标题背景，Javascript 渲染是否比直接图像更快？

Question

我有一个 10 像素高的标题和浏览器窗口的宽度。它具有条纹图案，可在 x 轴上重复。

目前我正在使用Patternizer使用 Javascript 和一些基本的条带规则来填充标题。

但是，在渲染之前访问过该站点的浏览器会比使用已经存储在缓存中的 CSS 在 x 轴上重复渲染 20KB 图像更快吗？

作为参考，我说的是Markpond上的标题。

Answer 1

老实说，对于 10px 的 Header-image，重复的 background-image 就可以了（除非您想要动态模式或计划对其进行大量更改）。由于 Patternizr 使用画布元素，它在某些浏览器上会“更慢”（计算），而在移动设备上肯定会“更慢”（计算）。旧 IE 版本也存在兼容性问题，但我不确定细节。

但我们在这里谈论的是微优化。不会有任何大的区别，我不确定你为什么还要问这个问题。

我建议：现在对您的页面进行截图，加载图像并启动 patternizr。