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
150
支付宝小程序的开放架构
yiminghe
0
170
gitc2016 react based architecture
yiminghe
1
130
antd at qcon2016
yiminghe
1
190
react-based architecture
yiminghe
2
150
React Ecosystem At Ant Financial
yiminghe
4
2.2k
ant design preview
yiminghe
1
260
react best practice
yiminghe
3
180
react at alipay
yiminghe
43
4.2k
Other Decks in Technology
See All in Technology
フォーイット_エンジニア向け会社紹介資料_Forit_Company_Profile.pdf
forit_tech
1
1.7k
Aurora PostgreSQLがCloudWatch Logsに 出力するログの課金を削減してみる #jawsdays2025
non97
1
250
Pwned Labsのすゝめ
ken5scal
2
580
開発組織を進化させる!AWSで実践するチームトポロジー
iwamot
2
570
アジャイルな開発チームでテスト戦略の話は誰がする? / Who Talks About Test Strategy?
ak1210
1
870
生成AI×財務経理:PoCで挑むSlack AI Bot開発と現場巻き込みのリアル
pohdccoe
1
840
【内製開発Summit 2025】イオンスマートテクノロジーの内製化組織の作り方/In-house-development-summit-AST
aeonpeople
2
1.2k
どうすると生き残れないのか/how-not-to-survive
hanhan1978
2
870
Platform Engineeringで クラウドの「楽しくない」を解消しよう
jacopen
4
230
DeepSeekとは?何がいいの? - Databricksと学ぶDeepSeek! 〜これからのLLMに備えよ!〜
taka_aki
2
190
4th place solution Eedi - Mining Misconceptions in Mathematics
rist
0
150
遷移の高速化 ヤフートップの試行錯誤
narirou
6
2k
Featured
See All Featured
How to train your dragon (web standard)
notwaldorf
91
5.9k
Measuring & Analyzing Core Web Vitals
bluesmoon
6
260
Music & Morning Musume
bryan
46
6.4k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.2k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
How to Think Like a Performance Engineer
csswizardry
22
1.4k
Build The Right Thing And Hit Your Dates
maggiecrowley
34
2.5k
The Pragmatic Product Professional
lauravandoore
32
6.4k
For a Future-Friendly Web
brad_frost
176
9.6k
Six Lessons from altMBA
skipperchong
27
3.6k
Gamification - CAS2011
davidbonilla
80
5.2k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Transcript
KISSY Modularization part 2 - optimzation yiminghe@gmail.com
之前浏览器下的问题 • 首屏闪烁 • 链接数过多
链接数
使用工具进行优化 • 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