專案背景：
本案例是為我校訂製的智慧校園APP，由於我校並沒有官方的校園APP所以導致學生需要頻繁登陸教務系統網站，且因本校教務系統網站對移動端的相容不是很完善，所以導致部分資訊無法清晰檢視，基於此，本專案應運而生。在開發工具方面，選擇了使用uniapp，uniapp是一個使用 Vue.js 開發所有前端應用的框架，開發者編寫一套程式碼，可釋出到iOS、Android、Web（響應式）、以及各種小程式（微信/支付寶/百度/頭條/QQ/快手/釘釘/淘寶）、快應用等多個平臺。這能為我們大幅度減少開發時間，提高開發效率。
（部分資訊顯示不全）
挑戰：
為迎合智慧校園這一概念，我們在APP主頁引入了，校園新聞這一板塊，在主頁載入時，就會通過uniapp自帶的請求函式獲取最新校園資訊，但在此過程中，我們發現，應用會出現異常的卡頓，甚至崩潰。
解決方案：
起初我們認為是後端傳送的資料過多導致的（最初後端一次返回25條新聞資訊），後將規模變小，一次返回15條資料，情況有所好轉，但任然會出現略微卡頓，為了找到問題的所在我們使用了友盟在uniapp官方外掛市場投放的“友盟+ U-APM 應用效能監控”經過大量觀察頁面渲染資料，我們發現應用在冷啟動和首次啟動階段存在較大的延時，並即使獲取到了後端反饋的資料，前端仍需要幾秒鐘的渲染時間，這就很有意思了，在合理的網路環境下，一段不過20k的資料不應該需要這麼長的時間來渲染，所以我們開始將目標由最開始的資料量轉移到了元件上，uniapp存在vue和nvue兩種頁面方式，其中vue是基於webview的渲染方式，而nvue則是原生渲染，這次我們使用了uniapp的原生元件list這是一種在不可見部分的渲染資源回收有特殊處理，在實測中他的效能遠優於傳統的scroll-view，在使用list元件過後，發現卡頓感明顯消失，通過對比友盟資料，效能提升量相當可觀。
總結：
通過本案列，我們第一次接觸到了“友盟+ U-APM 應用效能監控”，根據他給與的資料，我們從原有的資料量角度，轉移到了，原生元件的渲染問題，他為我們提供了一種尋找問題的捷徑，讓我們面對問題，不再迷茫，不再困惑。