Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

kissy modularization part2

Avatar for yiminghe yiminghe
February 21, 2014
Technology
1.8k
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
320
支付宝小程序的开放架构
Avatar for yiminghe yiminghe
0
250
gitc2016 react based architecture
Avatar for yiminghe yiminghe
1
190
antd at qcon2016
Avatar for yiminghe yiminghe
1
260
react-based architecture
Avatar for yiminghe yiminghe
2
190
React Ecosystem At Ant Financial
Avatar for yiminghe yiminghe
4
2.3k
ant design preview
Avatar for yiminghe yiminghe
1
350
react best practice
Avatar for yiminghe yiminghe
3
240
react at alipay
Avatar for yiminghe yiminghe
43
4.6k

Other Decks in Technology

See All in Technology
開発投資の期待値を上げるプロダクトロードマップづくり ~プロダクトエンジニアが越境して事業を伸ばす~
Avatar for Kenta Suzuki kekekenta
1
240
SREへの勘違いに気づいた後の話
Avatar for yuden tomodakengo
0
150
ほんとうの信頼性はヒーローが死んでからはじまる / True reliability begins after the hero dies
Avatar for VTRyo vtryo
0
120
Oracle Cloud Infrastructure(OCI)：Onboarding Session(はじめてのOCI/Oracle Supportご利⽤ガイド)
Avatar for oracle4engineer oracle4engineer
PRO
2
20k
Issue 駆動でスペシャリストの意図を届ける、AI 実装のアクセシビリティ向上
Avatar for thkt thkt
0
140
10Xに技術的負債をもたらした「2つの境界の歪み」その構造と解消への営み
Avatar for 10xinc 10xinc
0
2.4k
なぜ「決定性」が 決定的に重要なのか？ Durable Execution 基盤の数理的理解 #serverlessjp / ServerlessDays Tokyo 2026
Avatar for y_taka_23 ytaka23
3
1.2k
SREは、MCPとAutopilotをこう使え！
Avatar for kazumax55 kazumax55
3
950
AIエージェントの一手は 誰も見ていない - Falco拡張OSS「Prempti」とeBPFで サーバーレス実行基盤を二層防御する
Avatar for がっきー（がっきー） keitah
0
520
その Lambda、8分で 管理者権限まで奪われます
Avatar for k1nakayama k1nakayama
7
3.6k
白金鉱業Meetup Vol.25 アウトカムが二値のデータに対するCausal Impact
Avatar for BrainPad brainpadpr
0
290
積み重なった技術負債への挑戦 〜初手としての全社ゴト化〜
Avatar for PERSOL CAREER Dev | techtekt techtekt
PRO
0
1.6k

Featured

See All Featured
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
17k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
38
3k
The Curse of the Amulet
Avatar for Matthew Lei leimatthew05
3
15k
Building Applications with DynamoDB
Avatar for Matt Wood mza
96
7.2k
Visualization
Avatar for Eitan Lees eitanlees
152
17k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
75
12k
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
340
58k
Thoughts on Productivity
Avatar for Jon Yablonski jonyablonski
76
5.4k
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
66
8.6k
Reflections from 52 weeks, 52 projects
Avatar for Jefferson Lam jeffersonlam
356
21k
Getting science done with accelerated Python computing platforms
Avatar for Jacob Tomlinson jacobtomlinson
2
480
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
Avatar for Kenny Baas-Schwegler baasie
1
530

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