How to reduce connections with kissy

1,018 views

Published on

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,018
On SlideShare
0
From Embeds
0
Number of Embeds
29
Actions
Shares
0
Downloads
9
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

How to reduce connections with kissy

  1. 1. 使用 KISSY 减少 HTTP 链接数 承玉 (yiminghe@gmail.com)
  2. 2. KISSY BASED APPLICATION 使用场景 问题 KISSY 1.2 解决方案 KISSY 下一步
  3. 3. 使用场景 应用代码基于 KISSY 1.2 模块化机制
  4. 4. 使用场景 应用模块中使用或依赖了 KISSY 自身模块
  5. 5. 开始使用
  6. 6.  So easy !
  7. 7. 建立测试
  8. 8. 出现问题 链接数 Float  首屏
  9. 9.  弹窗点击后懒加载
  10. 10. KISSY 1.2 解决方案 使用 KISSY Module Compiler 合并应用代码 使用 map 配置合并多个 KISSY 自身模块
  11. 11.  使用 KISSY Module Compiler 合并应用代码
  12. 12. KISSY MODULE COMPILER 是一个模块代码依赖自动合并工具 是一个模块代码规范辅助工具, 可 以辅助规范模块编写, 不仅仅只适 用动态加载场景, 也可以用来提高 开发阶段效率. 是一个模块代码部署工具. 结合 KISSY 1.2 Loader , 用于模块代码 部署阶段, 多个模块根据其依赖合 并为一个文件, 减少 HTTP 链接数.
  13. 13. 构建脚本编写
  14. 14. 压缩后 main-min.js
  15. 15. 效果
  16. 16. TOO MANY CONNECTIONS ABOUT KISSY KISSY 本身模块链接数过多 ? 使用 map 配置合并多个 KISSY 自身模块
  17. 17. 配置 MAP Combo kissy 自身模块
  18. 18. 最终效果 首屏
  19. 19. 最终效果 懒加载 overlay 后
  20. 20. KISSY 1.3 下一步 自动 combo
  21. 21. 效果
  22. 22. 自动 COMBO 注意:  1. 适合模块不多的中小型应用  2. 需要事先指定依赖  TODO: module compiler 从模块定义中自动抽取依赖元信息  3. 模块过多 combo url 会自动拆分,链接数增多  4. 可以和 module compiler 混合使用  部分自动 combo + 部分手动打包
  23. 23. ANY SUGGESTION? yiminghe@gmail.com
  24. 24. 下节预告  KISSY Promise API 预览

×