FinClip 與 uniapp:輕應用平臺與前端開發框架

chendduzi發表於2022-01-04
FinClip 與 uniapp:輕應用平臺與前端開發框架

本文中,我們將會深入地探討 FinClip 與 uni-app 之間的差異,彼此間的長處與弱點。uni-app 是一款很棒的前端應用開發框架,但並不能解決企業數字化轉型,與編寫小程式時面臨的所有問題。

1. 設計區分

uni-app 是為了解決跨端應用研發問題的前端框架

簡單來說,uni-app 是一款為了解決跨端開發問題所設計的前端開發框架,開發者透過 uni-app 所編寫出的一套程式碼,可以釋出到 iOS,Android,H5 平臺之中。

配合 uni-app 官方提供的 IDE 工具 HBuilderX,還可以直接透過第三方小程式開發工具(如微信開發者工具,百度開發者工具等)中的 HTTP 服務,將在 IDE 中編寫的程式碼在第三方開發者工具中進行編譯預覽,打包成對應的小程式資源。

HBuilderX 可在直接調起第三方開發者工具執行小程式 本質上是對小程式開發工具的外部介面呼叫能力

uniMPSDK 是一款執行小程式的前端框架

如果你想在已有的 App 中整合小程式的能力,也可以使用 uni-app 推出的小程式 SDK(官方稱為 uniMPSDK,僅可被用於基於 uni-app 開發的原生應用中)。在 iOS 或 Android 應用中整合對應的 uniMPSDK,也能夠實現維護一套小程式程式碼,在兩種客戶端中執行的效果。

uni 小程式 SDK 介紹文件

此外,uni-app 也為開發者提供了較豐富的生態資源,如 DCloud 官方提供了外掛市場的功能,開發者可以自行根據業務選擇,在自有應用或小程式中整合外掛,也可以成為外掛開發者,上傳共享自研的外掛資源。

經過多年的發展,uni-app 已經具有相當高的成熟度和開發社群資源了,很多開發者可以透過學習 Vue.js 前端語法入手,再加上 uni-app 的幫助,就能快速寫出跨端的移動應用。隨著新推出的 uniMPSDK,開發者也能在自研的移動應用中執行小程式。

但一些原生開發中存在的問題,uni-app 也仍然沒有辦法解決:

  • 對效能的最佳化有限,適合做一些簡單場景下的應用或小程式。想實現複雜場景與業務下的應用還是得靠原生;
  • 維護遷移成本較高,如 uni-app 只能使用官方的雲端打包,部署,統計與廣告聯盟服務,使用第三方服務有較大限制(也能理解,畢竟 uni-app 使用無須付費);

而如果將話題轉到 uniMPSDK(uni-app 提供的小程式 SDK),也存在一些體驗不佳的問題:

  • 必須要使用 uni-app 框架開發小程式才行,不支援執行純 wxml 的微信小程式;
  • 小程式依然採用了 Webview 渲染或者原生渲染(React Native/weex)的技術架構,效能有限;
  • 整合 uniMPSDK 後,App 包的體積可能會增長 7-16Mb 左右;
  • 目前僅支援在 iOS 或 Android 應用中整合 SDK,無法適配其他平臺;

除了官方社群,你可以在許多地方找到使用者的不同聲音。比如在知乎中的這則問答「 」中,就充滿了對 uni-app 的各種聲音。

有網友用「小無相功」描述 uniapp

FinClip 是一款輕應用平臺,也是企業數字化轉型的聯結器

與 uni-app 不同,FinClip 的定位並非一款跨端應用研發框架,而是一款輕應用(小程式屬於輕應用的一個子類)技術平臺,它是由這幾部分所組成的:

  • 一個能執行小程式的安全沙箱(也就是 FinClip SDK),透過嵌入式 SDK 的形態讓移動端軟體、PC 端軟體與物聯網裝置軟體在內的宿主環境整合;
  • 一個應用商店(FinClip 管理後臺)提供應用的發現(陳列、搜尋與推薦)機制、上下架與灰度釋出的管理後臺;
  • 一系列的開發與監控工具(如使用 FinClip IDE 完成程式碼編寫,使用 FinClip App 完成小程式預覽);
