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
360
react best practice
Avatar for yiminghe yiminghe
3
250
react at alipay
Avatar for yiminghe yiminghe
43
4.6k

Other Decks in Technology

See All in Technology
AIに賢く動いてもらうためのコンテキスト〜Snowflake女子会 vol.8
Avatar for SnowflakeLadiesGroup snowwmn0824
0
200
雪かき部 #7 もう怖くない！SELECT文！
Avatar for numa foursue
0
150
Apache Iceberg が拓く AI 時代のオープンレイクハウス
Avatar for Tomohiro Tanaka tomtanaka
0
190
Argo CDとAtlantisで実現するインフラ管理のセルフサービス化──小規模SREチームで支えるプラットフォーム
Avatar for DAN cassius7
0
230
2026-09-26 Platform Engineering Kaigi 2026 インフラとアプリの境界線と委譲の設計 / Drawing the Infra and App Line
Avatar for SUZUKI Masashi masasuzu
0
440
PQC移行の今 -- IETF からみた現在地
Avatar for 菅野 哲 / Satoru Kanno satokan
4
620
手を動かして実感する、Kiro が変える開発体験
Avatar for Riku INADA inariku
0
410
Kiro Meetup #8 Kiro アップデート (2026/3/21〜2026/9/24)
Avatar for Katz Ueno katzueno
1
300
Coil3を内部実装から読み解く～キャッシュ戦略とAVIF画像の描画〜/nikkei-tech-talk50
Avatar for 日本経済新聞社 エンジニア採用事務局 nikkei_engineer_recruiting
0
140
なぜAI任せのゲームは面白くならないのか？
Avatar for Hirohasu hirohasuyoutube
0
280
DORA_Metrics.pdf
Avatar for Wagner Voltz - Fusca wagnerfusca
1
120
AI coding 整合正規方法
Avatar for philipz philipz
0
560

Featured

See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
133
19k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
162
16k
Stewardship and Sustainability of Urban and Community Forests
Avatar for Eric Wiseman pwiseman
0
530
It's Worth the Effort
Avatar for 3n 3n
188
29k
Done Done
Avatar for chrislema chrislema
187
17k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
5.2k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
Avatar for Eileen M. Uchitelle eileencodes
141
35k
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
142
7.7k
The Language of Interfaces
Avatar for Des Traynor destraynor
162
27k
Leading Effective Engineering Teams in the AI Era
Avatar for Addy Osmani addyosmani
9
2.7k
The Impact of AI in SEO - AI Overviews June 2024 Edition
Avatar for Aleyda Solis aleyda
6
1.2k
Utilizing Notion as your number one productivity tool
Avatar for Mfonobong Umondia mfonobong
4
600

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