1. 程式人生 > >小程式開發指南之效能優化

小程式開發指南之效能優化

作者:HerryLo

原文永久連結: https://github.com/AttemptWeb/Record...

將從程式碼層面和專案層面,聊一聊微信小程式的效能優化問題,希望有所幫助。也是自己最近的一個總結。(前置知識:微信小程式的檢視層是WebView支援,邏輯層是JSCore支援,邏輯層通過setData與檢視層發生互動。每一個頁面都是一個WebView頁面)詳見:小程式的執行環境

下面的內容不論是使用Taro框架開發,還是微信小程式原生開發,都是適用的。

  • 程式碼層面
    • 拆分元件
    • 圖片壓縮
    • 減少不必要資料
    • 避免頻繁setData
    • 使用webView元件開發
  • 專案層面
    • 拆分小程式
    • 分包預載入
    • 儘量升級版本庫

#程式碼層面

通過程式碼細節提升效能,而且在這方面,空間是非常大的。對於比較早期的小程式專案,由於程式碼細節方面沒有過多的考慮,也導致了開發出的小程式非常的消耗效能。下面將提到的一些點,不論是正在開發的專案,還是在維護的專案,都會有一定的幫助。

相關推薦

程式開發指南效能優化

作者:HerryLo 原文永久連結: https://github.com/AttemptWeb/Record... 將從程式碼層面和專案層面,聊一聊微信小程式的效能優化問題,希望有所幫助。也是自己最近的一個總結。(前置知識:微信小程式的檢視層是WebView支援,邏輯層是JSCore支援,邏輯層通過s

微信程式開發初學者入門步驟和體驗

  在Android 專案不忙之餘,自學了微信小程式入門。常聽前輩說,做一名開發人員最重要的不是你會什麼語言, 而是在面對不會的語言和未接觸過的任務時,有著怎樣的學習力和學習邏輯。彷彿又回到了高三那一段難忘的學習階段,用了小三天時間,可以說是入了個小門。下面將自己踩得坑,和從

微信程式開發手記七:一個程式上線後的總結(上)

終於,經過大概一週時間,磕磕絆絆地提交稽核了,一個移動猿開發小程式,也算有了些心得,也遇到了些坑,這裡和大家一起分享下。 怎麼樣調佈局 先說一個題外話,最後引入正題。 如果翻看過一些資料,大家肯定很容易會發現一件事,那就是關於image標籤的預設寬高,

微信程式開發指南,介面文件,工具下載使用

相信前天,從事網際網路行業人的朋友圈給刷爆了,前微信公眾平臺開始陸續對外發送小程式內測邀請,而小程式即被外界廣為關注的微信“應用號”。 小程式的推出也並非一蹴而就,早在2016年1月的微信公開課上,微信之父張小龍就透露微信即將推出應用號。根據張小龍的描述,應用號的形態大致為

微信程式開發指南

微信小程式入門指南 註冊             註冊需要注意瀏覽器相容問題,紅色的複選框在google瀏覽器是看不到的,360瀏覽器能顯示出來。   開發

微信程式開發手記八:一個程式上線後的總結(下)