您可以在「 」中瞭解產品詳情

透過安全沙箱,應用商店與開發工具的結合使用,開發者可以很愉悅地使用這一系列工具完成小程式的設計與研發(直至後續的生命週期管理)了。

在現實工作中,我們經常遇到的一個問題是 “儘管市面中已經出現了多款小程式平臺(如微信小程式,位元組小程式,百度智慧小程式,支付寶小程式等等),但由於微信的頭部流量地位使然,大多時候我們會先研發微信平臺的小程式,在此之後再根據實際業務場景,選擇將小程式遷移回自有應用中”

在這個過程中,是否需要將小程式一次性上傳至多個小程式平臺的決策,很難在立項一開始就被業務方(或甲方)制定出來。由於市場中“微信”所扮演的國民應用的角色無法在短期內被其他應用取代,大多數企業會在權衡利弊之後,做出這樣的選擇,即“ 先上架微信小程式,隨後再將微信小程式,遷移到自有的移動應用中”,在這個過程裡,還可能涉及透過小程式對已有應用中 H5 業務的改造。

因此,我們關注的內容則會發生這樣的變化:

開發微信小程式 → 將微信小程式遷移到自有應用中 → 某些應用小程式暫時不上架微信,但也需要具備統一的語法與框架,學習與遷移成本不應太高

伴隨著對 FinClip 的瞭解逐漸深入,你會慢慢感覺到 FinClip 與 uniMPSDK 兩者之間的設計思路也不盡相同(uniapp 作為前端開發框架,不再進行對比):

uniMPSDK 與 FinClip SDK 對比

由於 FinClip 更加關注小程式全生命週期的相關事情,我們也將全部的產研精力放在關注 “讓自己 App 中的小程式跑得和微信中小程式一樣順滑”這個問題上,因此不論是 iOS 應用,Android 應用,Flutter 應用,RN 應用,甚至是 Windows 應用程式都可以整合 FinClip SDK,並在其中執行不論是微信小程式,亦或是基於第三方框架設計的小程式。

而透過管理後臺, 我們還可以對小程式的描述資訊(比如頭像,標題),關聯應用(與某個移動應用進行關聯)與小程式版本進行管理,解決小程式熱更新並滿足運營需要。即使開發者不在應用商店中對 App 進行發版更新,我們仍然可以更新小程式資源,只要使用者安裝並開啟了 App,我們就可以根據規則庫的配置實現小程式“千人千面”的功能

2. 實際使用

如同前文所說,由於 uniMPSDK 僅支援基於 uni-app 框架生成的小程式程式碼,因此不妨讓我們嘗試透過 HBuilderX 生成一個第三方小程式 DEMO,看看有哪些區別。

我們首先在 HBuilderX 中選擇了預設 uni-app 模板 建立成功後選擇在微信開發者工具中執行 程式碼可以在微信開發者工具中正常執行 程式碼也同樣可以在 FinClip 的 IDE 中進行正常執行

接下來,再讓我們試試執行一個原生微信小程式,來看看是否能夠在 FIDE 或 uni-app 中執行。

我們在微信開發者工具中選擇 JavaScript 基礎模板 建立成功後即可執行 小程式程式碼也可以在FinClip 的 IDE 中執行 而在 HBuilderX 中,僅能將程式碼編譯為微信小程式

和在 uniMPSDK 官方文件中所介紹的一樣:

  • uni 小程式 SDK 僅支援使用 uni-app 開發的小程式不支援純 wxml 微信小程式執行。但 uni-app 支援使用 wxml 格式的小程式元件;
  • 目前 uni 小程式 SDK 僅支援在原生 App 中整合使用,暫不支援 HBuilderX 打包生成的 App 中整合

這也就意味著:如果你想將已有的微信小程式遷移到自有 App 中進行使用,除非小程式原本就基於 uni-app 進行設計,否則無法使用 HBuilder(uni-app)實現;如果你想在已有的 App 中整合小程式,也只能在原生 App(iOS 或 Android)中整合使用,透過 HBuilderX 所打包出的多端 App 也無法整合對應小程式。

