Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
kissy modularization part2
Search
yiminghe
February 21, 2014
Technology
1
1.7k
kissy modularization part2
part2 of kissy modularization tutorials
yiminghe
February 21, 2014
Tweet
Share
More Decks by yiminghe
See All by yiminghe
小程序终端技术架构
yiminghe
0
230
支付宝小程序的开放架构
yiminghe
0
190
gitc2016 react based architecture
yiminghe
1
150
antd at qcon2016
yiminghe
1
220
react-based architecture
yiminghe
2
160
React Ecosystem At Ant Financial
yiminghe
4
2.2k
ant design preview
yiminghe
1
290
react best practice
yiminghe
3
210
react at alipay
yiminghe
43
4.4k
Other Decks in Technology
See All in Technology
250905 大吉祥寺.pm 2025 前夜祭 「プログラミングに出会って20年、『今』が1番楽しい」
msykd
PRO
1
930
Language Update: Java
skrb
2
300
DroidKaigi 2025 Androidエンジニアとしてのキャリア
mhidaka
2
300
共有と分離 - Compose Multiplatform "本番導入" の設計指針
error96num
2
570
サラリーマンの小遣いで作るtoCサービス - Cloudflare Workersでスケールする開発戦略
shinaps
2
450
AI開発ツールCreateがAnythingになったよ
tendasato
0
130
Agile PBL at New Grads Trainings
kawaguti
PRO
1
430
RSCの時代にReactとフレームワークの境界を探る
uhyo
10
3.4k
CDK CLIで使ってたあの機能、CDK Toolkit Libraryではどうやるの?
smt7174
4
180
現場で効くClaude Code ─ 最新動向と企業導入
takaakikakei
1
250
KotlinConf 2025_イベントレポート
sony
1
140
会社紹介資料 / Sansan Company Profile
sansan33
PRO
6
380k
Featured
See All Featured
For a Future-Friendly Web
brad_frost
180
9.9k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
2.9k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.4k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.9k
How STYLIGHT went responsive
nonsquared
100
5.8k
Bash Introduction
62gerente
615
210k
GitHub's CSS Performance
jonrohan
1032
460k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
188
55k
The Art of Programming - Codeland 2020
erikaheidi
56
13k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Transcript
KISSY Modularization part 2 - optimzation
[email protected]
之前浏览器下的问题 • 首屏闪烁 • 链接数过多
链接数
使用工具进行优化 • grunt-kmc • 合并文件 • 动态 combo
• 合并项目文件
合并文件 • 适合具备明确的入口文件 • Gruntfile.js
modules.js • 描述项目合并后文件外部依赖
index.js • 入口模块以及其依赖的本地模块
应用 • 引入 seed.js modules.js • 配置 combine true •
http://localhost:8111/?concat=1
• 动态 combo
动态 combo • 适合多入口或无入口应用或需要后期动态加载 • Gruntfile.js
Module.js • 包含项目所有的模块的内部依赖与外部依赖
应用 • 引入 seed.js modules.js • 配置 combine true •
http://localhost:8111/?combo=1
• 首屏闪烁
加载 css • 异步加载 css 造成闪烁
加载 css • 使用 importStyle 配置 modules.js 同步 combo 加载
css • 对首屏用到的所有模块调用 importStyle
大规模应用优化 • Gallery/mini 模块? • 打包进项目入口文件 • 动态 combo •
合并 gallery/mini 模块的 modules.js 到项目 modules.js