Upgrade to Pro — share decks privately, control downloads, hide ads and more …

kissy modularization part2

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for yiminghe yiminghe
February 21, 2014
Technology
1.7k
1

kissy modularization part2

part2 of kissy modularization tutorials

Avatar for yiminghe

yiminghe

February 21, 2014

More Decks by yiminghe

See All by yiminghe
小程序终端技术架构
Avatar for yiminghe yiminghe
0
280
支付宝小程序的开放架构
Avatar for yiminghe yiminghe
0
210
gitc2016 react based architecture
Avatar for yiminghe yiminghe
1
190
antd at qcon2016
Avatar for yiminghe yiminghe
1
240
react-based architecture
Avatar for yiminghe yiminghe
2
180
React Ecosystem At Ant Financial
Avatar for yiminghe yiminghe
4
2.3k
ant design preview
Avatar for yiminghe yiminghe
1
330
react best practice
Avatar for yiminghe yiminghe
3
230
react at alipay
Avatar for yiminghe yiminghe
43
4.5k

Other Decks in Technology

See All in Technology
「コーディング」しない人のための Claude Code 入門　ChatGPT の次の一歩 — 業務に組み込む 育成・共有・自動化
Avatar for ふくだ（fukuda ryu） rfdnxbro
2
1.2k
AI Engineering Summit Tokyo 2026 AIの前に、やることがある 〜医療データ企業の4フェーズ〜
Avatar for Daisuke Taniwaki dtaniwaki
0
1.7k
ブロックチェーン / Blockchain
Avatar for Kenji Saito ks91
PRO
0
100
「気づいたら仕事が終わっている」バクラクAIエージェント本番運用の裏側 / layerx-bakuraku-aie2026
Avatar for Yuya Matsumura yuya4
18
9.7k
チームで実践する AI-DLC 思考の軌跡を残すチェックポイント設計
Avatar for Belong inc. belongadmin
0
2.5k
Oracle AI Database@AWS：サービス概要のご紹介
Avatar for oracle4engineer oracle4engineer
PRO
4
2.8k
トークン数だけでは測れない — Claude Code 組織展開の効果検証から学んだこと
Avatar for Masaki Kubota makikub
0
120
先取りMaven4 ～16年ぶりのメジャーアップデート、その進化とは？～
Avatar for 荻原利雄 ogiwarat
0
140
Terraformモジュールは、なぜ「魔境」化するのか
Avatar for hayama hayama17
1
180
Spring AI × MCP 入門〜AIエージェントへのツール公開、境界設計から始める最小構成 〜
Avatar for 宮本裕也 yuyamiyamoto
0
210
地元にいないローカルオーガナイザーの立ち回り
Avatar for uvb_76 uvb_76
1
460
OCI Oracle AI Database Services新機能アップデート(2026/03-2026/05)
Avatar for oracle4engineer oracle4engineer
PRO
0
210

Featured

See All Featured
AI in Enterprises - Java and Open Source to the Rescue
Avatar for ivargrimstad ivargrimstad
0
1.3k
What’s in a name? Adding method to the madness
Avatar for The Alliance productmarketing
PRO
24
4.1k
Producing Creativity
Avatar for Steve Smith orderedlist
PRO
348
40k
Scaling GitHub
Avatar for Zach Holman holman
464
140k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
57
6.9k
Ruling the World: When Life Gets Gamed
Avatar for Sebastian Deterding codingconduct
0
240
Chasing Engaging Ingredients in Design
Avatar for Sebastian Deterding codingconduct
0
210
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
225
10k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
528
40k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
150
Ethics towards AI in product and experience design
Avatar for Skipper Chong Warson skipperchong
2
300
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
55
3.4k

Transcript

  1. KISSY Modularization part 2 - optimzation [email protected]

  2. 之前浏览器下的问题 • 首屏闪烁 • 链接数过多

  3. 链接数

  4. 使用工具进行优化 • grunt-kmc • 合并文件 • 动态 combo

  5. • 合并项目文件

  6. 合并文件 • 适合具备明确的入口文件 • Gruntfile.js

  7. modules.js • 描述项目合并后文件外部依赖

  8. index.js • 入口模块以及其依赖的本地模块

  9. 应用 • 引入 seed.js modules.js • 配置 combine true •

    http://localhost:8111/?concat=1

  10. • 动态 combo

  11. 动态 combo • 适合多入口或无入口应用或需要后期动态加载 • Gruntfile.js

  12. Module.js • 包含项目所有的模块的内部依赖与外部依赖

  13. 应用 • 引入 seed.js modules.js • 配置 combine true •

    http://localhost:8111/?combo=1

  14. • 首屏闪烁

  15. 加载 css • 异步加载 css 造成闪烁

  16. 加载 css • 使用 importStyle 配置 modules.js 同步 combo 加载

    css • 对首屏用到的所有模块调用 importStyle

  17. 大规模应用优化 • Gallery/mini 模块？ • 打包进项目入口文件 • 动态 combo •

    合并 gallery/mini 模块的 modules.js 到项目 modules.js