此外,對比管理後臺,我們會發現在 uni-app 中,除了向開發者提供了應用管理(含統計分析)以外,更多提供了圍繞“廣告聯盟,外掛市場,雲打包增值服務,簡訊驗證碼與一鍵登入”功能的增值服務,對於小程式本身所關注的範圍有限。

DCloud 開發者中心

在 FinClip 的管理後臺中,則圍繞小程式,應用,開發與資料統計等功能,提供了完善的小程式全生命流程管理服務。不論是與小程式相關的版本稽核與上下架,灰度釋出的規則制定與實現,還是與安全相關的域名,證照管理,都更加圍繞小程式與應用本身提供對應的服務。

FinClip 管理後臺
小程式上下架為什麼能解決 App 熱更新的問題?

大多數時候,使用者點選 App 中的小程式後,會透過網路服務請求小程式相關的資源,而如果當某個小程式背後的業務出現故障導致不可用的時候,就必須要對 App 進行發版更新,才能解決這個問題。

現在,您可以直接在 FinClip 管理後臺對小程式進行下架操作,對 App 無須做任何改變,使用者點選 App 中的小程式時,會直接提示該應用已經被下架,避免業務故障直接出現在使用者側。

小結

自此,我們初步對比了兩個產品的差別。雖然在首次瞭解產品時,可能會因為產品描述與推廣差異混淆其中的相似與差異,但各位讀者朋友應該感覺到,兩個產品有著根本的不同。

  • uni-app 主要用於解決跨端應用開發問題,透過使用 Vue.js 開發所有前端應用的框架,保證開發者編寫一套程式碼,就可以釋出到多個 App 與小程式平臺中。但無法保證應用的體驗順滑與效能載入問題;
  • uniMPSDK 作為小程式前端框架,僅支援使用 uni-app 開發框架開發的小程式,無法將已有的微信小程式遷移在自有應用中,也不支援在透過 uni-app 匯出的 App 中嵌入小程式;
  • FinClip 是一套小程式生態,透過整合 FinClip 的 SDK 並在後臺中進行操作,開發者可以輕而易舉在自己的 APP 中提供開啟小程式的相關能力。而使用者透過 uni-app 匯出的小程式,也能夠在 FinClip 中進行編譯執行。

3. 根本區別是什麼

我們在前文中對於 uni-app 與 FinClip 作出了初步對比,uni-app 是一款前端應用開發框架,而 FinClip 則是一款輕應用平臺。作為一款前端開發框架,主要的目標就是透過對不同功能的封裝儘可能降低開發者的開發成本,並且提供一套解決方案。

從這個角度來說,uni-app 確實解決了前端應用跨端研發所面臨的問題,在一些展示型或小場景定製專案中,確實能夠大幅度降低前端研發成本,提升人效。當然,市面上也存在試圖解決同樣問題的產品,如更加從底層考慮跨端應用的 Flutter,關注多端小程式統一上架的 Taro,關注小程式格式互相轉換的 Antmove  等等,也都有著與其他產品對比所具備的獨特優勢。

與以上產品不同,在 FinClip 產品架構的設計之初,我們就不承想將產品定義為單純解決跨端(技術棧)應用的解決方案,我們從未侷限於一種開發框架之中,為了聊清楚這個話題,先讓我們來聊聊有點抽象、但是非常重要的部分:FinClip 由哪幾部分組成?

FinClip 由以下三部分組成:

  • 端側
  • 雲側
  • 開發工具

接下來讓我們詳細對這三部分進行介紹。

1. 端側

FinClip 的端側主要由嵌入式執行 SDK 與宿主端兩部分組成。

對於 FinClip SDK 主要有三部分工作需要處理,第一是為了保證小程式程式碼能夠在 App 中完成解釋與渲染執行,變成使用者可讀可見的前端頁面,第二則需要保證相關的業務請求均在安全可控的環境中使用,還需要對於網路請求埠與使用者繫結的 SSL 證照進行校驗,此外還需要透過 SDK 載入相關的小程式外掛。

