Big CSS Sprite图片（在低CPU电脑中运行缓慢）

Question

我的网站有一个很大的css sprite图片。

网站：http://www.protohaber.com/demo

雪碧图片：http://www.protohaber.com/demo/templates/v1/images/proto_sprite.png

我的网站是工程慢（例如，页面滚动速度慢，等等。）在某些计算机浏览器（低CPU的计算机）

Answer 1

我想主要原因是因为图像太大（几乎是1.5兆字节），所以想象一下，为了将背景从一侧移动到另一侧，CPU需要计算多少。我认为你的精灵有很多不属于它的资源（比如一些图像（女孩，小心警告等）），你也在同一个精灵中混合了很多颜色，这使得图像更大，因为更多色彩渲染。

我认为一个选项是掰开精灵成单独的一个，这将使文件更小(the slow processors can handle, render and move better small images)，除去像（女孩，慎用警报等）的图像，使它们的JPG文件，这将使文件还小。

精灵的想法是减少向服务器发出请求，但如果这种减少你应用程序的性能是让一对夫妇的要求，并具有为最终用户提供更好的性能最好的主意。

Answer 2

也许你应该尝试使用PNG Gauntlet来优化图像。

另一个解决方案可能是将Sprite分成两个甚至更多。