使用DeviceOne實現微信小程序功能

微信小程序即將推出，還沒推出就火的不行了。基於微信這個巨大平臺，小程序必然能有巨大成功。不過它並不能徹底取代App，該開發App還得開發。若是咱們本身想實現一個基於本身的APP包含相似微信的小程序功能，該如何實現了？咱們先來看看小程序的技術特色。

## 小程序的特色
1. 跨平臺，微信就像JRE，在不一樣操做系統上都有實現，因此微信上的小程序就像運行在JRE上的java程序，從而實現跨平臺。另外解決了多平臺多機型的適配問題。

2. 體驗好，webview加載html是最容易的跨平臺方式，可是在手機上的體驗太差。小程序和web開發，以及h5其實沒有關係了，其ui和運行機制徹底是原生，因此體驗比公衆號強多了。

3. 無需安裝，只需掃描二維碼。其實仍是會有下載了，只不過下載的數據很小，用戶根本察覺不到。好比你開發的小程序有10個頁面，用戶掃描的時候只會下載首頁的幾個文件，可能1k都不到，並且下載完就緩存在本地和內存了。

其實還有一個最大的優勢是微信是巨量用戶的粘度最高的應用了，基於這上面的小程序便於推廣，這裏咱們暫時不談。

咱們再來看看缺點：
1. 只能基於微信入口，這是顯然的，目前獲得的消息是不可能在桌面上有小程序的入口方式，不知道之後是否支持。

2. 只能使用微信應用帶的功能，不能使用其它第三方好比地圖，支付，統計等功能。微信這些功能都有並且作的也很好，可是多元化更有利用長遠的技術發展。

3. 小程序的能力有限，有限的ui和有限的功能不能應付複雜的交互和業務要求。另外開發者也沒法擴展其基礎功能。

DeviceOne能作到既具有以上優勢，也能避免以上缺點，對此你們確定會有所質疑。咱們先簡單介紹一下DeviceOne針對以上幾點對應的說明，再看看一個示例。

## DeviceOne的特色
1. 跨平臺，以js或lua爲開發語言，一次編寫，發佈到android，ios和windows平臺。並且也是自動適配各類機型。

2. 體驗好，從ui到功能，deviceone徹底是原生實現，和html沒有任何關係。因此是原生的體驗效果。

3. 無需安裝，這個咱們能夠從下面的例子再仔細分析。

4. 不是基於一個固定的框架App，也就是說你能夠作一個你本身的微信程序，咱們暫且稱之爲主程序，能夠有本身的圖標，本身的入口，而後加載你本身定義的小程序。包括主程序都是徹底能夠熱升級，就像更新小程序同樣的方便。

5. deviceone把app開發徹底跨平臺組件化了，把開發人員分二部分，開發app的業務開發人員和開發原生組件的原生開發人員。

5.1 開發app的人員不須要懂android和ios，不須要有android和ios開發環境，只須要js就能開發app

5.2 開發組件的人員不須要理解和了解具體app的業務需求，只須要開發能夠複用的跨平臺的ui和功能組件。因此能夠集成任何第三方組件，好比能夠集成百度地圖，也能夠集成高德地圖，能夠集成alipay也能夠集成微信支付。

6. deviceone的組件具備擴展功能，目前官方提供了100多個組件，其它開發者提供了30多個組件，基於deviceone平臺，其它原生開發者能夠不斷的擴展組件商店。

## 相似小程序的示例
先看運行效果圖

這是deviceone動態加載組件API示例的一個應用。咱們稱之爲主程序，自己就是用deviceone開發的。列表中列出的do_App, do_Global之類的都是deviceone的組件，每一個組件對應一個新的程序，是示範這個組件功能的一個小例子，咱們稱之爲小程序，可是本質上和主程序沒有區別。

運行機制很簡單：
1. 程序啓動從一個web服務獲取到一個json，裏面包含多個組件的信息，包括名稱，文件大小，下載小程序的url，文件md5值
2. 比較本地的舊的md5是否和新的md5是否同樣，若是不同，提示有更新，能夠經過點擊更新按鈕下載最新的小程序，這裏沒有使用二維碼掃描下載小程序的首頁，簡單改造就能作到那樣。
3. 點擊一行，打開新頁面，加載小程序，退出頁面，關閉小程序。

基本代碼以下：

 

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

var http = mm("do_Http"); // 顯示等待窗口 var waittingLayer = require("source://modules/waittingLayer/call"); waittingLayer.invoke({     hint : "請稍後" }); var src = "data://" + data.id + ".zip"; http.url = data.url; http.on("result", function(d) {     sm("do_Storage").unzip(src, "data://temp/" + data.id, function(_d, e) {         var updatesrc = "data://temp/" + data.id + "/source/view";         sm("do_App").update([ updatesrc ], "source://view", function() {             sm("do_Page").fire("installed", data.id);             // 隱藏等待窗口             var waittingLayer = require("source://modules/waittingLayer/call");             waittingLayer.invoke({                 close : true             });         })     })   }) http.download(src);

　　

示例的源碼下載已經更多說明參考連接

## 總結
感受是否是很簡單，可是意義很重大，除了小程序更新很容易之外，主程序也很容易更新，原理徹底一致。這能用於2個基本用途。
1. 實現程序的熱更新，deviceone的業務全部邏輯和頁面都是文本文件，包括js代碼和ui文件（json描述），自然更新很是容易。

2. 對應大一點的應用或企業，徹底能夠把業務讓不一樣的開發團隊和部門獨立完成，而後由一個總個框架App來管理，作到應用開發和管理標準化。並且deviceone有強大的雲打包能力，編譯打包也能夠標準管理。

最後要說的是deviceone並非只是一個想法和實踐，它已是正式運營一年多的產品，已經爲互聯網不少我的和公司提供了不少服務，上線了不少面向我的和企業的應用。