微信小程序開(kāi)發(fā)一款小游戲的示例分析

這篇文章將為大家詳細(xì)講解有關(guān)微信小程序開(kāi)發(fā)一款小游戲的示例分析，小編覺(jué)得挺實(shí)用的，因此分享給大家做個(gè)參考，希望大家閱讀完這篇文章后可以有所收獲。

如何快速開(kāi)發(fā)一款火爆的小游戲？“火爆”是一個(gè)偏運(yùn)營(yíng)的詞，今天介紹的內(nèi)容可能更傾向于技術(shù)方面，即如何利用微信的開(kāi)放能力開(kāi)發(fā)一款小游戲。小游戲上線120天時(shí)發(fā)布了幾個(gè)重要的消息，其中有幾個(gè)數(shù)字可以用來(lái)描述“火爆”這個(gè)詞。微信小游戲正式允許第三方開(kāi)發(fā)者發(fā)布的時(shí)間是在3月3日，而現(xiàn)在幾款小游戲的用戶已經(jīng)過(guò)億，安卓月流水過(guò)千萬(wàn)的也有數(shù)款小游戲，大家應(yīng)該已經(jīng)體會(huì)到了微信小游戲的火爆程度。

與火爆相關(guān)的兩個(gè)知識(shí)，一個(gè)就是如何開(kāi)發(fā)？首先要利用好微信的社交相關(guān)性，微信去中心化的情景下社交分享互動(dòng)是非常重要的，因?yàn)闆](méi)有傳統(tǒng)流量分發(fā)的總?cè)肟?。第二個(gè)是操作的簡(jiǎn)便性，我們根據(jù)游戲成為爆款游戲后的數(shù)據(jù)才能推出這兩個(gè)結(jié)論，并不是說(shuō)具備這兩個(gè)特性就一定能開(kāi)發(fā)出一款火爆的游戲。

什么是小游戲？

首先為大家介紹一下什么是小游戲：小游戲特指微信小游戲，是小程序的一個(gè)子類目，可在微信內(nèi)被便捷地獲取和傳播，即點(diǎn)即玩，具備出色的用戶體驗(yàn)。在開(kāi)發(fā)的視角來(lái)看，小游戲是一個(gè)基于Canvas/WebGL + 微信社交開(kāi)放能力的新平臺(tái)。在框架上看分為三層，是一個(gè)典型的分層架構(gòu)。微信中有一個(gè)小游戲的Runtime去運(yùn)行小游戲，而OS本身可能會(huì)涉及到不同類的設(shè)備。

如果放大小游戲的Runtime可以看到很多的細(xì)節(jié)，第一就是游戲邏輯，也就是與平臺(tái)無(wú)關(guān)的游戲邏輯的開(kāi)發(fā)。第二部分是游戲引擎，大部分會(huì)用到一些引擎的工作流、一些各種系統(tǒng)封裝好的高層的API。第三部分是weapp，小游戲的框架是參考了webview的框架，但其實(shí)它的底層不是webview，而是webview精簡(jiǎn)優(yōu)化過(guò)的平臺(tái)，小游戲有的只是與核心相關(guān)的一些渲染的API。這里的weapp-adaper是把小游戲的能力適配到與webview更接近的環(huán)境，讓更上層的游戲或引擎本身能夠更快速地集入到平臺(tái)中。

微信的Runtime對(duì)外暴露的都是微信的API，所有的能力都是通過(guò)微信API發(fā)布出去的。底層最基本的能力是渲染相關(guān)的，即Canvas 2d和WebGL。其他一些微信相關(guān)的能力是另外一部，所以小游戲在架構(gòu)上和小程序是有差別的，但用戶體驗(yàn)起來(lái)沒(méi)有太大的區(qū)別。小游戲是沒(méi)有頁(yè)面概念的，在實(shí)現(xiàn)上也不完全是webview，其中不必要的部分已經(jīng)被去掉了。

