一套代碼打造多端應(yīng)用是一個(gè)不錯(cuò)的開(kāi)始，如果您希望為用戶提供盡可能好的體驗(yàn)，下一步是最大限度地提高應(yīng)用的性能。 本部分為您提供所需的專業(yè)知識(shí)，以使您的應(yīng)用程序性能卓越。繼續(xù)閱讀將幫助您如何構(gòu)建響應(yīng)迅速，高效且行為良好的應(yīng)用。

數(shù)據(jù)定義優(yōu)化

data里面的數(shù)據(jù)在每次變化時(shí)都會(huì)進(jìn)行比對(duì)，然后再更新視圖，因此不必要的數(shù)據(jù)可以直接定義在組件或global下，不用定義在data里面，以減少數(shù)據(jù)比對(duì)，提高頁(yè)面響應(yīng)性能。

默認(rèn)導(dǎo)航欄的使用

如果您的項(xiàng)目只需要支持App端，不需要支持多端，那么對(duì)于導(dǎo)航欄定制要求不高的頁(yè)面，我們依然推薦您使用TabLayout的導(dǎo)航欄。雖然可以非常簡(jiǎn)單地通過(guò)組件自己實(shí)現(xiàn)導(dǎo)航欄，也不會(huì)像window + frame布局那樣增加內(nèi)存占用，但是自定義導(dǎo)航欄還是有js解析、布局計(jì)算等過(guò)程，而且還需要處理安全區(qū)域問(wèn)題，使用TabLayout則會(huì)體驗(yàn)更加極致。

長(zhǎng)列表的使用

在App端，長(zhǎng)的列表應(yīng)該使用list-view這類帶回收復(fù)用功能的列表，這類列表只渲染屏幕上可見(jiàn)范圍內(nèi)的幾項(xiàng)，在滾動(dòng)過(guò)程中回收移出屏幕外的項(xiàng)，這樣就大幅減少了內(nèi)存占用，即使有成千上萬(wàn)條數(shù)據(jù)也不會(huì)影響性能。

優(yōu)化列表滾動(dòng)性能

list-view這類列表不是一次性渲染出所有項(xiàng)，而是在滾動(dòng)過(guò)程中動(dòng)態(tài)地刷新數(shù)據(jù)和渲染，要做到滾動(dòng)流暢不卡頓，需要注意以下幾方面：

1、避免使用大圖

圖片加載對(duì)滾動(dòng)性能影響最大，因此應(yīng)該避免在列表項(xiàng)中加載使用大圖。而且不僅是在列表中，其它地方也應(yīng)避免直接加載大圖。

2、為元素指定寬高

如果明確知道某元素的尺寸，則應(yīng)為其指定寬高，減少布局計(jì)算耗時(shí)。比如一個(gè)固定內(nèi)容的文本，雖然不指定寬高也可以通過(guò)其內(nèi)容計(jì)算出尺寸，但顯然會(huì)耗費(fèi)更多的時(shí)間。

3、減少節(jié)點(diǎn)嵌套層級(jí)

盡量減少嵌套層級(jí)，層級(jí)越深，計(jì)算布局和系統(tǒng)渲染時(shí)開(kāi)銷越大。

如何最大限度兼容小程序

1、盡可能少的或者不引用外部css、js文件，將頁(yè)面涉及的內(nèi)容完全包含在template、script、style代碼塊中，這將更有利于編譯器編譯小程序代碼以及提升兼容能力

2、不建議使用模塊或者大多數(shù)API，小程序平臺(tái)幾乎不具備APICloud絕大部分模塊及API的能力。建議通過(guò)在一個(gè)項(xiàng)目中區(qū)分管理，使用stml方式分別編寫(xiě)App端和小程序端

3、list-view、frame等是專為App打造的組件，更匹配Android和iOS系統(tǒng)的原生特性，小程序中應(yīng)避免使用，而是使用v-for指令或者scroll-view等進(jìn)行替代