前人種樹后人乘涼
原文地址
一受神、異步逐層渲染溉奕。
React Native 雖然一直標(biāo)榜媲美Native的體驗熙侍，但實際使用下來，其渲染性還是非常低效柒室，基于ScrollView和ListView兩大容器渡贾，在渲染上，相當(dāng)于web端的table布局雄右，需要等整個大table渲染完成才顯示頁面空骚，也就是說，當(dāng)容器內(nèi)有大量的子元素擂仍，其白屏?xí)r間會非常長囤屹。
二、實現(xiàn)shouldComponentUpdate方法
如上第一點逢渔，逐層渲染提升打開時間肋坚，但是也會導(dǎo)致component重復(fù)渲染，也就是執(zhí)行了大量無用的diff算法肃廓。雖然React里引以為傲的diff算法非常高效冲簿，但是執(zhí)行數(shù)量達(dá)到一定程度后，也會帶來非常大的影響亿昏。那么可使用shouldComponentUpdate來控制component的渲染次數(shù)。
如果確定該組件渲染完后 無需再次更新 档礁，即這個組件是一個 靜態(tài)組件 角钩，那么可以直接return false
shouldComponentUpdate(){
return false
}
三、使用setNativeProps方法
setNativeProps方法可以理解為web的直接修改dom。使用該方法修改View递礼、Text等RN自帶的組件惨险，則不會觸發(fā)組件的componentWillReceiveProps、shouldComponentUpdate脊髓、componentWillUpdate等組件生命周期中的方法辫愉。
建議頻繁更新的操作，如slider将硝、tabs切換等拖曳操作時恭朗，使用setNativeProps來更新屬性，會獲得意想不到的性能體驗依疼。
//修改文本輸入框的 屬性值
this.refs.textInputRefer.setNativeProps({
editable:false
});
//修改文本輸入框的 style
this.refs.text2.setNativeProps({
style:{
color:'blue',
fontSize:30
}
});
四痰腮、不要使用陰影效果
React Native 里面的 shadow相關(guān)的樣式，是非常耗性能的css屬性律罢。這在web上膀值，以前android 2.0年代，也是一樣耗性能的css屬性之一误辑。如果需要使用陰影效果沧踏，建議使用圖片來代替反而性能更好一些。
五巾钉、最小化DOM
React Native里虛擬dom結(jié)構(gòu)越復(fù)雜翘狱，則越低效况既。如果層級結(jié)構(gòu)大于5級蔽挠，則要考慮下優(yōu)化了。這沒啥技巧网棍，純靠經(jīng)驗及硬實力师骗。
六历等、組件粒度化
如何更好的劃分組件粒度，這需要合理的對組件進(jìn)行更細(xì)粒度的劃分辟癌，區(qū)分出靜態(tài)組件及動態(tài)組件寒屯。
