React Native為應用程序帶來了驚人的效果,但仍然存在一些性能上的問題。接下來介紹一些性能優化方案。
1、shouldComponentUpdate的使用
使用shouldComponentUpdate方法,可以減少組件不必要的重新渲染。shouldComponentUpdate返回布爾值,根據該值,組件將重新呈現。例如,如果它返回true,那么它將重新呈現,如果它返回false,那么它將不會重新呈現組件。
因此,在狀態更新或組件的新屬性時,將使用兩個名為nextState和nextProps的參數調用該方法。所以,你可以對比一下新的道具和狀態和之前的。并且根據你的業務邏輯需求,你可以使用布爾值再次呈現組件。
2、使用React的純成分
React的純組件有助于僅渲染已更改或狀態已更新的特定道具。例如,如果我們使用一個呈現1000行的平面列表。現在,在每次重新渲染時,將會再次渲染1000個數據。
在純組件中使用flatlist我們可以確保只有改變了所需的道具,組件才會重新渲染一次。
3、使用Hooks API中的備忘錄
React鉤子為函數提供了組件的生命周期。react的備忘錄有助于對即將到來的變化進行淺顯的比較。因此,只有當道具改變時,它才允許重新渲染功能。
4、只要有可能,就用本機驅動程序構建模塊
有時,我們不得不使用一些原生可以更有效地完成的功能。此時,我們必須在本機中構建該模塊,并可以通過創建一個橋來使用React Native的特性。
5、在構建應用程序之前,刪除控制臺日志
現已發現,控制臺日志記錄需要一些時間。因此,在開發時使用它是很好的,但在生產版本中,它應該被刪除,這將有助于提高應用程序的性能,你將在使用它時意識到這一點。
6、減少應用程序大小
在React Native中,你使用外部庫和組件表單庫,因此它會影響應用程序的大小。為了減小尺寸,你必須優化資源,使用ProGaurd,為不同的設備架構創建不同的應用程序大小,并確保壓縮圖形元素,即圖像。
JavaScript 端的組件使用橋接器與 Native 端通信。減少橋接器的負載并提高應用程序的性能。
總結
這些是提升React原生應用性能的小技巧。對于移動開發者而言,react-native只是開發箱中其中一種工具。豐富自己工具箱,才能有更寬的視野,更多的開發思路。