代码之家  ›  专栏  ›  技术社区  ›  pinxi

Sprite/PNG图形重站点,哦,我的天!

  •  1
  • pinxi  · 技术社区  · 17 年前

    我需要创建一个非常重图形的网站(在纹理图形上有透明阴影的撕碎的纸背景,等等)。我想节省文件大小的一种方法是将我所有的背景元素放到一个PNG中。问题是这个文件现在是180k。如果我把它分成不同的GIF和几个PNG,那么它将接近70k。

    这真的重要吗?现在的文件大小“太大”是什么?有人会注意到文件是180还是70k吗?

    5 回复  |  直到 17 年前
        1
  •  3
  •   Henrik Paul    17 年前

    我想说的是,这实际上取决于您的需求和约束。这需要你知道(并随后告诉我们,让我们更乐于助人)许多事情,然后才能接近正确。

    为了避免那些对非常有效的答案投令人讨厌的反对票,但却无法取悦某人,我的答案如下:

    180k除以标准ADSL调制解调器传输速率=180kB/100kB/s=1.8s=耐用。

        2
  •  1
  •   zombat    17 年前

    有什么原因吗 要使用较小的图像?听起来你已经把它分解了,为什么不使用更小更快的方法呢?

        3
  •  0
  •   Phoat Phoat    17 年前

    您必须比较请求所有单独图像所需的时间和下载一个大图像所需的时间。问题在于HTTP请求。

    我建议你用谷歌的Firefox扩展运行一些测试, Pagespeed 看看大png和单独的png之间是否有巨大的差异。

    我能想到的一个好处是,除了更少的HTTP请求外,您的站点将一次加载所有图形,而不是随着所有图形的下载而逐渐加载。然而,正如Henrik所说,底线是它取决于您的需求。

        4
  •  0
  •   devstuff    17 年前

    我相信您已经意识到,拆分为多个映像意味着需要与服务器建立额外的连接来检索它们,每个映像都有相关的延迟,请求和响应头的大小也会增加。

    由于浏览器限制到每个服务器的活动连接数(取决于浏览器版本),因此最终可能需要比检索单个图像更长的时间。解除限制的通常解决方法是使用单独的“映像”服务器,或映射到同一主机的DNS别名。

    除非你需要动画,我总是推荐PNG而不是GIF。

        5
  •  0
  •   Steve Johnstone    16 年前

    您拥有的图像越多,浏览器就越能并行处理请求。但是,如果你把它们分割得太多,那么不同的图像将在不同的时间加载,从而使网站的某些部分弹出。这有点折衷,但这就是编程的乐趣:)

    在图像可见之前,网站的外观越好,用户就越不会在意图像下载的速度。

    推荐文章