使用 SPDY 配合 Nginx 或者 Node 加载文件的速度, 测试

MingjunYang 发布于2019-07-25 13:22 / 3116人阅读

摘要：单页面应用文件增多时存在轻微过多阻塞页面加载的情况比如这样对虽然可以考虑合并后调试但合并并不快还要再考虑想到的一个方案是的请求合并功能比如这里的例子没有明显的参考目前的浏览器支持我原来以为可以在开发环境尝试的基于的服务器基本的配置是

单页面应用文件增多时, 存在轻微过多阻塞页面加载的情况, 比如这样:

(对虽然可以考虑合并后调试, 但 RequireJS 合并并不快, 还要再考虑)

想到的一个方案是 SPDY 的请求合并功能, 比如这里的例子, 没有明显的 Blocking
https://www.modspdy.com/world-flags/

参考目前 SPDY 的浏览器支持, 我原来以为可以在开发环境尝试的
http://caniuse.com/spdy

基于 Nginx 的 SPDY 服务器

基本的配置是这样的, 具体步骤请参考其他文章,
测试的内容是一个有 20 个左右 JS 文件的 HTML 的加载:

server {
  listen 443 ssl spdy;
  ssl on;
  ssl_certificate app.crt;
  ssl_certificate_key app.key;

  server_name app.app;

  location / {
    root /app/;
    autoindex on;
  }
}

结果是:

单纯 Nginx 使用 HTTP 的情况:

Nginx 里使用了 SPDY serve 静态文件的情况:

这个是后面的 Node 服务器 serve 静态文件的情况:

大致可以看到几点, 可能不够准确..

SPDY 的请求是同时发出的, 不像是 HTTP 发出时间呈现阶梯状, 图上不够明显

SPDY 中 blocking 的时间更长(但有上述的区别), 可能是 SSL 协议原因..?

使用 Node SPDY 服务器

网上找到了另一个方案, 使用 Node spdy 模块来加载文件
https://coderwall.com/p/2gfk4w
https://github.com/ericallam/spdy-with-server-push-tutorial

其中的策略是这样的:
预先加载静态资源文件, 当然, 还有证书之类的..
第一个请求访问 / 路径时, 把静态的 JS 等等文件 push 到服务端,
res.end 访问 / 对应的 HTML 文件,
然后, 等浏览器去取静态资源时, 就可以直接命中缓存, 加快速度.

我仿照这个方案, 写了一些代码, 我们的项目开发环境存在上百个请求,
具体代码不方便, repo 里只是 SPDY 相关的代码:
https://github.com/jiyinyiyong/spdy-reload-server

注意使用命令去掉证书使用的密码, 否则 Node 启动时会提示的:
http://webmasters.stackexchange.com/a/1254/37858
另外这里我没有走 Nginx, 而是 https://127.0.0.1:3000

这是不使用 SPDY 协议时的情况:

使用了 SPDY 协议之后的情况:

我遇到到的几点, 图上看到比较少:

SPDY 使用后的确加快了, 但效果不明显, 还是有

静态文件的 download 时间成了 0, 说明缓存起作用了

只有在 Chrome Canary 正常运行, 低版本 Chrome 会因为 push 而 crash

Firefox 和 Safari 可能导致 Node 服务器报错

另外我还注意到 Canary 访问即便是 HTTP 也是比 Dev 版的 Chrome 快的... 不清楚为什么.

总结

SPDY 能带来速度的提升, 但是并不明显, 反而改用 Canary 提升大一些

使用 Nginx SPDY 没能加快, 而 Node 对文件做缓存取得一定的效果.

可惜目前难以在开发环境用...

上面是我的一些尝试, 感觉不够严谨, 而且里边细节也不有理解和不能解释的...
等高人往深了挖一挖...

GPU云服务器云服务器阿里云服务器怎么和小程序配合使用 nginx性能测试 vps使用node 文件服务器的速度

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/39060.html

未来已到——HTTP/2

摘要：通过或者协议请求的资源由统一资源标识符，来标识。标准于年月以正式发表，替换成为的实现标准。该系列协议由谷歌开发，于年公开。主流的浏览器谷歌火狐也都早已经支持，它已经成为了工业标准。配合负载均衡有层和层协议负载。 HTTP/2 is the future of the Web, and it is here! 使用 HTTP/1.1 和 HTTP/2 在相同环境各加载 300 多张小图片...

songze 2019-06-24 17:51 评论0 收藏0
域名发散--前端优化(三)

摘要：但在里，所有的文本数据默认都会被压缩目前的兼容性是所以说还是任重而道远开启那如何开启呢很简单，使用的用户，可以下载一个的模块使用的用户，可以下载一个的模块最后说两句其实，和域名收敛一直都是前端世界的优化的重点。话说天下大势，分久必合，合久必分其实域名也是一样，分分合合，不管是域名收敛还是域名发散，都有着自己独特的应用场景。目前, 在webs top 30,000 URLS 里面，...

April 2019-06-21 16:09 评论0 收藏0
Node.js运行原理、高并发性能测试对比及生态圈汇总

摘要：模式，单实例多进程，常用于多语言混编，比如等，不支持端口复用，需要自己做应用的端口分配和负载均衡的子进程业务代码。就是我们需要一个调度者，保证所有后端服务器都将性能充分发挥，从而保持服务器集群的整体性能最优，这就是负载均衡。 showImg(https://segmentfault.com/img/remote/1460000019425391?w=1440&h=1080); Nod...

kamushin233 2019-08-30 11:08 评论0 收藏0
Node.js运行原理、高并发性能测试对比及生态圈汇总

摘要：模式，单实例多进程，常用于多语言混编，比如等，不支持端口复用，需要自己做应用的端口分配和负载均衡的子进程业务代码。就是我们需要一个调度者，保证所有后端服务器都将性能充分发挥，从而保持服务器集群的整体性能最优，这就是负载均衡。 showImg(https://segmentfault.com/img/remote/1460000019425391?w=1440&h=1080); Nod...

BDEEFE 2019-08-02 15:15 评论0 收藏0