今天,說一下專案開發中遇到的一些問題,和一些效果。如果大家遇到了一些效果不好實現的,也可以給我留言,移動猿不怕嘗試。 網路請求該怎麼寫 這個似乎不是個問題,但其實是的,先來看一個請求的程式碼。 wx.request({ url: 'https:

微信程式開發技巧:Flex佈局

轉載原文連結:https://www.cnblogs.com/dragondean/p/5922740.html------------------------------------------------------------------------------微信小程

支付寶程式開發與微信程式不同的地方

前言: 本文僅彙總微信小程式移植支付寶小程式過程中遇到的一些不同的地方,詳細請參考官方開發文件。 網路請求: 對於網路請求,基本上改動不大,也就支付寶小程式沒有responseType屬性及響應碼欄位改成了status。 使用者授權登入: 1. 登入: wx.login   ====&nb

.NET開發效能優化

資料庫效能之表設計   樹表設計:       樹狀表都是使用ID和IDParent兩個欄位來表示樹關係。對樹進行查詢只能使用自關聯方式,不光寫法麻煩而且記錄多的時候查詢效能會非常差。建議在設計樹表的時候可以考慮加入treePa

微擎程式開發0x000

微擎是幹什麼就不說了,自行百度。 微擎開發文件 微擎開發小程式注意事項: 1–微擎官方提供了一個小程式開發的樣例,微擎開發小程式樣例程式碼 先下載這套程式碼 2–開始配置,把php目錄下的we7_wxappsample複製到伺服器微擎框架下的addons目錄下,其實到這裡就相當於給微擎配置了

微信程式開發踩坑tabbar

學習微信小程式中,遇到底部的TabBar不出現的問題。錯誤現象是,專案的app.json使用以下程式碼,卻沒有出現TabBar。 { "pages":[ "pages/clickDemo/clickDemo", "pages/logs/logs", "pages/index/

微信程式開發中的二三事網易雲信IMSDK DEMO

本文由作者鄒永勝授權網易雲社群釋出。 簡介 為了更好的展示我們即時通訊SDK強悍的能力,網易雲信IM SDK微信小程式DEMO的開發就提上了日程。用產品的話說就是: 雲信 IM 小程式 SDK 的能力演示 提供開發者小程式開發參考 換句話說就是在微信裡面通過

微信程式開發小米商城(一)

小程式開發之小米商城Lite 剛接觸小程式不久,感覺相對來說比較簡單,就自己花了五六天做了一個專案,因為本身也是米粉,就看中了小米的微信小程式(可憐國慶擼了幾天的程式碼,哈哈),話不多說,先上效果圖吧。 算了算了。本來還打算上gif圖,但是太難搞了,說明一下吧。

程式設計知識效能優化

本文簡述了一種效能優化中常見的思維誤區 程式開發總是離不開效能優化,雖然規避不成熟優化的箴言早已有之,但我們又往往會被自己翻湧的思維火花所牽絆,義無反顧的開啟自己的效能劣化之旅… 考慮下面的一個簡單問題(以 C# 為例): 編寫一個字串修飾函式:給定一個

微信程式開發記錄(四)位址列傳參true和false的坑

先看看小程式位址列傳參的方法,如下 wxml: <view class="weui-cells weui-cells_after-title" wx:if="{{isNewUser}}"> <navigator url="../addres

web前端進化路(一)——程式開發

最近學習前端感覺很多知識學起來容易,但是很多知識點很容易忘記,想做一個工具來方便自己來學習,正好結合小程式,分享給大家。照顧初學者,可能講的比較細,理解哈。 準備工具 小程式一個 已申請(名稱是:we

基於程式開發的前後端分離登入狀態

公司接了一個小程式的活。本來後臺想用的是session儲存登入狀態。後來發現登入存進去的sessionId和取時候的sessionId不一樣,匯入無法取到登入狀態,百度了一下才知道,原來是小程式端不支援儲存cookie,後來想到了在微信登入授權後,把openId加密(token),當做key,ope

小程式社群】小程式社群提供微信小程式和支付寶小程式相關的資訊、開發教程、開發指南小程式DEMO等資源。小程式開發社群是國內微信小程式和支付寶小程式開發的領先社群,這裡有最新的功能、最全的DEMO、最多的教程和最

小程式社群 小程式社群提供微信小程式和支付寶小程式相關的資訊、開發教程、開發指南、小程式DEMO等資源。小程式開發社群是國內微信小程式和支付寶小程式開發的領先社群,這裡有最新的功能、最全的DEMO、最多的教程和最...

全棧工程師路-中級篇程式開發-第一章第五節從px到rpx

這一小節作為第一章的最後一節,其實關於單位的文章,在部落格上倒是挺多的。 我一直在想,我是不是有必要再寫這一節,還是給大家提供一些閱讀連結。 因為關於單位的定義都是比較官方的。沒什麼好討論的,我這裡做一個彙總和簡單的說明吧。 首先本文只以移動裝置為例說明。 本文摘要:設計師

微信程式開發rpx 的使用說明

最近正著手開發微信小程式,才發現自己差的還是有點遠的。因為在之前的工作中,也都是在閒魚時間通過瀏覽官網api,寫點簡單的demo#hello world#。當我真正去使用它開發專案時,才發現其奧祕頗深。