開發(fā)過React Native的同學(xué)，大體都對白屏界面有所了解。作為RN原生自帶功能，基本上每個使用RN的業(yè)務(wù)都在優(yōu)化這一階段。通過對狼人殺的測試來看，首次從RN啟動到渲染，耗時基本有1.7s左右。而這些耗時數(shù)據(jù)還是在iPhone6s中測試得出，可想低端局的情況可能會更加糟糕。

　　分析性能

　　工欲善其事必先利其器，要分析其耗時。還得從源頭著手，根據(jù)常規(guī)做法，都會將React Native打包的js拆分成Base Bundle和業(yè)務(wù)Bundle。從上圖，RN 加載流程來看，加載BaseBundle與業(yè)務(wù)Bundle的耗時是可以有優(yōu)化空間的。

　　優(yōu)化的方案和大多數(shù)人的思路一樣，只需在業(yè)務(wù)啟動前預(yù)加載BaseBundle與業(yè)務(wù)Bundle即可達到優(yōu)化時間的效果。

　　目前所遇到的瓶頸

　　在優(yōu)化的開始，我們可能一直把精力放在BaseBundle中，認為BaseBundle是RN的公共庫，體積肯定不小。但是從數(shù)據(jù)來看，我們的狼人殺業(yè)務(wù)Bundle已經(jīng)是1.8MB（純js代碼，不包括資源文件）而BaseBundle只有918KB，已經(jīng)是兩倍的體量?，F(xiàn)在還只是狼人殺業(yè)務(wù)的初期，隨著業(yè)務(wù)的快速迭代，業(yè)務(wù)Bundle只會更快的增加。而過大的業(yè)務(wù)Bundle所導(dǎo)致的加載時間也會加長。

　　可能有同學(xué)會說，這不是有預(yù)加載嘛。我承認，預(yù)加載確實解決了絕大部分業(yè)務(wù)Bundle的加載耗時。但是，并不是每次預(yù)加載都可以剛剛好預(yù)加載好業(yè)務(wù)Bundle。雖然業(yè)務(wù)Bundle加載耗時變長，預(yù)加載好的幾率就會慢慢變低。