總的來(lái)說(shuō)小游戲的入口為game.js，游戲可以利用底層的一些能力將游戲的整個(gè)界面繪制出來(lái)。配置文件為game.json主要用來(lái)配置小游戲是橫屏還是豎屏，小游戲的全局對(duì)象game Gobal類似于webview中的window對(duì)象，同時(shí)支持javascript語(yǔ)言。但是小游戲有一個(gè)重要的一個(gè)限制是禁止動(dòng)態(tài)執(zhí)行代碼，開(kāi)發(fā)者必須先提交審核，在審核通過(guò)后才可以上架給普通用戶。另外，小游戲包括引擎的代碼量比較大，所以限制大小比小程序要大，首包限制大小為4M。

下面來(lái)說(shuō)一下Webview Adapter，它的初衷是為了讓游戲開(kāi)發(fā)者更好地熟悉我們的平臺(tái)，所以我們的平臺(tái)在能力上會(huì)盡可能地與webview做一些適配，其實(shí)這個(gè)適配也是很簡(jiǎn)單的一層。比如說(shuō)我們?cè)跒g覽器里面使用image對(duì)象創(chuàng)建一個(gè)圖片，而在小游戲里是通過(guò)wx.createimage來(lái)創(chuàng)建的，在代碼中需要做一個(gè)簡(jiǎn)單的適配。比如說(shuō)Canvas、Document都是在Adapter中實(shí)現(xiàn)的，大家可以研究鏈接中的代碼。其中有一些優(yōu)化的版本，之后官方不會(huì)繼續(xù)維系這個(gè)Adapter，因?yàn)槲覀儠?huì)更專注于底層能力的建設(shè)。如果大家已經(jīng)比較熟悉這個(gè)平臺(tái)的話，就會(huì)比較容易地開(kāi)發(fā)游戲。比如Document這個(gè)對(duì)象在小游戲框架本身中跟普通對(duì)象是沒(méi)有區(qū)別的，它是Adapter做的一個(gè)簡(jiǎn)單的適配。

下圖是小游戲能力的概覽，最近小游戲能力的迭代比較快，部分能力還沒(méi)有羅列出來(lái)。比如最近剛發(fā)布的游戲圈、健康系統(tǒng)相關(guān)的一些接口，都還沒(méi)有列進(jìn)去。我們先看一下基礎(chǔ)能力，在渲染這部分WebGL1.0和Canvas 2D都是支持的，這里的Canvas更接近于瀏覽器里面的標(biāo)準(zhǔn)。同時(shí)，這里提到的可控幀率的概念，如果小游戲在后臺(tái)運(yùn)行的話，可以盡量將幀率降低。在多媒體部分，小游戲還不能像小程序一樣實(shí)現(xiàn)實(shí)時(shí)的音頻視頻流，這是我們?cè)诤罄m(xù)要進(jìn)一步支持的。網(wǎng)絡(luò)IO的部分與小程序也是類似的，我們也提供了一些UI的組件，比如說(shuō)拉起鍵盤，模態(tài)對(duì)話框等。

小游戲的社交開(kāi)放能力現(xiàn)在已經(jīng)對(duì)外開(kāi)放了。其中最重要的一個(gè)能力是開(kāi)放域，將微信的好友關(guān)系列開(kāi)放出去，給開(kāi)發(fā)者一起使用，但也存在著一些限制。因?yàn)樾∮螒蛉ブ行幕奶攸c(diǎn)，分享這一部分也是非常重要的，開(kāi)發(fā)者要考慮如何將這個(gè)能力利用起來(lái)。在代碼方面，因?yàn)槭装拗剖?兆，但部分小游戲的代碼量可能比較大。我們最近也在規(guī)劃一個(gè)分包的能力，異步加載代碼，但這個(gè)代碼是一定要經(jīng)過(guò)我們審核的。

如何開(kāi)發(fā)一款小游戲？

