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

kissy modularization part2

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
180
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
20260513_生成AIを専属DSに_AI分析結果の検品テクニック_ハンズオン_交通事故データ
Avatar for NobuakiOshiro doradora09
PRO
0
230
CyberAgent YJC Connect
Avatar for shimayuu shimaf4979
1
190
ServiceによるKubernetes通信制御ーClusterIPを例に
Avatar for 周学勤（Zhou Xueqin） miku01
1
170
Tachikawa.any 運営挨拶
Avatar for daitasu daitasu
0
170
Oracle Cloud Infrastructure presents managed, serverless MCP Servers for Oracle AI Database
Avatar for thatjeffsmith thatjeffsmith
1
320
Agent Skillsで実現する記憶領域の運用とその後
Avatar for yamadashy / やまだし yamadashy
2
1.9k
20260515 ログイン機能だけではないアカウント管理を全体で考える～サービス設計者向け～
Avatar for OpenID Foundation Japan oidfj
0
600
クラウドネイティブ DB はいかにして制約を 克服したか？ 〜進化歴史から紐解く、スケーラブルアーキテクチャ設計指針〜
Avatar for hacomono Inc. hacomono
PRO
6
1k
Oracle Base Database Service 技術詳細
Avatar for oracle4engineer oracle4engineer
PRO
15
100k
ボトムアップ限界を越える - 20チームを束る "Drive Map" / Beyond Bottom-Up: A 'Drive Map' for 20 Teams
Avatar for 株式会社カオナビ kaonavi
0
220
AI飲み会幹事エージェントを作っただけなのに
Avatar for Yuta Kimi ykimi
0
210
2026-05-14 要件定義からソース管理まで！IBM Bob基礎ハンズオン
Avatar for YutaNonaka yutanonaka
0
160

Featured

See All Featured
Building Experiences: Design Systems, User Experience, and Full Site Editing
Avatar for Michelle Schulp Hunt marktimemedia
0
500
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.7k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
9.8k
The AI Revolution Will Not Be Monopolized: How open-source beats economies of scale, even for LLMs
Avatar for Ines Montani inesmontani
PRO
3
3.4k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
Avatar for Joe Casabona jcasabona
34
2.7k
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
41
2.5k
Marketing to machines
Avatar for Jono Alderson jonoalderson
1
5.2k
How To Speak Unicorn (iThemes Webinar)
Avatar for Michelle Schulp Hunt marktimemedia
1
460
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
Avatar for Aleyda Solis aleyda
1
2k
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
Avatar for Greg Gifford greggifford
PRO
0
170
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
Avatar for konakalab konakalab
0
420
Sam Torres - BigQuery for SEOs
Avatar for Tech SEO Connect techseoconnect
PRO
0
260

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