【加载静态资源很慢】解决浏览器加载静态资源阻塞

开门见山讲方法:

增加浏览器的最大并发连接数, 避免静态资源的加载请求排队而被其他请求阻塞。

仅测试火狐浏览器可用, Chrome据我所知不支持此项配置, IE浏览器需要通过修改组策略, 未测试。

正文:

存在问题

今天调试网页时, 网页加载缓慢, 一方面主要是后端代码和网络等问题, 导致静态资源解析和响应速度慢,
另一方面在调试的时候发现一个情况: 就是很多的静态资源请求都被阻塞。前面的请求没有完成, 后面的请求就不会发起。而静态资源的请求是没必要等待其他请求完成后发起的。

于是我百度了原因, 并在浏览器层面找到一个临时的解决办法, 即增加浏览器的连接数, 不过仅限于调试用。

原因分析

据了解: 浏览器的并发连接数受到限制, 并不是无限发起异步请求的。 每款浏览器都有自己的默认并发连接数，而且浏览器默认对同一域下的资源，只保持一定的连接数，会阻塞过多的连接，这都会影响到浏览器对网页的加载速度。查考文章:https://www.jianshu.com/p/dc583d5424e3

版本	HTTP 1.0 服务器（宽带连接）	HTTP 1.1 服务器（宽带连接）	HTTP 1.0 服务器（拨号连接）	HTTP 1.1 服务器（拨号连接）
Internet Explorer 7 和早期版本	4	2	4	2
Internet Explorer 8	6	6	4	2
Internet Explorer 9	10	10	?	?
Internet Explorer 10	6	6	?	?
Internet Explorer 11	6	6	?	?
chrome、firefox	6	6	?	?

解决方法

所以我们调大这个连接数, 就可以减少静态资源被阻塞的情况。

火狐浏览器的修改方式: 浏览器地址栏输入about:config

搜索connections, 修改以下两项配置:

# 每个服务器的最大连接数
network.http.max-persistent-connections-per-server
# 每个代理的最大连接数
network.http.max-persistent-connections-per-proxy

具体调整的连接数和速度提升情况, 就要视你的具体环境而定了。浏览器限制连接数也是有原因的, 连接数并不是越大越好。在请求阻塞时间很短时, 增大并发连接数会增加每个请求域名解析的时间, 会增大后端服务器的压力, 而且后端服务器一般会限制来自同一用户的过多请求。

使用场景

我的场景是, 项目前后端没有分离, 静态资源响应缓慢, 一个js文件请求需要2-3秒。而后面加载的js文件还会被前面的请求阻塞2-3秒, 所以临时采用了这样的处理方式, 提高访问速度。这种方式也只是测试开发阶段的无奈之举, 毕竟你不能让所有用户都修改配置, 也不能增加服务器压力而不顾, 根本的解决方式还是要处理静态资源响应慢的问题。

参考文章: https://blog.csdn.net/jueshengtianya/article/details/38271081