那么如何開(kāi)發(fā)一款小游戲？因?yàn)槲冶救艘仓皇情_(kāi)發(fā)過(guò)一些簡(jiǎn)單的游戲，并不是專業(yè)進(jìn)行游戲開(kāi)發(fā)，所以接下來(lái)我會(huì)更多地介紹一下如何利用微信的能力來(lái)開(kāi)發(fā)小游戲。

選擇小游戲引擎

首先在開(kāi)發(fā)游戲時(shí)要選擇引擎，我們與引擎商也有著比較密切的合作，開(kāi)發(fā)小游戲的引擎一定要是適配的。比如在底層，一開(kāi)始引擎可能只支持原生的游戲，在微信小游戲上就要做一些適配，依賴瀏覽器特有的能力。Cocos Creator、Egret Engine、LayaAir Engine這三個(gè)引擎已經(jīng)支持了小游戲的開(kāi)發(fā)，網(wǎng)上也有相應(yīng)的文章介紹如何發(fā)布到微信小游戲的平臺(tái)。

設(shè)備/環(huán)境適配

有關(guān)設(shè)備管理的適配，小游戲會(huì)有API提供獲取屏幕的寬高、設(shè)備像素比等能力。在小游戲開(kāi)發(fā)完成后，在開(kāi)發(fā)者工具也可以發(fā)起真機(jī)測(cè)試的請(qǐng)求，微信提供了不同設(shè)備的測(cè)試集群，幫助開(kāi)發(fā)者提前去發(fā)現(xiàn)問(wèn)題?；A(chǔ)庫(kù)提供的wx API本身是一個(gè)不斷迭代更新的過(guò)程，對(duì)于使用了新能力的小游戲，需要做低版本兼容。比如在檢測(cè)到不支持新 API的低版本允許有損服務(wù)用戶。同時(shí)，如果某個(gè)低版本的用戶占比較少，可以考慮在管理后臺(tái)直接配置小游戲要求的基礎(chǔ)庫(kù)最低版本，當(dāng)然也意味著這一部分用戶在接觸到這個(gè)小游戲時(shí)，微信客戶端會(huì)彈出一個(gè)要求用戶更新到微信新版本才可使用該小游戲的提示，如果不更新可能就會(huì)失去這個(gè)用戶。

微信登錄

小游戲的登陸過(guò)程與小程序類似，需要用戶自定義登錄狀態(tài)。appsecret/session_key代表的是小游戲開(kāi)發(fā)者和微信平臺(tái)之間的一種信任約定，比如支付、上報(bào)托管數(shù)據(jù)，平臺(tái)方需要驗(yàn)證 access_token，和用戶相關(guān)的還要驗(yàn)證session_key的簽名，才能保證請(qǐng)求來(lái)自于小游戲開(kāi)發(fā)者或用戶。access_token是一種應(yīng)用態(tài)的 access_token，與用戶無(wú)關(guān)，需要保證全局維護(hù)一份，應(yīng)該有一個(gè)中控的模塊去保證 access_token有效，同時(shí)在有效期內(nèi)直接使用本地 cache的 access_token，而不是每次使用都去生成新的 access_token，否則可能遇到調(diào)用頻率限制的錯(cuò)誤而影響服務(wù)。切記 appsecret/session_key不要放到前端代碼中去，否則可能會(huì)被惡意利用從而損壞小游戲開(kāi)發(fā)者或用戶的權(quán)益。

緩存

緩存類型包括數(shù)據(jù)緩存和文件緩存兩種。數(shù)據(jù)緩存即key-value存儲(chǔ)，適合結(jié)構(gòu)化類型的小數(shù)據(jù)存儲(chǔ)，上限為 10MB。文件緩存提供了一個(gè)完整的文件系統(tǒng) API，包括目錄 /文件的增刪改讀，適合針對(duì)經(jīng)常使用的網(wǎng)絡(luò)資源做本地緩存，上限是50MB。

