精灵与单个图像
好的 - 对于一个反复加载的网站来说,这是一个明显的问题。一个 sprite 表(可能会缓存在用户系统上)和一些奇特的 css 背景位置技巧,你就可以节省大量的服务器请求。
但对于网络应用程序来说,加载一次,就再也不会加载。精灵真的是一条出路吗?是的,将其分解为单独的 png 意味着需要预先提出更多请求,但从长远来看,这公平吗?
我猜这完全取决于渲染引擎和内存管理的工作方式,但从长远来看,在各处复制 200k 的精灵表可能会降低性能成本......
Ok - for a web SITE that loads over and over again this is an obvious question. One sprite sheet (that will probably be cached on the users system) and some fancy css background-position trickery, and you're saving yourself a ton of server requests.
But for a web APP, that loads once, and never again. Is a sprite really the way to go. Yes, breaking it up into individual pngs means that many more requests up front, but in the long run, how does this fair?
I'm guessing it depends entirely on the rendering engine and how the memory management works, but it seems like having a 200k sprite sheet duplicated all over the place might be more costly to performance in the long run...
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
通常,您将使用精灵来更改特定元素的状态,例如按钮,而不是同时更改所有图像。在这种情况下使用精灵的好处不仅是保存请求,而且还可以即时更改状态(例如鼠标悬停时)。
Normally you will use sprite for change states of particular element, e.g. for the button, not for all the images at once. Benefit of using sprites in that case is not just to save a request, but also to make state changes (say on mouse over) instant.