ReactNative代碼拆分文檔

目的

1. 優(yōu)化現(xiàn)有程序的包下載邏輯，優(yōu)化70%以上

    總共2M優(yōu)化到100K以?xún)?nèi)
   

2. react native程序秒開(kāi)，優(yōu)化白屏顯示

思路

替換自增方式增加關(guān)聯(lián)，改用字符串引用。項(xiàng)目中增加空白首頁(yè)進(jìn)行預(yù)加載。

方法

1. 自定義metro-bundle
2. 自定義metro-bundler-cli
3. 增加框架sm-react-native-templates

sm-metro-bundler.png

工具文檔地址:

• @caiwenshu/metro-bundler (https://github.com/caiwenshu/metro/tree/0.20.x)

• sm-metro-bundler-cli (https://github.com/caiwenshu/sm-metro-bundler-cli)

• sm-react-native-templates (https://github.com/caiwenshu/sm-react-native-templates

開(kāi)發(fā)方式

sm-metro-bundler-develop.png

sm-metro-bundler-cli介紹

sm-metro-bundler-cli文檔

React Native模板介紹

什馬ReactNative模板介紹文檔

原生集成

ReactNative拆分原生邏輯.png

注: RN1 - RN5為單獨(dú)的模塊

引用

• 參考 https://github.com/tsyeyuanfeng/metro-bundler-cli
• 參考 https://github.com/tsyeyuanfeng/metro-bundler
• 參考 https://blog.csdn.net/yeputi1015/article/details/81476369