和瀏覽器不同的是，微信只提供了基本的存儲(chǔ)管理能力，并不對(duì)存儲(chǔ)什么以及存儲(chǔ)滿時(shí)刪除什么做一些操作。開(kāi)發(fā)者自行靈活定義緩存及淘汰策略，比如對(duì)經(jīng)常訪問(wèn)的資源存儲(chǔ)到文件系統(tǒng)以及在文件存儲(chǔ)滿時(shí)，清理一些最近不常訪問(wèn)的文件。

開(kāi)放數(shù)據(jù)域

我們來(lái)說(shuō)一下開(kāi)發(fā)數(shù)據(jù)域，也就是在保護(hù)用戶隱私的前提下把用戶的數(shù)據(jù)開(kāi)放給小游戲。這是一個(gè)封閉、獨(dú)立的javascript作用域，開(kāi)放數(shù)據(jù)域是一個(gè)獨(dú)立的目錄，其入口文件是index.js。目前的限制在于僅支持2d渲染模式，數(shù)據(jù)只進(jìn)不出。比如說(shuō)一個(gè)排行榜，它的目的肯定是用來(lái)給用戶看的。

我們簡(jiǎn)單看一下它的實(shí)現(xiàn)方案，左邊是主域。用戶拿到這些數(shù)據(jù)后實(shí)現(xiàn)排行榜其實(shí)也是一個(gè)Canvas。它的區(qū)別在于Canvas不能把數(shù)據(jù)取出來(lái)，無(wú)法分析其中的數(shù)據(jù)是什么。主域里面有一個(gè)Canvas，在微信里上屏Canvas跟屏幕關(guān)聯(lián)，后面都是離線的Canvas，離線的Canvas可以自己根據(jù)需求使用的。一旦開(kāi)放數(shù)據(jù)以后，上屏Canvas不能把里面的數(shù)據(jù)取出來(lái)，下一個(gè)Canvas也不能取出來(lái)，保證了數(shù)據(jù)的安全性。

因?yàn)槲覀兊臄?shù)據(jù)在開(kāi)發(fā)數(shù)據(jù)域中，用戶沒(méi)有辦法進(jìn)行開(kāi)發(fā)。所以要求開(kāi)發(fā)者在開(kāi)發(fā)時(shí)將需要的數(shù)據(jù)托管到我們這里，與用戶關(guān)聯(lián)起來(lái)。這樣就可以在開(kāi)發(fā)數(shù)據(jù)域里面取到相關(guān)數(shù)據(jù)，其應(yīng)用場(chǎng)景有好友排行、群排行榜、超越好友提示等。用戶在輸入的時(shí)候，重復(fù)用戶的所有操作，在上屏的Canvas和離屏的Canvas上就得到了用戶的所有輸入，不會(huì)有開(kāi)放數(shù)據(jù)滲透進(jìn)去。

分享

如果用戶在游戲中達(dá)到了很高的分?jǐn)?shù)，可以與好友PK一下。在自定義轉(zhuǎn)發(fā)的窗口，標(biāo)題和圖片都可以自定義。但是現(xiàn)在有很多小游戲非常騷擾用戶，他們做了很多一定需要分享，才能允許玩游戲的設(shè)定。這是大家需要思考的部分，如何既不影響用戶的體驗(yàn)，又能夠促進(jìn)小游戲的互動(dòng)，在這里需要找到一個(gè)合適的平衡點(diǎn)。同時(shí)，在分享數(shù)據(jù)后將小游戲與這個(gè)群聊關(guān)聯(lián)起來(lái)，我們就可以看到一個(gè)小游戲平臺(tái)。

支付

