定制版设计开发vs响应式设计开发之性能及流量

Transcript

1. 关于性能 • jQuery – 94K • KISSY-Seed – 49.9K • Zepto – 9.7K 13年5月20⽇日星期⼀一
2. 13年5月20⽇日星期⼀一
3. 13年5月20⽇日星期⼀一
4. • 2010年, 我国⼿手机平均⺴⽹网速为50Kbps,也就 是 50/8 = 6.25KB/S 全球倒数第⼆二! • 下载jQuery, 需要 94/6.25 = 15.04S • 下载KISSY-Seed, 需要49.9/6.25 =7.98S • 下载Zepto, 需要9.7/6.25 = 1.55S 13年5月20⽇日星期⼀一
5. • 加载基础脚本超过8S的⺴⽹网站, 你的反应是? • 基础脚本 + 业务脚本 + 样式表 = ? • 还有图⽚片，HTML⽂文档等。。。 13年5月20⽇日星期⼀一
6. 定制的优势 • 更轻量级的脚本 – 不⽤用兼容IE，Loader可以更加简洁 – 不⽤用兼容IE，Event可以更加简洁 – 不⽤用兼容IE，DOM 可以更加简洁 – 。。。。。 13年5月20⽇日星期⼀一
7. 定制的优势 • ⽆无需Hack的CSS .inline-block{ display: inline-block; } .elem:hover{ //Some Code .inline-block{ display: inline-block; *display: inline; *zoom:1 } .hover, .elem:hover{ //Some 13年5月20⽇日星期⼀一
8. 定制的优势 • 放⼼心的使⽤用更强⼤大的CSS选择器 – ~ > + :first …. • 简单的动画 $el.anim(props, duration, fn) .el-cls {transition:all, duration, fn} 13年5月20⽇日星期⼀一
9. 定制的优势 正如移动设备本⾝身， 轻便⽽而⼜又强⼤大 13年5月20⽇日星期⼀一