React Native 性能優化

前幾天看了某位大神的rn視頻感觸頗深，rn的性能優化道路雖然很艱難，但希望總會是有的。

1.優化Component

很多人在定義一個class時都會去繼承Component，這并沒有錯，但是如果一個子組建也繼承了Component，那么當父組建render時也會導致子組建的render，怎么解決呢？其實很簡單只需要我們的子組建去繼承PureComponent即可。個人建議自定義的class都可以去繼承PureComponent從而避免不必要的render。

2.優化方法的創建

內部方法的定義應該使用 onPress=()=>{}. 調用直接this.onPress即可，避免創建多個fun

3.善于使用shouldComponentUpdate

通過shouldComponentUpdate的返回結果我們可以去控制什么時候應該render，什么情況應該render。

4.listview代替scrollview

使用listview我們可以設置首次render時要渲染的ui數量，這樣一定程度上優化了首次進入頁面時所需要的渲染時間（renderHeader/pagesize）

5.使用InteractionManager

InteractionManager.runAfterInteractions(...)的官方文檔說的很清楚，通過他可以處理一些耗時操作，所以我個人建議把網絡請求放在次方法中去處理，這樣很大程度上可以解決首次進入時的卡頓。

6.使用Animated去處理一些簡單的動畫

我想應該會有很多小伙伴遇到這樣的問題，切換不同的state改變某個view的height/width，是不是很多小伙伴都會用state去控制height/width。并不是說這樣是完全不對，只是這樣耗費性能，因為你的state的改變會觸發render，而對于一個過程來說，這樣的render次數是我們不愿意看到的，那該怎么解決呢？其實大家可以使用Animated去代替state，Animated封裝了一系列優雅的處理函數，完全可以實現你想要的效果，使用方法官方有介紹。

React Native的優化是一條漫漫長路，可路邊總會有一些風景讓你覺的終點并不遙遠，再次感謝@天地之靈 大神的精彩分享，希望學習rn的小伙伴們共同去探討，共同去進步。

來自：http://www.jianshu.com/p/57f2e987c879