我有一个应用程序，它采用了一个可滚动的jQuery轮播类型的显示。此显示包含属于用户的照片…每张照片都有相当数量的兄弟html内容(当你将鼠标悬停在照片上时显示的与照片有关的数据等)——所以这个标记加上图像标记都嵌套在一个css类"photo"的容器元素中。
更复杂的是，每张照片都是可拖动的，并且有几个其他的行为/事件监听器附加到它。
当我最初设计这个时，我担心这个旋转木马加载了太多的数据(就像想象一个用户有10000张照片)..我很快就想象到dom被太多元素超载，所有东西都是可拖动的，然后旋转死亡色球，然后崩溃。
我的解决方案是通过分页限制carousel的负载，并且只获取给定页面的资产…这意味着对于浏览照片.....的给定用户，将会有相当数量的xhr请求这也让我很担心。
所以我想知道社区怎么说…哪个更好?一个超载的王国?或者许多XHR请求?或者答案可能是两者之间的平衡?
的意见吗?
使用ajax，一次只加载x，直到用户进一步滚动到旋转木马，然后再加载x。
许多XHR请求是要走的路。IE尤其不喜欢杂乱的dom。它可以很好地处理静态显示，但如果你试图用jQuery来制作动画，你会得到非常不稳定的丑陋结果。
我会定义一些客户端模板，如http://api.jquery.com/jQuery.template/和传回JSON元数据为您的图片。这样你的网络流量就会降到最低。所以开始加载5-10个，然后每次缓冲10个。当你达到100左右时，删除旋转木马的开始部分。然后你可以根据它在IE中的表现来玩那些"神奇的数字"。9(其他浏览器应该没问题)。
就我个人而言，每当我处理这样的事情时，我都会看看我正在开发的浏览器。
如果是为客户端设计的，或者是你要卖给特定人群的东西，你可以"控制"你正式支持的环境，找出它是什么，并为浏览器做出最好的决定。例如，Internet Explorer (pre IE9)会因为大量AJAX请求而陷入困境，您可能会受益于在页面顶部屏蔽某种加载栏，同时用元素填充DOM。
然而，据我所知，Firefox没有任何AJAX限制，所以我总是支持分页/在那里进行多个AJAX调用。
作为我自己的经验法则，我想尝试让AJAX首先工作。如果可以的话，这通常是目前最有效/最简单的方法。
我倾向于两者的平衡。也许是这样的，在页面加载时，加载初始照片集并在初始集显示后在后台预加载下一组照片(JS或CSS方法，我不确定哪个更有效)，在分页时，预加载集进入视图，而您发出AJAX请求来检索和构建下一组照片。
这样，每次用户分页时，他们就不必等待服务器响应AJAX请求，但是也不会在DOM中得到10000张照片。