首页 > 淘宝首页非常快,主要用了哪些前端方面的优化技术?

淘宝首页非常快,主要用了哪些前端方面的优化技术?

通过浏览器简单地测试,淘宝首页的DOMContentLoaded的时间是500ms左右,load时间是2s左右,相对于淘宝首页这样一个内容丰富的web页面,速度是非常给力的。。。。想请问一下,作为一个访问量巨大的页面,淘宝通过哪些技术手段实现这个效果?(ps:尤其在前端方面)


PDF


页面静态化,把所有可能的瓶颈打通速度就上来了呗,是大量调优的结果。比如taobao自己那个Tengine,能把好几个css合并成一个文件传输。


我发现淘宝首页很大部分内容用的是WebSocket加载的,不知道有没有帮助


主要是cdn,全部静态化,能用cache的地方全部用cahche,更多的不方便透漏了


感觉CDN在起主导作用了,CSS压缩,jS压缩这些固然重要,图片采用数据量较小且保证最低用户接受的水准,比较耗时的模块采用lazyload异步加载。


应该还使用了facebook提供的bigpipe技术


先挖坑,后面再细填。

1、使用CDN
使用了g.tbcdn.cn等CDN域名来加载图片、CSS、JS等静态资源

2、CSS压缩、JS压缩,减少文件体积

3、dns-prefetch

4、减少http请求数
图片CSS_Sprite,eg http://gtms01.alicdn.com/tps/i1/T1CLOwFelgXXakF0U7-800-400.png

5、缓存

6、script async 属性

以上的是可以确定的,还有其他的技术,等有时间再填。


主要还是cdn,以我的经验,价格也可能被cache住了几秒钟


记得某次QCon,台上的某人讲述了淘宝和天猫的首屏加载时间对赌的事。
策略方面,一切都围绕着异步,不断上调的首屏线,非核心模块异步,产生交互后再加载(元素被hover)等等方式,对于不用考虑SEO的淘宝,这是关键。


技术普及帖:你刚才在淘宝上买了一件东西


分布式,CDN,异步,Kissy,css,js合并压缩什么的

【热门文章】
【热门文章】