您何时需要更多/更少的http请求? - javascript

Improve this question

看来您的页面加载速度很快,您需要一系列小的http请求。

如果是一个大页面,则用户可能必须等待更长的时间才能看到该页面完全存在。

但是,我听说最小化HTTP请求更为有效。例如,这就是为什么要为多个图像创建精灵的原因。

是否有什么需要什么的通用指导原则?

参考方案

编辑2(25-08-2017)

这里的另一个更新;一段时间过去了,HTTP2是(正在成为)真实的事物。我建议阅读this page以获得更多信息。

来自第二个链接(在此编辑时):

预期HTTP / 2.0将:

显着且可衡量地改善了最终用户感知的延迟
大多数情况下,使用TCP通过HTTP / 1.1。解决“行首
HTTP中的“阻止”问题。

不需要与服务器建立多个连接即可启用并行性,
从而改善其对TCP的使用,尤其是在拥塞方面
控制。

利用现有文档保留HTTP / 1.1的语义
(请参见上文),包括(但不限于)HTTP方法,状态
代码,URI和标题字段(如果适用)。

明确定义HTTP / 2.0如何与HTTP / 1.x交互,尤其是在
中介(2-> 1和1-> 2)。

清楚地确定其任何新的可扩展性点和策略
适当使用。

粗体字(强调我的意思)解释了HTTP2如何处理与HTTP1不同的请求。 HTTP1将创建约8个(每个浏览器不同)同时(或“并行”)连接以获取尽可能多的资源,而HTTP2将重新使用相同的连接。这样可以减少创建新连接所需的总时间和网络延迟,从而加快资产交付速度。此外,您的网络服务器也将拥有更轻松的时间,使打开的连接减少大约8倍。想象一下那里的收获:)

HTTP2在主要浏览器caniuse has a table for it中也已经得到了广泛的支持:)

编辑(30-11-2015)

我最近在“页面速度”主题上找到了this article。这篇文章非常详尽,最糟糕的情况是有趣的读物,所以我绝对会试一试。

原版的

这个问题的答案太多了,但这是我的2美分。

如果您想建立一个网站,则在工具带中几乎不需要基本的东西,例如HTML,CSS,JS-甚至PHP / Rails / Django(或10000+其他Web框架之一)和MySQL。

前端部分基本上是将每个请求发送给客户端的所有内容。服务器端语言计算需要发送的内容以及网站的构建方式。

现在,在管理资产(图像,CSS,JS)时,您将进入HTTP领域,因为您希望尽可能少地执行请求。原因是存在DNS penalty。

但是,此DNS罚款并不能决定您的整个网站。这一切都是为了建立网站的程序员在请求量和可读性/可维护性之间取得平衡。

诸如rails之类的某些框架允许您在将应用程序部署到服务器上之前将所有JS和CSS文件组合成一个大型的类似JS和CSS的文件。这样可以确保(除非另有处理),例如,网站中使用的所有JS和所有CSS均按每个文件的一个请求发送。

想象一下,有一个弹出脚本和通过AJAX获取文章的东西。这将是两个不同的脚本,并且在部署时不将它们组合在一起-包括弹出窗口和文章脚本的每个页面加载将发送两个请求,每个文件分别一个。

之所以如此,是因为浏览器会尽可能地缓存所有可能的内容,因为最终,浏览器和构建网站的人都希望拥有同样的东西。为我们的用户提供最佳体验!
这意味着在第一个请求期间,您的网站将对客户的答复将尽可能多地缓存,以使将来连续的页面加载更快。

这有点像帮助网站变得更快的浏览器方式。
现在,当才华横溢的浏览器学家想到某件事时,确保它对浏览器有效或多或少是我们的工作。通常,这类具有缓存等功能的东西都是微不足道的,并且不难实现(为此感谢上帝)。

在页面加载中包含大量HTTP请求并不是世界末日的事情,因为它只会减慢您的第一个请求的速度,但是总体而言,请求数量减少会使这种“ DNS惩罚”的事情出现的频率降低,并且您的用户更多是即时页面加载。

除了文件合并之外,还有其他一些技巧可以使您受益,包括JavaScript时,可以将其选择为async or defer

