微信小程序敏捷開發(fā)實(shí)戰(zhàn)
2021-07-26 10:44:15

?

wxml->wcc編譯->javascript
用戶javascript->

wawebview->view

小程序原理

微信
小程序-》
webview
appservice
native

首次加載cdn
小程序包
冷加載讀取緩存/檢查更新

熱加載直接后臺(tái)切前臺(tái)

ajax請(qǐng)求server
response

webview預(yù)加載

微信小程序以及后臺(tái)交互架構(gòu)

后端服務(wù)

服務(wù)api

web server -》 業(yè)務(wù)應(yīng)用 -》 文件，數(shù)據(jù)庫，緩存
后臺(tái)服務(wù)

后臺(tái)設(shè)備：
lb 負(fù)載均衡

web server 業(yè)務(wù)應(yīng)用服務(wù)器-》分布式存儲(chǔ)-》數(shù)據(jù)庫集群-》緩存集群

serverless 架構(gòu)
無服務(wù)器

image.png

image.png

小程序-》api網(wǎng)關(guān)-》云函數(shù)-》cdb云數(shù)據(jù)庫

小程序通過網(wǎng)絡(luò)api，發(fā)起請(qǐng)求

// 主播
<live-pusher src=""></live-pusher>

// 觀眾
<live-player src=""></live-player>

構(gòu)建直播小程序
申請(qǐng)騰訊云直播服務(wù)
獲取加密私鑰
部署自己的業(yè)務(wù)后臺(tái)
生成開播，播放端地址
開啟小程序

setData優(yōu)化
頻繁setData = 頻繁dom操作
ui延遲
事件延遲

超大數(shù)據(jù)setData
腳本執(zhí)行時(shí)間過大

在后臺(tái)setData
多余的資源消耗
搶占前臺(tái)js執(zhí)行

onhide時(shí)停止數(shù)據(jù)更新

image.png

image.png

微信小程序登錄過程
獲取code

應(yīng)用態(tài)的access_token
/cgi-bin/token
中控cache模塊維護(hù)
cache失效時(shí)間，比如expires_in*5/6
appsecret不要放到前端
session_key不要放前端

開放數(shù)據(jù)域
目的：保證用戶隱私的前提下開放用戶數(shù)據(jù)給第三方
定義：開放數(shù)據(jù)域 是一個(gè)封閉，獨(dú)立的JavaScript作用域

image.png

image.png

image.png

image.png

image.png

image.png

image.png

wxParse富文本的坑
https://github.com/icindy/wxParse

rich-text

wxapp-webpack-plugin

代碼精簡

zanproxy
npm install -g zan-proxy

image.png

image.png

image.png

---

若本號(hào)內(nèi)容有做得不到位的地方（比如：涉及版權(quán)或其他問題），請(qǐng)及時(shí)聯(lián)系我們進(jìn)行整改即可，會(huì)在第一時(shí)間進(jìn)行處理。

---

?

?

?