本文将试着分析现代浏览器使用哪些技术来自动提升应用性能(有些你甚至不了解)，然后着重介绍浏览器网络层。最后，提供一些让浏览器提升网络应用程序性能的技巧。

概述

现代浏览器专门为快速，高效和安全数据传输的网络应用/网站而设计开发的。拥有数以百计的组件运行于各个不同的层级，从进程管理和安全沙箱到 GPU 管线，音频和视频及其它更多等等，网络浏览器更类似于一个操作系统而不仅仅只是一个软件。

浏览器的整体性能是由一些大型的组件所决定的，这些组件包括：解析，布局，样式计算，JavaScript 和 WebAssembly 执行，渲染，当然还有网络堆栈。

一般情况下，工程师们会把网络堆栈看成是一个性能瓶颈。经常会发生这样的情况因为从网络抓取所有的资源会堵塞渲染剩下的步骤。为了更加高效的网络层，它需要不仅仅只是扮演套接字管理员的角色。在我们看来获取资源是一个非常简单的机制，但是实际上它集成自身的优化准则，接口和服务的一整套平台。

网页开发者不需要担心单独的 TCP 或者 UDP 数据包，请求格式化，缓存以及其它正在发生的一切。浏览器会处理这些复杂的玩意，这样就可以专注开发自己的程序。但是，知道其内部的原理可以帮助开发者开发出更加高效和安全的程序。

本质上，当用户开始和浏览器发生交互所产生的情况如下：

• 用户在浏览器地址栏中输入 URL 地址。
• 在网络上查找指定 URL 的资源，浏览器开始检查本地和应用程序缓存并试着使用本地副本来响应资源的请求。
• 当缓存不可用，浏览器使用 URL 中的域名然后根据域名从 DNS 处获取服务器的 IP 地址。如果有域名缓存，将不需要进行 DNS 查询。
• 浏览器创建一个 HTTP 报文表明其请求远程服务器的某个网页。
• 报文被传输到 TCP 层，该层会在 HTTP 报文头部添加其自身的信息。该信息是保持创建的会话的必要信息。
• 然后在 IP 层处理报文，该层的主要职责即找出从用户发送报文到远程服务器的路径。在 HTTP 报文头部添加该路径信息。
• 传输报文到远程服务器。
• 一旦接收到报文，以类似的方式返回响应数据。

W3C Navigation Timing specification 提供了浏览器接口及浏览器中每个请求背后的可视化计时和性能数据。让我们浏览下这些组件，因为每个组件在获取最佳用户体验方面扮演了重要的角色。

整个网络请求过程是相当复杂的并且有许多的层次结构，每一层都有可能成为性能瓶颈。这就是为什么浏览器使用各种技术努力提升其性能，以便把整个网络通信的性能损耗降至最低。

套接字管理

看些新技术吧：

• 源－由应用程序协议，域名和端口号的三个部分组成(比如 https, www.example.com, 443)
• 套接字池－属于同源的一组套接字(所有的主流浏览器都限制套接字池最多只能有 6 个套接字)

JavaScript 和 WebAssembly 禁止开发者操作单独的网络套接字的生命周期，这样是相当的明智的。这样不仅仅可以让你头发少掉点而且可以让浏览器自动优化大量的性能，这些性能包括套接字重用，请求优化和延迟绑定，协议协商，强制连接限制及其它的优化措施。

实际上，现代浏览器更一步地将请求管理周期从套接字管理中剥离了出来。用套接字池来组织套接字，以源来分组套接字，每个套接字池强制限制其连接数和安全约束。排队，优先化等待的请求，然后和套接字池中的单个套接字绑定。如果不是服务器主动关闭这些连接，多个请求可以自动重用相同的套接字。

由于创建一个新的 TCP 连接会带来额外的性能开销，重用连接会为其自带来极大的性能提升。默认情况下，当发起请求的时候，浏览器使用所谓的 『keepalive』机制以节省创建到服务器的新连接所耗费的时间。创建一个新的 TCP 连接的平均时间为：

• 本地请求－23 毫秒
• Transcontinental 请求－120 毫秒
• Intercontinental 请求－225 毫秒

这样的架构衍生出了一些其它的优化方法。请求可以依据优先级来以不同的顺序执行。浏览器可以优化所有套接字间的带宽分配或者它可以创建套接字以等待预期的请求。

如上所述，这些都是浏览器所控制而不用开发者进行干预。但这并不意味着我们无所事事了。选择正确的数据传输所用的网络通信模式，类型和频率，正确的协议类型以及正确的服务器堆栈隧道/优化对于提升整个程序的性能有着至关重要的作用。

一些浏览器甚至更进一步。例如，当你使用 Chrome 的时候，当用户使用的时候它会进行自我学习从而变得更加快速。它基于访问过的网页和典型的浏览器模式来进行学习，这样就可以预期可能的用户行为且在用户进行任意操作之前进行操作。最简单的例子即当用户悬停在某个链接上的时候预渲染页面。如果你想学习更多关于 Chrome 优化技术的文章，可以查看 High-Performance Browser Networking 这本书的 www.igvita.com/posa/high-p… 章节。

网络安全和沙箱

允许浏览器操作单独的套接字有另一个非常重要的目的即：浏览器就可以针对不被信任的程序资源强制实施一套一致的安全和政策约束措施。例如，浏览器禁止通过 API 直接访问原始网络套接字，因为这样会导致任意可疑的程序随意连接任意主机。浏览器也强制连接数限制以保护服务器免受由于客户端访问而耗尽其资源。

浏览器格式化所有流出的请求以强制格式正确和一致的协议语义来保护服务器。同样地，浏览器会自动解码响应内容以保护用户免受可疑服务器的攻击。

一个简单但明了的用来展示浏览器的延迟会话状态管理的方便性的例子即：多个选项卡或者浏览器窗口可以共享一个认证会话，反之亦然；一个选项卡中的登出操作可以使所有其它打开窗口的会话失效。

应用程序接口和协议

了解了网络服务之后，最终要讲到应用程序接口和协议。众所周知，更底层的结构提供了一组广泛的重要服务：套接字和连接管理，请求和响应处理，各种安全策略，缓存及其它更多的强制措施。每当初始化一个 HTTP 请求或者 XMLHttpRequest，一个持久的服务推事件或者 WebSocket 会话抑或打开一个 WebRTC 连接，我们就是在和部分或者所有这些底层服务进行交互。

没有单一的最佳协议或者接口。每个复杂的程序都会基于不同的要求混合使用不同的传输协议：和浏览器缓存的交互，协议开销，消息延迟，可靠性，数据传输类型以及其它。一些协议拥有低数据传输延迟的特性(比如服务器推事件，WebSocket)，但是可能不符合其它重要的场合，比如利用浏览器缓存或者支持任意情况下的二进制数据传输的能力。

一些可以用来提升程序性能和安全的小技巧

• 一直在请求中使用 『Connection: Keep-Alive』头信息。浏览器默认在请求头中添加 『Connection: Keep-Alive』。保证服务器也使用同样的机制。
• 使用合适的 Cache-Control，Etag 和 Last-Modified 头信息以便节省浏览器的下载时间。
• 花些时间调整和优化服务器。这是奥秘所在！注意这一过程是否针对每个程序和所传输的数据。
• 一直使用 TLS!特别是如果程序中包含有任意类型的认证。
• 研究浏览器所提供的安全策略并且在程序中强制实施。