為了保證小程式程式碼能夠在 App 中被解釋與渲染編譯,我們同步支援了基於 Taro,kbone 或 uni-app 框架生成的全部小程式。不論開發者選擇何種框架開發小程式,最終獲得的小程式都能夠經由 FinClip SDK 在 App 中執行。

宿主端主要是指代的整合 FinClip SDK 的宿主應用,不論我們想在移動應用中執行小程式,想在電腦應用中執行小程式,還是在系統層面天生就自帶執行小程式的能力,都需要在整合 SDK 後才能具備執行小程式的能力。目前 FinClip 已經支援在 iOS、Android 、Windows、國產作業系統(如統信 UOS)、IoT 裝置(如車載系統)中執行小程式了,對於 macOS,Linux,物聯網系統的支援與適配工作也在有條不紊的進行中。

2. 雲側

FinClip 的雲側主要由應用商店與開發者中心(目前為小程式開放平臺)組成。

我們不僅關注讓 App 具備執行小程式的能力,所提供的開發者中心也能夠讓開發者在應用商店中對小程式基礎詳情(如小程式名稱,小程式分類,關鍵詞與描述資訊)進行修改,便於使用者在端側對小程式進行檢索。開發者還可以在雲側中對小程式進行上下架操作,將小程式設定為體驗版進行測試與預覽,根據使用者屬性與身份資訊設定不同的灰度釋出計劃,從而便於終端使用者在不同的網路與環境場景中看到“千人千面”的小程式資訊。

此外,對於企業內部已有多個系統的大型企業客戶,還可以在雲側的管理後臺中對使用者與角色進行設定,根據不同業務線或不同身份為登入後臺的使用者設定對應的角色許可權,或者根據企業內部多種資訊系統之間的統一登入協議完善內部單點登入流程的除錯。從而更好地根據企業內部數字化需要提供所需要的能力。

3. 開發工具

在端側與雲側之外,我們還有豐富的開發工具與生態供開發者進行使用。

如用來完成小程式程式碼編輯與除錯的 IDE 工具,用來完成移動端真機效果預覽的移動開發助手 FinClip App,用來獲取更多小程式資源或相關外掛的小程式應用市場等等。

此外,對於個人開發者使用者,可以免費部署 FinClip 社群版產品,包括小程式 SDK 與管理後臺,管理後臺僅在可以建立的小程式與關聯應用數量上做了少許限制。大部分功能均面向開發者使用者免費提供。

以上這些資源都可以在 FinClip 官網中的資源下載中心,或小程式生態圈中獲取到相關資源。

4. 總結

uni-app 是一款為了解決跨端應用研發問題的前端框架。如果前端開發者習慣於使用 Vue.js 完成各類前端專案的實現,可以很方便地基於 uni-app 生成跨客戶端與跨平臺的小程式應用。小微型專案定製方案商,也可以使用 uni-app 快速完成客戶方的需求,並在此過程中降低自有研發成本,提升研發效率。

FinClip 更加關注小程式本身,不僅提供了跨客戶端,跨系統的小程式執行沙箱,便於客戶在自有 App 中執行已有的小程式,還有著完善的開發者中心,可以幫助開發者對於小程式的全生命週期進行管理與控制。

但我們也有著更為長遠的考慮:在企業數字化轉型的過程中,已有 Web 應用與 H5 應用將不得不面臨需要提升使用者體驗與業務效能的問題,而在轉向透過小程式提供服務的過程中,又需要如何將在流量平臺中已經上架的小程式遷移至自有 App 中?如何讓自有 App 具備執行小程式的底層容器引擎?

我們所提供的小程式解決方案,不僅需要解決企業當下所面臨的“小程式遷移”問題,也需要能夠幫助企業考慮到數年內(甚至更長),而不需要再根據新遇到的問題尋找新的解決方案。

因此,除了小程式本身的執行能力以外,FinClip 還具備對小程式全生命週期進行管理的能力,對於與企業內部已有資訊系統進行關聯,也提供了完成自動化、定製化支援的相關工具與資源,從而能夠更可靠,可信地幫助企業完成數字化轉型這一過程。


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/70011629/viewspace-2850665/,如需轉載,請註明出處,否則將追究法律責任。

相關文章