影响web应用界面加载时间的因素

网络带宽已经越来越大，已经不再是会影响网络应用性能的带宽大小。带宽就好比一条马路的宽度，越宽同时能过的车辆就越多，但是就算马路宽了也有可能堵车。现在一个网页基本包括了htmldom、cssdom、JavaScript、ajax请求、图片。JavaScript可能会阻塞dom的解析和构建影响css处理，图片也会影响界面加载时间。而界面加载时间是衡量web性能的标准。

在250ms内渲染界面或者提供视觉反馈才能保证用户不离开。但是每一个http请求都可能包括DNS解析、TCP握手、TLS协商、发送http请求、下载内容，光网络上的延迟就可能在100ms~1000ms之间。

所以除开服务器响应时间和网络延迟在网络没有阻塞的情况下，我们还需要从减少界面加载时间来优化，减少客户端到服务器之间的往返次数、优化JavaScript执行和渲染管道。（浏览器已经做了资源预取和排定优先次序、DNS预解析、TCP预连接、界面预渲染这几个优化）

• 减少客户端到服务器之间的往返次数：尽可能地减少接口的请求。
• 优化JavaScript执行和渲染管道：将引入的js放至body底部，因为js会阻塞界面dom的渲染，js加载完了之后css才会生效。$()jQuery不用等待图片加载完执行js，window.onload会在所有文档包括图片加载后执行。
• 压缩图片资源：大图尽量不用base64、控制在500kb以内。
• 压缩js、css。
• 异步请求数据。