服务器端与客户端(AJAX)加载

时间:2011-01-28 20:26:33

标签: javascript jquery ajax javascriptmvc

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

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

加载的内容量是否重要?

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

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

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

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

3 个答案:

答案 0 :(得分:3)

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

如果您添加了正在使用的框架,则可能会获得更详细的答案。

答案 1 :(得分:1)

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

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

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

答案 2 :(得分:0)

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