淘宝首页加载css js的url 利用逗号切割, 同时加载多个文件实现思路?
例如这样的地址:
http://g.tbcdn.cn/??tb/global/2.5.3/global-min.js,tb/tb-fp/1.5.6/core-min.js?t=20131218
http://g.tbcdn.cn/??tb/global/2.5.3/global-min.css,tb/tb-fp/1.5.6/style-min.css?t=20131218
可以同时加载多个js或css 文件。 是淘宝cdn做了特殊处理:服务端根据逗号做切割,找到相应的文件最后合并返回, 还是一般的服务器也可以这么做? 怎么实现类似功能
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
跟雪碧图一样,合并文件减少请求次数达到优化的目的,这个在自己服务器上也可以做的。搜索“css js 请求合并”等关键词就能搜索到很多东西,这里放几个仅供参考:
这个特性叫做 combo,Nginx 上有插件实现(Apache 不知道~)。
另外可以参考一下 Sea.js(支付宝用的前端模块加载器)的 combo 插件的一个讨论帖,里面有比较详细的介绍:
https://github.com/seajs/seajs-combo/issues/3
PHP 类似实现 Minify https://github.com/mrclay/minify
实测效果非常好,可以配合Memcache使用
原理就是根据URL参数解析JS/CSS文件名称,动态程序处理流程
首次1):逐个读取文件->压缩(去除空白符,注视等)->合并->缓存
二次2):逐个读取前检测mtime修改状态,与上次是否一直,不一致则执行 1) 一致直接缓存读取输出