图片预加载：多少太多？

所以我有我自己的网页here，这是一个可排序的缩略图页面。当加载第一个相关图像时，load()事件激活每个缩略图。由于我从页面上的隐藏div抓取<img>标签和文本内容，因此拇指激活可防止用户点击尚未卸载的图像，然后等待预载在后台进行。图片预加载：多少太多？

呼叫是很简单：

$('#content img:first-child').load(activateThumb).each(function(){ 
    if(this.complete || this.complete === undefined)this.load();});

的.each()卡子任何缓存的图像和手动触发事件load()。工作很好，是一个快速和精益的网站。现在，随着网站的不断发展，单个HTML文件中有超过100个<img>标签，我想知道是否有我接近的传统限制。我应该将页面分成35个不同的html文件吗？我是否应该丢失标签和光滑的预加载效果，以支持图像点播的服务器端请求？

作为一名优秀的程序员，你的直觉是什么？

来源

2010-08-31 Isaac Lubow

那么没有明确的限制。您可以继续按照您在网站上完成的方式进行尽可能多的图片。

但它只是让用户在等待所有图像“激活”时可能会感到沮丧。

因此，你可以做的是有分页&显示每页20个图像。这样你可以使图像加载速度更快。

在加载page1之后，如果用户仍然在page1中，则可以开始预取page2。因此，当用户点击page2时，他看到一个非常敏感的网站:)

这里没有任何规则。事实上，如果您现在看到Google图片有一天，他们就会像您所做的那样做一些事情。

来源

2010-08-31 04:38:19

那么我的推理是这样的：用户不需要等待每个图像被激活。积极的让他们知道哪些可以立即查看。当他们看着这些图片时，图像加载进行中......这是一个很棒的技术，但我只是担心如果页面变得太大会发生什么。 – 2010-08-31 05:24:42

什么都不会发生。它现在的样子很棒。前进。如果它后来变得太过于瓶颈。然后想想分页。但现在你的方法是完美的。 – 2010-09-01 10:04:05

-1

你可以像许多Web 2.0网站做到这一点：

在开始的时候，加载图像显示在页面的当前可见的部分。
然后在用户向下滚动页面时加载其他图像。

来源

2010-08-31 04:15:53 shamittomar

你看过我描述的页面吗？它不需要滚动，并且在开始时不显示任何预加载的图像。 – 2010-08-31 04:22:08

我点击你的链接，然后带到一个带滚动条的页面，我也立即被带到一个带有图像的页面。我不知道你为什么低估了他。 – Robert 2010-08-31 04:29:18

@Robert，这就是我的想法:) – shamittomar 2010-08-31 04:37:37

图片预加载：多少太多？

回答

相关问题