我正在设计一个单页网站。网站的所有部分都以DIV元素的形式弹出，因此它永远不会离开实际的浏览器页面。最初我使用“display：none”隐藏了所有用css隐藏的部分，导航会相应地显示和隐藏它们。
现在我已经开始整理投资组合部分，我开始怀疑最好是为每个投资组合项目使用AJAX，因为它们包括更大的图像。对于预加载的合理限制，是否有任何粗略的指导？如果所有项目都已预加载，那么HTML文件看起来会非常糟糕。
我意识到这是一个普遍的问题，感觉就像预加载一切都是一个坏主意，但我不想采取预感。当元素设置为“display：none”时，我不太确定用户的计算机会占用哪种资源（例如，它是否是RAM问题？）。
干杯！ ：）
答案 0 :(得分：1)
正如@Digbyswift所提到的，拥有一个包含大量元素的大型HTML文件会增加页面大小，从而影响整体加载时间。
对于较旧的浏览器，页面上的元素数量具有更明显的效果，但您必须进入数千个元素范围的10个才能开始达到上限。
对于现代浏览器，你没有元素数量上限那么低，所以你应该没问题，但是如果你正在与元素进行大量的javascript交互，那么它会减慢功能客户，例如移动设备。
您正在处理的最大的权衡，在我看来，通过拥有一个更大的页面而不是一堆单独的调用，您实际上交易单个服务器响应的大小需要的较小响应数量。根据您的具体情况，可能是一项有益的整体交易，或者可能不是。
我会说你需要测试它所带来的差异，并根据它做出决定。影响这一点的一件事是在响应上使用压缩（又名.GZip或Deflate）。
另外，对于“投资组合”，你提到有很多大图像。就个人而言，我可能不在该部分的HTML中包含实际的<img />标记，以防止浏览器最初加载所有标记，而是根据需要加载中的图像< / em>通过使用javascript编写元素，因为这些图像需要显示。有许多技术可以做到这一点，任何你可以在周围添加更多智能时加载图像，但减少那些大型服务器调用将大大加快页面的速度。甚至有可能让一个大型HTML页面不会成为性能损失，并且可能会让它更快。
答案 1 :(得分：0)
将所有元素硬编码到HTML中的问题主要在于文件的大小，以及用户下载该HTML页面所需的时间。这取决于您的受众群体以及您希望他们如何访问该网页。例如，大型HTML页面不适合移动设备。
但是，您需要权衡所需的AJAX脚本是否比实际的硬编码HTML更大的文件大小。
答案 2 :(得分：0)
首先，现代浏览器上存在巨大的内存（例如Firefox，Chrome，IE等）。用户可以越来越轻松地设置它......
在移动浏览器中，它们限制在10MB左右。您可以在此处详细了解限制内存：http://www.yuiblog.com/blog/2010/06/28/mobile-browser-cache-limits/