本篇文章給大家總結(jié)分享一些小程序開發(fā)中實用的小知識，希望對大家有所幫助！

了解小程序的渲染原理

背景

在網(wǎng)頁開發(fā)中，由于js是單線程的，所以有時候會出現(xiàn)長時間運行腳本，導(dǎo)致頁面失去響應(yīng)。 頁面渲染目前有以下三種方式：

• 純客戶端原生技術(shù)渲染
• 純web技術(shù)渲染
• Hybrid渲染，即web和native渲染相結(jié)合的方式

在小程序中，選擇了Hybrid的渲染方式，將邏輯層和視圖層分開，使用雙線程的方式運行，使用webView渲染視圖層的界面，邏輯層運行在JSCore中。

小程序的雙線程模型：

• 邏輯層：創(chuàng)建一個單獨的線程去執(zhí)行javascript，在這里執(zhí)行的都是有關(guān)小程序業(yè)務(wù)邏輯的代碼，負(fù)責(zé)邏輯處理，數(shù)據(jù)請求，接口調(diào)用。
• 視圖層：界面渲染都在webView線程里執(zhí)行，通過邏輯層代碼控制渲染哪些界面
• jsBridge：使小程序可通過API使用原生的功能

你真的了解appId，uniId，openId之間的聯(lián)系么

openID

openID是微信公眾平臺為用戶同一分配的，眾所周知，微信小程序和微信公眾號都是維護在微信公眾平臺上的，每個公眾號和小程序為了區(qū)分用戶，為每個用戶都生成了唯一的openID

UnionID

UnionID是微信開放平臺給微信用戶分配的ID。 在同一個開放平臺下的應(yīng)用，微信用戶會有唯一的UnionID

比如：你公司有兩個應(yīng)用，小程序A和微信公眾號B，A和B的用戶信息需要打通，可以將A和B兩個應(yīng)用綁定到同一個開放平臺下，微信開放平臺會給微信用戶生成一個唯一的UnionID，在授權(quán)登錄注冊后，將UnionID存儲在用戶表里，以后從同一開放平臺下的其他應(yīng)用授權(quán)登錄拿到UnionID后，就可以直接返回用戶信息，

AppID

AppID是不同應(yīng)用的唯一標(biāo)識

比如：你公司有1個小程序，一個公眾號兩個應(yīng)用，AppId就是這兩個應(yīng)用的唯一標(biāo)識

帶你一起總結(jié)小程序的跳轉(zhuǎn)能力，方便隨時接受領(lǐng)導(dǎo)檢驗

今天一朋友跟我吐槽，他現(xiàn)處于一個中小型公司，老板們在會議室開會，大boss有個問題就是關(guān)于小程序跳轉(zhuǎn)的。一個不知道負(fù)責(zé)哪塊的領(lǐng)導(dǎo)A出來，先是問了運維，然后又問了后端java大大。java大大說這個屬于前端范疇，他們更清楚點，領(lǐng)導(dǎo)A聽后直接說了句，前端知道啥，然后走進會議室，跟大boss反饋，沒人知道。他之前跟我說他們公司前端地位低，這是真的低啊

h5跳轉(zhuǎn)小程序

產(chǎn)品：小羊，我們這個公眾號點擊這個按鈕需要跳轉(zhuǎn)到某某某小程序上去。這個功能必須實現(xiàn)

好咯需求有了，開始給方案唄

• 方案一：點擊按鈕，給個彈框，彈框里放個二維碼。引導(dǎo)用戶長按識別
  • 操作流程場，用戶轉(zhuǎn)化率低，大部分用戶基本上就懶得操作了
• 方案二：使用微信的開放標(biāo)簽wx-open-launch-weapp
  • 可以跳轉(zhuǎn)任意合法合規(guī)的小程序（感覺這個功能后面會有更多限制出來）

經(jīng)過和產(chǎn)品討論，第二種方案更適合點，開整：

步驟：

• 已認(rèn)證的服務(wù)號，服務(wù)號綁定“js接口安全域名”下的網(wǎng)頁可使用此標(biāo)簽跳轉(zhuǎn)任意合法合規(guī)小程序
• 引入js文件?https://res.wx.qq.com/open/js/jweixin-1.6.0.js
• 通過config接口注入權(quán)限配置，并通過openTagList字段申請所需要的開放標(biāo)簽

wx.config({
  debug: false,
  appId: '',   // 公眾號唯一標(biāo)識
  timestamp: '',  // 生成簽名的時間戳
  nonceStr: '',   // 生成簽名的隨機串
  signature: '',  // 簽名
  jsApiList: ["wx-open-launch-weapp"],
  openTagList: ["wx-open-launch-weapp"] // 微信開放標(biāo)簽 小程序跳轉(zhuǎn)按鈕：<wx-open-launch-weapp>
});
// 通過ready處理成功驗證
wx.ready(function () {
  console.log(&#39;ready&#39;)

})
// 處理失敗驗證
wx.error(function(error) {
  console.error("err", error);
});

<wx-open-launch-weapp
  id="launch-btn"
  username="gh_xxxxxxxx"
  path="pages/home/index?user=123&action=abc"
>
  <script type="text/wxtag-template">
    <style>.btn { padding: 12px }</style>
    <button class="btn">打開小程序</button>
  </script>
</wx-open-launch-weapp>

微信客服消息中帶跳轉(zhuǎn)小程序鏈接

文本內(nèi)容....<a href=&#39;&#39; data-miniprogram-appid=&#39;{{appid}}&#39; data-miniprogram-path=&#39;pages/index/index&#39;>點擊跳小程序</a>

• data-miniprogram-appid填寫小程序鏈接，表示跳轉(zhuǎn)小程序
• data-miniprogram-path 小程序路徑，可帶參數(shù)
• 公眾號必須和小程序相關(guān)聯(lián)
• 鏈接中的各個屬性值必須使用單引號

小程序跳轉(zhuǎn)小程序

wx.navigateToMiniProgram({
    envVersion: 'release', // 要打開的小程序版本，develop: 開發(fā)版，trial：體驗版，release：正式版。僅在當(dāng)前小程序為開發(fā)版或體驗版時此參數(shù)有效。
    appId: ’‘, // 跳轉(zhuǎn)appid
    path: ’‘  //  跳轉(zhuǎn)路徑
})

• 需要用戶手動觸發(fā)
• 需要用戶確認(rèn)跳轉(zhuǎn)

【相關(guān)學(xué)習(xí)推薦：小程序開發(fā)教程】

以上是總結(jié)分享一些小程序開發(fā)中實用的小知識的詳細(xì)內(nèi)容。更多信息請關(guān)注PHP中文網(wǎng)其他相關(guān)文章！