1

我有一个网页，负责将 500 多张图片传送到浏览器。大小在 50kb 和 80kb 之间变化。

正在使用的服务器是 nginx，并且还使用了一个清漆代理。

现在，我怎样才能使这个过程尽可能地高效？

我只有两个想法，所以想从这里有经验的人那里得到一些意见。

我唯一的想法是：

  1. 设置多个子域并从中批量提供服务。我相信最好使用的子域数是 12。

  2. 仅在用户向下滚动时需要时才使用 ajax 将批处理加载到浏览器。

我认为这里的选项 2 并不能真正解决问题。只是绕过它。所以我想专注于让这个过程尽可能地最有效和最快。

4

1 回答 1

1

您正在加载 1 个页面，其中包含 500*50kb ~ 25MB 的数据，这是一个完全疯狂的页面大小！

无论你做什么，与目前大约 1 MB 的平均页面大小相比，它总是会感觉很慢。在需要时通过 AJAX 动态加载大部分内容更有意义。或者，您可以将其拆分为多个板块。

如果您真的设置在一个巨大的非动态页面上，那么：

  • 确保您已将缓存标头设置为允许缓存（第一次加载时不会 hep）
  • 主要问题（除了整体大小）是您需要的资源非常多。有 3 种方法可以限制其后果：
    • 使用分片（即不同的子域）。这是可行的，因为浏览器最多只能为每个主机打开 4 个连接，因此通过使用多个域，您可以并行请求/加载更多资源。
    • 将您的图像放在一个精灵中（即一个大图像，并使用 css 显示您想要的位）
    • 设置您的服务器以使用 google 的 SPDY。这几乎消除了大量资源的问题。缺点是它仍然是实验性的（即您需要使用补丁重新编译 nginx）并且尚未得到所有浏览器的支持
于 2013-03-04T14:08:34.437 回答