微信小程式優化

2022-09-13 02:09:08 字數 1236 閱讀 8627

setdata是小程式開發中使用最頻繁的介面,也是最容易引發效能問題的介面。在介紹常見的錯誤用法前,先簡單介紹一下setdata背後的工作原理。

小程式的檢視層目前使用 webview 作為渲染載體,而邏輯層是由獨立的 j**ascriptcore 作為執行環境。在架構上,webview 和 j**ascriptcore 都是獨立的模組,並不具備資料直接共享的通道。當前,檢視層和邏輯層的資料傳輸,實際上通過兩邊提供的evaluatej**ascript所實現。即使用者傳輸的資料,需要將其轉換為字串形式傳遞,同時把轉換後的資料內容拼接成乙份 js 指令碼,再通過執行 js 指令碼的形式傳遞到兩邊獨立環境。

evaluatej**ascript的執行會受很多方面的影響,資料到達檢視層並不是實時的。

1. 頻繁的去 setdata

在我們分析過的一些案例裡,部分小程式會非常頻繁(毫秒級)的去setdata,其導致了兩個後果:

2. 每次 setdata 都傳遞大量新資料

setdata的底層實現可知,我們的資料傳輸實際是一次evaluatej**ascript指令碼過程,當資料量過大時會增加指令碼的編譯執行時間,占用 webview js 執行緒,

3. 後台態頁面進行 setdata

當頁面進入後台態(使用者不可見),不應該繼續去進行setdata,後台態頁面的渲染使用者是無法感受的,另外後台態頁面去setdata也會搶占前台頁面的執行。

目前資源的主要效能問題在於大和長列表上,這兩種情況都有可能導致 ios 客戶端記憶體占用上公升,從而觸發系統**小程式頁面。

在 ios 上,小程式的頁面是由多個 wkwebview 組成的,在系統記憶體緊張時,會**掉一部分 wkwebview。從過去我們分析的案例來看,大和長列表的使用會引起 wkwebview 的**。

除了記憶體問題外,大也會造成頁面切換的卡頓。我們分析過的案例中,有一部分小程式會在頁面中引用大,在頁面後退切換中會出現掉幀卡頓的情況。

當前我們建議開發者儘量減少使用大資源。

在日常開發的時候,我們可能引入了一些新的庫檔案,而過了一段時間後,由於各種原因又不再使用這個庫了,我們常常會只是去掉了**裡的引用,而忘記刪掉這類庫檔案了。目前小程式打包是會將工程下所有檔案都打入**包內,也就是說,這些沒有被實際使用到的庫檔案和資源也會被打入到**包裡,從而影響到整體**包的大小。

(微信小程式)一 初識微信小程式

需要看的 先是檔案目錄 一 pages 他存放於多個頁面 如 index log頁面。可以把他裡面的每個資料夾看成乙個整體。這個整體存放著 html css 和 資料 1 index資料夾 存放的index頁面的目錄。2 index.js 他可以處理得到 ajax 或自定義定義的資料。把得到的值封裝...

微信小程式

2.單獨設定某一頁面下的頂部欄的背景顏色,在其對應的.json檔案下修改即可 3.this.setdata 注意 onload函式下面執行的是非同步操作,非同步操作裡面this.data.直接賦值,是無效的,必須使用this.setdata this.setdata msg he llo wor l...

微信小程式

你好!這是你第一次使用markdown編輯器所展示的歡迎頁。如果你想學習如何使用markdown編輯器,可以仔細閱讀這篇文章,了解一下markdown的基本語法知識。全新的介面設計,將會帶來全新的寫作體驗 在創作中心設定你喜愛的 高亮樣式,markdown將 片顯示選擇的高亮樣式進行展示 全新的ka...