服务器端与客户端（AJAX）加载

Question

我想知道什么是最佳做法。 假设我有一个下拉选择小部件。 如果在从服务器提供页面或加载页面时预先加载内容，是否应该发出AJAX请求以检索内容然后填充它？

我有点想把它加载为空并发出一个AJAX调用来检索内容。 但是这会导致页面加载时间变慢。 特别是如果页面有几个需要从服务器加载内容的小部件？

加载的内容量是否重要？

对于下拉示例，我的意思是下拉列表中的选项。 因此，如果我有一个下拉的员工可供选择，我指的是员工名单。 我是否加载一个空的下拉列表并在控制器的init上检索员工并填充下拉列表？

但后来我想到了一个数据网格，让我们说200行的员工和一些存储在数据库中的员工数据。 我是否加载页面并在页面加载时有一个控制器，其init函数检索员工的数据集并填充并显示数据网格？

或者，当从服务器提供页面时，它会在服务器端检索数据集，在数据集中它也会创建数据网格，然后加载它。 这是编程世界，我过去常常主要完成PHP，JSP和ASP的工作。 仅使用JavaScript进行一些很酷的页面效果等。

但我似乎喜欢一旦页面加载（或被加载）的想法，使AJAX请求检索填充当前屏幕上的小部件/内容所需的数据。 我只是担心页面的加载可能看起来很笨或慢，因为我现在正在向服务器发出更多请求来绘制页面。 对页面的初始请求，然后是填充小部件所需的每个数据集的请求。

Answer 1

我认为最好的答案是“这取决于你的框架”。 我见过Web框架可以通过两种方式处理这个问题。 我确实认为，特别是当大量数据被填充到DOM中时，从性能角度来看，最好在初始HTTP响应中加载尽可能多的页面，并且只能通过AJAX根据需要进行更新。 请注意，对于大型数据集，与通过JavaScript执行大量DOM操作的影响相比，额外HTTP请求的性能开销相对较小 - 在某些浏览器中，DOM操作可能非常慢。

如果添加您正在使用的框架，您可能会得到更详细的答案。

Answer 2

正如您自己指出的那样，使用AJAX加载所有内容会使页面变慢。 事实上，加速网页的最佳做法之一是减少http请求的数量。

话虽如此，在某些情况下，AJAX可以加快页面加载速度。 一个示例是文本框的自动完成。 如果在不使用AJAX的情况下实现这样的功能，则需要网页在第一次加载时加载每个可能的查询。 该页面将永远加载所有数据。 但是一旦页面加载，自动完成可能看起来比正常情况更多。

我的建议是从您能想到的最简单的解决方案开始，然后在需要的后续文章中添加AJAX，缓存和其他优化功能。

Answer 3

这取决于您显示的数据，如果您想从数据库快速更新ajax方法是好的。 但是如果您的数据是固定的（或者您不关心在加载页面后更新它），那么我不应该使用ajax方法，更多的工作（请求json，解析它，填充选择或其他）和你没有获得太多的好处。