小游戲是支持虛擬支付的，但目前僅適用于安卓系統(tǒng)中。且它的方式目前只有一種，即貨幣托管的方式。主要分為兩個(gè)流程，一是用戶花錢購(gòu)買游戲幣，這與游戲的服務(wù)端是沒(méi)有關(guān)系的。發(fā)起支付時(shí)微信客戶端會(huì)生成一個(gè)訂單，讓用戶確認(rèn)支付，這是異步的。平臺(tái)負(fù)責(zé)把用戶RMB兌換成對(duì)應(yīng)的游戲幣，存儲(chǔ)到用戶對(duì)應(yīng)的游戲帳號(hào)上。二是使用游戲幣購(gòu)買道具，開(kāi)發(fā)者可以扣除對(duì)應(yīng)的游戲幣，給用戶發(fā)放游戲內(nèi)道具，扣除游戲幣的過(guò)程需要有一定的事務(wù)機(jī)制，保證在網(wǎng)絡(luò)異常的情況下交易正常。扣除游戲幣的接口支持根據(jù)訂單ID去重，意味著在網(wǎng)絡(luò)超時(shí)等情況下，開(kāi)發(fā)者可用同樣的訂單ID去重試扣除，直至返回明確的響應(yīng)。

性能

小游戲常見(jiàn)的性能問(wèn)題，一般是內(nèi)存造成的。如果內(nèi)存占用太多會(huì)被微信客戶端主動(dòng)關(guān)閉，因此開(kāi)發(fā)者在用戶游戲過(guò)程中要及時(shí)釋放不再使用的內(nèi)存，特別是Canvas和Image類的大型對(duì)象，同時(shí)可以主動(dòng)調(diào)用wx.triggerGC觸發(fā)底層回收對(duì)應(yīng)資源。對(duì)于和游戲邏輯相對(duì)獨(dú)立的工作，可以考慮在worker中去實(shí)現(xiàn)，小游戲提供了獨(dú)立的worker線程執(zhí)行js邏輯的能力。

版本更新機(jī)制

小游戲有熱啟動(dòng)和冷啟動(dòng)之分，冷啟動(dòng)是指內(nèi)存中無(wú)該小游戲的運(yùn)行實(shí)例的情況下，啟動(dòng)小游戲的過(guò)程；熱啟動(dòng)是指小游戲的運(yùn)行實(shí)例在內(nèi)存中還存在，只是暫時(shí)切換到了后臺(tái)，這時(shí)用戶再次觸發(fā)小游戲回到前臺(tái)的過(guò)程。在如果用戶點(diǎn)擊啟動(dòng)之后，游戲運(yùn)行時(shí)會(huì)加載出來(lái)這款游戲。在點(diǎn)擊右上角的菜單時(shí)，按紐只是掛后臺(tái)，在一定的時(shí)間內(nèi)再啟動(dòng)時(shí),它會(huì)立即恢復(fù)，這時(shí)內(nèi)存將會(huì)釋放。

小游戲會(huì)在冷啟動(dòng)時(shí)檢查小游戲的版本，如有新版本，在下載回本地后，下一次冷啟動(dòng)即可使用最新版。當(dāng)然，我們也提供了 API可以供開(kāi)發(fā)者決策在有版本可用時(shí)，是否需要強(qiáng)制更新，應(yīng)用最新的版本。

運(yùn)維

管理端提供了發(fā)布、回滾、停服等能力，開(kāi)發(fā)者可以充分利用平臺(tái)的能力。比如在后臺(tái)操作中，js可能會(huì)報(bào)錯(cuò)。腳本錯(cuò)誤主要由運(yùn)行過(guò)程中未捕獲的異常觸發(fā)，該類異常可能會(huì)導(dǎo)致用戶小游戲前端的js邏輯暫停執(zhí)行。同時(shí)，平臺(tái)也提供了完善的數(shù)據(jù)分析服務(wù)，可以通過(guò)小游戲使用助手進(jìn)行數(shù)據(jù)分析。

關(guān)于微信小程序開(kāi)發(fā)一款小游戲的示例分析就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，可以學(xué)到更多知識(shí)。如果覺(jué)得文章不錯(cuò)，可以把它分享出去讓更多的人看到。