微信小程序開發(fā)初始渲染緩存
在小程序中,啟動頁面時邏輯層初始化的時間較長,這會使得用戶看到冷啟動畫面或白屏現(xiàn)象,影響體驗。為了緩解這個問題,我們可以使用初始渲染緩存來提高頁面加載速度。
1. 初始渲染緩存工作原理
小程序頁面的初始化分為兩個部分,邏輯層初始化和視圖層初始化。啟用初始渲染緩存可以使得頁面對用戶可見的時間大大提前,其工作原理包括:
- 在第一個打開頁面時,將頁面初始數據渲染結果記錄下來,寫入一個持久化的緩存區(qū)域;
- 在這個頁面被第二次打開時,直接將渲染結果展示出來,不需要等待邏輯層初始化完畢;
- 如果展示了緩存中的渲染結果,這個頁面暫時還不能響應用戶事件,等到邏輯層初始化完畢后才能響應用戶事件。
2. 支持的組件
在初始渲染緩存階段中,復雜組件不能被展示或不能響應交互。目前支持的內置組件包括:<view />、<text />、<button />、<image />、<scroll-view />、<rich-text />,自定義組件本身可以被展示。
3. 靜態(tài)初始渲染緩存
若想啟用靜態(tài)初始渲染緩存,最簡單的方法是在頁面的 json 文件中添加配置項 "initialRenderingCache": "static",或者在 app.json 的 window 配置段中添加這個配置。此種情況下,緩存記錄的是頁面 data 應用在頁面 WXML 上的結果,不包含任何 setData 的結果。想要在初始渲染緩存中添加動態(tài)內容,則需要使用“動態(tài)”初始渲染緩存的方式。
4. 動態(tài)初始渲染緩存
與靜態(tài)緩存不同的是,在動態(tài)生成初始渲染緩存的方式下,頁面會在后臺使用動態(tài)數據重新渲染一次,因而開銷較大。因而要盡量避免頻繁調用 this.setInitialRenderingCache(),如果在一個頁面內多次調用,僅最后一次調用生效。調用時機不能早于 Page 的 onReady 或 Component 的 ready 生命周期,否則可能對性能有負面影響。如果想禁用初始渲染緩存,則需要調用 this.setInitialRenderingCache(null)。
<本文由himall原創(chuàng),商業(yè)轉載請聯(lián)系作者獲得授權,非商業(yè)轉載請標明:himall原創(chuàng)>
滿足不同行業(yè)發(fā)展電商的需求,HiMall更有針對性的提供不同行業(yè)內的電商解決方案
-
跨境電商解決方案
支持直郵/保稅模式
對接海關/保稅倉
支持多國國際語言
對接Paypal國際支付
幫助跨境外貿企業(yè)搭建跨境進口/出口電商平臺,搶占國際電商市場,針對企業(yè)需求定制個性化跨境電商解決方案 -
分賬解決方案
迎合金融監(jiān)管要求
規(guī)避“二清”結算
節(jié)約平臺財務成本
降低平臺招商成本
在合法、合規(guī)的前提下,為電商平臺提供資金收付、賬戶管理、資金合規(guī)等一體化整體解決方案 -
B2B批發(fā)解決方案
多級階梯批發(fā)價
布局全渠道批發(fā)入口
專屬批發(fā)訂貨市場
銀聯(lián)B2B大額支付
為企業(yè)快速搭建綜合性B2B批發(fā)電商平臺,整合線下批發(fā)資源,拓展線上批發(fā)渠道,實現(xiàn)批發(fā)業(yè)務24小時在線經營
-
MRO工業(yè)品采購平臺系統(tǒng)|MRO工業(yè)品采購平臺系統(tǒng)有哪些功能
最新消息:MRO工業(yè)品采購平臺系統(tǒng) 是一款集產、研、銷于一體的綜合性解決方案,專為解決工業(yè)品企業(yè)的采購難題而設計。該系統(tǒng)通過...詳情
-
電子元器件采購商城系統(tǒng)|電子元器件采購商城系統(tǒng)有哪些功能
最新消息:電子元器件采購商城系統(tǒng) 是專為滿足電子元器件行業(yè)復雜業(yè)務流程需求而設計的綜合性平臺。它不僅提供了全面的技術支持...詳情
【本站聲明】
1、本網站發(fā)布的該篇文章,目的在于分享電商知識及傳遞、交流相關電商信息,以便您學習或了解電商知識,請您不要用于其他用途;
2、該篇文章中所涉及的商標、標識的商品/服務并非來源于本網站,更非本網站提供,與本網站無關,系他人的商品或服務,本網站對于該類商標、標識不擁有任何權利;
3、本網站不對該篇文章中所涉及的商標、標識的商品/服務作任何明示或暗示的保證或擔保;
4、本網站不對文章中所涉及的內容真實性、準確性、可靠性負責,僅系客觀性描述,如您需要了解該類商品/服務詳細的資訊,請您直接與該類商品/服務的提供者聯(lián)系。