对于异步,这意味着脚本将在每次加载时在后台加载并执行,而不管HTML中包含顺序如何。这还将暂停HTML解析器以直接执行脚本。

为了推迟,这有点不同。有点像异步,但是只有在HTML解析器完成之后,文件才会以正确的顺序执行。

例如,您不希望“异步”的东西是jQuery,它是许多网站的密钥库,并且您想在其他脚本中使用它,因此使用异步方法并不确定何时下载并执行它不是一个好计划。

例如,您希望“异步”的某事是Google Analytics(分析)脚本,对于最终用户而言,它实际上是可选的,因此应标记为不重要-不管您是否在乎网站的统计信息你,但你:)

为了回到请求并将所有关于异步和延迟的讨论融合在一起,例如,您可以在页面上使用多个JS,而不必暂停HTML解析器来执行某些JS-相反,您可以延迟此脚本,然后很好,因为在JS解析器等待HTML解析器的同时,将加载用户的HTML和CSS。

这不是减少HTTP请求的示例,而是如果您拥有的“一个文件”除了单独的请求之外并不真正属于任何地方,它是替代解决方案的示例。

您也永远无法建立一个完美的网站,http://github.com或http://stackoverflow.com也不会,但没关系,它们的速度足以让我们的眼睛看不到任何疯狂的闪烁内容,而这些东西对于结束而言确实很重要用户。

如果您对正常的请求数量感到好奇-不要。每个网站和网站的目的都不同,我同意有时某些事情确实会流行,但这是事实,我们要做的就是支持浏览器,就像它们在支持我们一样-甚至是在IE / Edge上因为它们也在改善(无论如何缓慢但稳定)。

我希望我的故事对您有意义,我确实在发帖之前重新阅读过,但在搜寻不规则的打字或其他不合逻辑的内容时找不到任何东西。

祝好运!

Javascript-Python:将动态生成的图像提供给客户端浏览器? - php

场景:用户加载页面,正在生成图像,显示加载栏,通知事件已发送到浏览器。我正在使用python代码生成图像。拥有启动脚本或将Web服务器代码嵌入python脚本的Web服务器是否理想?图像完成渲染后,客户端应收到一条消息,说明图像成功并显示图像。如何设计它以同时支持并发用户?是否只需为每个导航到该网页的新用户启动python脚本就足够了?在这种情况下拥有实时W…

PHP Javascript更改浏览器后退按钮行为Laravel - javascript

我知道有各种各样的线程要求几乎相同的要求,但似乎没有一个真正满足我的需求。在我的网站上,我实现了搜索表单。一个简单的表单,其中包含一个名为searchQuery的输入字段和一个提交按钮。表单通过POST方法发送。我正在使用Laravel btw。。然后将搜索结果从控制器加载到视图中。这些在表中显示。现在来了有趣的部分:找到的元素是可单击的,并且您进入有关该元…

Javascript-从当前网址中删除查询字符串 - javascript

单击提交按钮后,我需要从网址中删除查询字符串值。我可以用jQuery做到这一点吗?当前网址:siteUrl/page.php?key=value 页面提交后:siteUrl/page.php 实际上,我已经从另一个带有查询字符串的页面着陆到当前页面。我需要在页面首次加载时查询字符串值以预填充一些详细信息。但是,一旦我提交了表格,我就需要删除查询字符串值。我已…

javascript popupwindow之后的行如何工作? - javascript

好的,我有一个来自后面代码的方法,可以创建一个popupwindow。然后有一行代码要在那之后执行,我想知道那行代码何时执行,是在使用popupwindow之后执行还是在创建popupwindow之后执行?例如:void exPopupWindowMethod() { string scr = "window.open('exampleP…

在php,ajax或javascript中加载进度? - php

任何人都知道当系统仍在服务器端获取数据时,如何在客户端显示加载完成百分比的进度。例如,当我在客户端按“确定”按钮时,它将调用服务器端从数据库中收集数据,整个过程可能需要2到3分钟。我如何在客户端显示加载进度(大约完成了多少百分比的加载)?如何在php,ajax或javascript中做到这一点? 参考方案 单击“确定”按钮后,就可以开始在服务器端获取数据并保…