我的情况是我不确定前进的最佳方式。
我有一个图库和一个选项，可以通过页面查看或查看页面上的所有内容。
问题涉及一页查看它们。可以有很多图像。 1000+。
现在我立即想到使用延迟加载jquery插件或使用ajax检索新图像并在滚动时插入它们。 （我的想法是ajax更好，因为使用延迟加载插件意味着它仍然会有1000多个DOM元素，它必须跟踪和操作等？）无论如何，问题与它们没有直接关系。
如果只是那样的话我就会实现ajax方法。
问题在于我在页面上有2个功能。
用于随机播放页面上所有图像的按钮。因此，如果有大量图像，您可以单击该按钮，然后将显示屏随机播放。
一个滑块，可在3种设定尺寸之间切换，以便将它们视为小型中型或大型（大型是默认视图，当缩放完成后，它会替换适合新尺寸的预制图像的图像src）。
问题是，如果我使用Ajax我不知道如何处理shuffle，因为shuffle将重新安排当前在DOM中的图像（这是它现在的工作方式，只是重新排列顺序html。
第二个问题在于滑块.....但是我想我可以设置它，这样当它们在侧面减少时它将检测到页面上是否还有空间，如果是这样，ajax调用下一部分填补空白...
另外我使用延迟加载方法的测试是，当洗牌时，如果页面上有太多图像，页面会在尝试洗牌1000多张图像时锁定几秒钟。 （延迟加载有其他问题，例如当新的混洗项目进入视图时图像未加载，并且当使用滑块时，新图像进入视图，它们未加载...但这是一个问题或与延迟加载本身有关的设置）
也许我错过了一些东西，或者有一种替代方案我不知道。
所以问题确实是。
最好的方式/最有效的方法是不使浏览器窒息，处理大量图像，保持功能上能够随机播放和改变图像的比例。
答案 0 :(得分：1)
免责声明：我当然知道我所说的所有内容都是高度争议或不完整的，可能受我自己的背景影响，但我只是想给你一些非常广泛的问题。< / em>的
即使你需要实现这些功能，我也不会丢弃ajax解决方案。
如果用户按下随机播放按钮，您可能只显示一个加载程序并通过ajax向json询问服务器端洗牌的完整图像列表，例如
{
"images" : [
321,94,566,302,729,136...
]
}
然后，当收到json时，使用数组的第一个 n 元素块来预先加载并在文档上插入 n 图像。
<img src="/high-res/321.jpg" />
<img src="/high-res/94.jpg" />
<img src="/high-res/566.jpg" />
...
关于滑块：
... large是默认视图
在这个特定场景中，您不需要同时加载相同资源的中等版本和低分辨率版本：只需缩放高分辨率图像（通过css，transform: scale(...)）。 / p>
这种方法的真正问题在于你要惩罚移动设备，所以如果你需要支持它们，我的方法可能是先前检查小视口，并且 - 在移动设备上 - 我总是发送低 - 分辨率图像，没有缩放的可能性（将其视为优雅降级或您的应用程序）。
当用户滚动时，您将开始阅读下一个数组元素块（当您改组元素时已有）并使用新图像创建DOM结构。可以根据您当前使用的分辨率调整块的大小：
e.g。对于高分辨率图像，使用一小组图像进行预加载。在移动设备上，我可以一次预加载更多元素，但在这种情况下我不会使用滚动事件：我更愿意显示“加载更多”按钮