说起网页速度优化,想必大家都能说上几句,最知名的莫过于雅虎的23条了。这里有一系列的小建议和优化策略,但是治病也得看症状,对症下药才是关键。
比如淘宝卖家中心首页速度优化的这个场景,就是一个很突出的例子。文章里针对首页展示优化策略做个一个全面的对比,这里我就不多逼逼了,关于BigPipe这种分块传输的原理,这里也有很好的说明,也没必要多说。
在我实际的工作中,也遇到这样的场景,虽然没有上述的这么明显,但是却也有着更复杂的场景。
比如首页是一个静态页面,不依赖什么接口
列表页涉及到价格日历,筛选,一些提示信息模块等,依赖不同的接口
因为使用了node,可以实现前后端模板共用。同样也可以实现是html片段是前端拼接还是node层拼接,前端拼接的好处是模板可以缓存,传输数据的数据量相对少一些。node层拼接的好处是减少了前端的运算量,拼接好的html片段可以在服务端缓存
有些前端接口可能需要整合多个后端接口的数据
...
针对这些,在实践中我基于express做了一层包装,可以完美支持以上各种场景,当然更开心的使用 bigPipe 是其中很重要的目的.
采用BigPipe的优势就是
提高了首屏的展示速度
单页面有多接口多模块的时候,可以在一个长连接中通过chunk的方式分批返回,减少了http请求的压力
前后端模板公用,同时可以实现服务端渲染,对搜索引擎更加友好
使用前:
使用后:
妈的,怎么感觉像卖药的。这是我基于实践写的bigape, 里面有更加详细的使用说明, 一个更加丰满的express框架,写的仓促,如有问题欢迎拍砖,同时欢迎 star 和贡献代码 (^__^)
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。