網(wǎng)易云音樂 RN 低代碼體系建設(shè)思考與實踐

      后臺-系統(tǒng)設(shè)置-擴(kuò)展變量-手機(jī)廣告位-內(nèi)容正文頂部

      Tango 是一個用于快速構(gòu)建低代碼平臺的低代碼設(shè)計器框架,并以源代碼為中心,執(zhí)行和渲染前端視圖,并為用戶提供低代碼可視化搭建能力,用戶的搭建操作會轉(zhuǎn)為對源代碼的修改。借助于 Tango 構(gòu)建的低代碼工具或平臺,可以實現(xiàn) 源碼進(jìn),源碼出的效果,無縫與企業(yè)內(nèi)部現(xiàn)有的研發(fā)體系進(jìn)行集成。
      開源情況
      目前 Tango 設(shè)計器引擎部分已經(jīng)開源,正在積極推進(jìn)中,可以通過如下的信息了解最新進(jìn)展:
      • Github 倉庫:https://github.com/NetEase/tango
      • 文檔站點:https://netease.github.io/tango/

      本文主要探討基于 Tango 低代碼在 RN 場景如何打造一套標(biāo)準(zhǔn)低碼研發(fā)體系。
      為什么選擇 RN 作為跨端方案
      主流的跨端方案,建全的社區(qū)生態(tài)
      RN(React Native)是 Facebook 開發(fā)的一種基于React框架的移動應(yīng)用開發(fā)框架。它可以用于同時開發(fā) iOS 和 Android 平臺的跨平臺移動應(yīng)用程序。

      在 npm trends 上可以看到,RN 每周的下載次數(shù),穩(wěn)固上升,相比5年前,下載量已經(jīng)翻了接近10倍之多,Github Star 數(shù)量也來到了 110K 之多,擁有非常龐大的社區(qū)生態(tài)。
      React 生態(tài)圈,支持動態(tài)更新
      RN 上手成本較低,對于前端開發(fā)同學(xué),React 技術(shù)棧可以無縫遷移,學(xué)習(xí)成本較低,對于客戶端同學(xué),RN 方案省去了大量編譯的時間,相比于傳統(tǒng)的原生開發(fā),RN 可以大大減少代碼重復(fù),提高開發(fā)效率。此外提供了豐富的組件庫和API,開發(fā)者可以使用這些組件和API快速構(gòu)建用戶界面和實現(xiàn)各種功能。同時,RN還具有良好的性能表現(xiàn),可以輕松實現(xiàn)原生應(yīng)用的用戶體驗。
      在國內(nèi),無論大公司、小公司都鐘情于應(yīng)用的動態(tài)更新。因為動態(tài)更新能降低產(chǎn)品的試錯成本。如果產(chǎn)品策略有調(diào)整,可以立馬上線,線上有小問題也可以快速修復(fù)。但能夠既滿足動態(tài)更新,又能跨端,還能滿足復(fù)雜業(yè)務(wù)需求的只有 JavaScript 語言。
      新架構(gòu)開啟全新時代
      2022 年,對于 React Native 來說是一個大年,因為重構(gòu)已久的 React Native 新架構(gòu)已經(jīng)確定會在今年正式推出,相對于老架構(gòu),新架構(gòu)在最關(guān)鍵的性能問題上有了非常大的提升,這將會為 React Native 開啟一個全新的階段。

      React Native 新架構(gòu)默認(rèn)用的 JavaScript 引擎是 Hermes 引擎。Hermes 是一款專為移動端打造的 JavaScript 引擎,它支持 JavaScript 的 AOT 預(yù)編譯。帶來了更好的啟動性能,此外在渲染機(jī)制,通信性能上均有成倍的提升,云音樂也第一時間進(jìn)行了“嘗鮮”,詳細(xì)遷移過程見:網(wǎng)易云音樂 RN 新架構(gòu)升級實踐。
      云音樂 RN 研發(fā)現(xiàn)狀
      RN 有著眾多優(yōu)勢,云音樂也有相當(dāng)多的 RN 需求,在需求不斷地迭代,研發(fā)不斷地投入過程中,還是暴露了一些問題。回顧一下 C 端場景的特點,往往是
      重視覺,重交互
      ,我們來看一下目前 介入一個 RN 需求開發(fā)并最終交付上線的核心過程:
      研發(fā)過程
      準(zhǔn)備開發(fā)環(huán)境
      • Mac 電腦 / 手機(jī)設(shè)備 (依賴物理設(shè)備)
      • App 測試包 (依賴客戶端打包)
      • 模擬器 & XCode & ... (依賴運行環(huán)境)
      • RN Debugger (依賴調(diào)試工具)
      • RN 開發(fā)相關(guān)文檔 & 平臺 (依賴多個平臺跳轉(zhuǎn))
      • 編輯器 IDE

      靜態(tài)頁面開發(fā) & 還原視覺(交互)稿

      如圖所示,開發(fā)第一階段,還原設(shè)計稿,這個過程其實可以追溯到需求評審階段:設(shè)計稿的頁面構(gòu)成,哪些已有現(xiàn)成組件,哪些需要定制開發(fā),樣式部分的代碼如何編寫等。
      進(jìn)入業(yè)務(wù)開發(fā)階段
      不同場景的 RN 需求對應(yīng)的實際業(yè)務(wù)開發(fā)有所不同,以下三種是最為常見的業(yè)務(wù)開發(fā)類型。
      • 埋點開發(fā): 頁面曝光埋點,點擊播放埋點等,需要開發(fā)者手動注入埋點,進(jìn)行上報。
      • 數(shù)據(jù)獲取: 例如獲取歌曲列表接口,編寫代碼獲取數(shù)據(jù),組件消費數(shù)據(jù)。其實這個過程往往是會被開發(fā)者忽略的環(huán)節(jié),假設(shè)某個業(yè)務(wù)場景消費的是相同的數(shù)據(jù)和邏輯,那么這時候我們可能有兩個選項:復(fù)制之前的代碼,或是將其封裝為工具包或者耦合至組件進(jìn)行復(fù)用。
      • 協(xié)議調(diào)用: 音視頻播放等客戶端協(xié)議調(diào)用聯(lián)調(diào),需查閱相關(guān)協(xié)議文檔或工具組件文檔。

      項目驗收/測試
      • 視覺反復(fù)修改驗證,多主題驗證,多機(jī)型驗證 (開發(fā))
      • 雙端兼容性,多主題適配性 (開發(fā) / 視覺)
      • 視覺驗收頁面還原度 (視覺 / 策劃)
      • 業(yè)務(wù)方驗收整體功能(QA / 策劃)

      較高的研發(fā)成本
      • 相對 H5 應(yīng)用,RN 應(yīng)用本地開發(fā)環(huán)境較重,依賴較多。
      • 頁面靈活度高,需要熟悉現(xiàn)有組件體系,識別組件,還原視覺。
      • 研發(fā)鏈路周邊生態(tài)零散,未整合,開發(fā)時平臺跳轉(zhuǎn)重,鏈路長。
      • 相同業(yè)務(wù)邏輯代碼跨項目復(fù)用率低,未得到有效處理。
      • ...

      我們期望構(gòu)建一套為低碼為中心的在線研發(fā)體系,通過整套體系標(biāo)準(zhǔn)化來解決目前的問題,降低研發(fā)成本和門檻,提高效能

      標(biāo)準(zhǔn)化的低碼研發(fā)體系
      研發(fā)鏈路前后對比
      RN 迭代從需求到交付涉及到多個核心環(huán)節(jié),以下是目前開發(fā)現(xiàn)狀和低碼研發(fā)體系的對比。

      Tango 將提供以源碼為中心的 RN 在線搭建能力,支持 RN 應(yīng)用快速交付,并提供標(biāo)準(zhǔn)化的線上研發(fā)流程

      傳統(tǒng)移動端搭建的問題和瓶頸
      云音樂在移動端傳統(tǒng)搭建上已經(jīng)有了一些實踐,但是在實際使用過程中遇到了一系列的問題。
      DSL 方案局限性
      首先傳統(tǒng)搭建平臺大多基于 DSL 驅(qū)動,再交由 DSL 解析器進(jìn)行渲染,映射到對應(yīng)的組件。DSL 本質(zhì)上其實就是對代碼的一種抽象,描述為一種 Schema 的形式進(jìn)行可視化編排,
      最終還是要映射到真實的組件,組件消費 DSL 中攜帶的信息

      如果面向
      業(yè)務(wù)模式穩(wěn)定的固化場景,進(jìn)行深度垂直定制
      ,在這個前提下一套 DSL 確實可以解決大部分場景,剩下的場景可以直接放棄(交由開發(fā)介入)。
      但是移動端場景的特點就是
      靈活性高
      ,而此類產(chǎn)品的特點往往
      面向運營等非開發(fā)角色進(jìn)行無碼搭建,快速交付。
      在實際使用過程中,會遇到
      DSL無法滿足業(yè)務(wù)需求,需要開發(fā)介入定制DSL,升級組件
      的情況。
      這個過程中其實帶來了較大的成本:
      • 搭建平臺基于 DSL 驅(qū)動,隨著業(yè)務(wù)的迭代,DSL 需要不斷升級以滿足需求的變化。
      • DSL 的版本迭代和規(guī)范需要嚴(yán)格遵守,對應(yīng)組件庫和解析器等中間件的維護(hù)仍需要投入開發(fā)資源。
      • DSL 映射為客戶端組件時,DSL 的變更依賴客戶端迭代,存在隱形風(fēng)險,且容易出現(xiàn)。RN 對應(yīng)一套標(biāo)準(zhǔn)客戶端組件庫,DSL 對應(yīng)另一套客戶端組件庫的情況,維護(hù)成本非常高,侵入性強(qiáng)。
      • 面向運營,最后很大概率是研發(fā)進(jìn)行兜底開發(fā),逐漸降低使用意愿。

      基于 AST 驅(qū)動
      Tango 通過 AST 驅(qū)動,可視化的修改實際上就是對源碼進(jìn)行修改,對源碼的直接修改其實就跳過了 DSL 映射到源碼的過程,這樣做的好處是,沒有中間產(chǎn)物的形成,不需要額外的開發(fā)資源維護(hù),也不會耦合至其他環(huán)境,可以跟現(xiàn)有的 云音樂 RN 研發(fā)生態(tài)較好的融合。所以
      Tango 主要面向研發(fā)同學(xué),解決靈活場景下的 RN 開發(fā),側(cè)重對研發(fā)環(huán)節(jié)進(jìn)行提效

      在一些輕量場景,也可以作為 NoCode 平臺,提供運營同學(xué)可視化搭建的能力。

      從上圖可以看出:無論 DSL 還是 AST,最終都是映射到實際的組件,
      組件能力的強(qiáng)大與否會直接影響整個低碼體系,以及需求交付的效率。組件,是非常重要的!
      構(gòu)建在線真機(jī)預(yù)覽調(diào)試環(huán)境
      RN 和 Web 應(yīng)用在線開發(fā)最大的區(qū)別在于
      運行環(huán)境的不同
      ,Web 場景可以基于 CodeSandbox 實時預(yù)覽,RN 場景依賴 App 物理環(huán)境。
      常見的 RN 應(yīng)用調(diào)試環(huán)境:

      目前云音樂 RN 研發(fā)主要使用模擬器 + 真機(jī)掃碼兩種形式進(jìn)行開發(fā),起步我們考慮了相對輕量的方案:RN


      目前云音樂 RN 研發(fā)主要使用模擬器 + 真機(jī)掃碼兩種形式進(jìn)行開發(fā),起步我們考慮了相對輕量的方案:
      RN For Web 進(jìn)行初步搭建及預(yù)覽,再結(jié)合真機(jī)掃碼進(jìn)行實際聯(lián)調(diào)
      ,這樣做的好處是在設(shè)計器運行沙箱上可以復(fù)用現(xiàn)有 CodeSandbox 能力,不需要做定制,但該方案馬上
      暴露了一系列問題
      • 現(xiàn)有組件并非均兼容 RN Web,接入存在較大適配成本,收益低
      • Web 環(huán)境無法模擬真機(jī)環(huán)境,協(xié)議無法調(diào)用,無法滿足實際開發(fā)場景
      • RN Web 與真機(jī)視覺還原度存在一定差異,視覺存在二次回歸成本
      • ...

      綜上,選用 Mac IOS 模擬器作為
      真機(jī)運行環(huán)境,完美貼合本地開發(fā)體驗
      。也帶來了更大的挑戰(zhàn),我們需要
      模擬一套在線開發(fā)環(huán)境(遠(yuǎn)程本地開發(fā))
      :
      1. 代碼在哪里運行 ?
      2. 模擬器在哪里運行 ?
      3. 頁面如何獲取模擬器界面 ?
      4. 多人使用模擬器如何分配調(diào)度 ?
      5. 頁面如何與模擬器通信交互 ?
      6. App 內(nèi)置的聯(lián)調(diào)工具如何使用 ?
      7. RN 運行日志如何透出 ?
      8. 與低代碼平臺怎么結(jié)合 ?

      下面我們來具體看一下如何解決這些問題。
      Metro 遠(yuǎn)端構(gòu)建服務(wù)

      首先我們來解決第一個問題,回顧一下本地開發(fā)過程:啟動 RN 項目,通過模擬器或者真機(jī) App 訪問 RN bundleUrl 進(jìn)行調(diào)試預(yù)覽,本地啟動的 dev server 其實就是打包服務(wù)(metro dev server),產(chǎn)物為:

      xx://10.10.10.10:8081/index.ios.bundle
      

      那么遠(yuǎn)端構(gòu)建其實就是將本地流程容器化:拉取項目代碼,構(gòu)建打包,輸出產(chǎn)物。如圖所示:


      那么遠(yuǎn)端構(gòu)建其實就是將本地流程容器化:拉取項目代碼,構(gòu)建打包,輸出產(chǎn)物。如圖所示:

      在低碼平臺初始化時將完整的代碼推送至構(gòu)建服務(wù),構(gòu)建服務(wù)分配一個實例進(jìn)行上述構(gòu)建過程,平臺或者手機(jī)訪問打包產(chǎn)物即可,代碼變更時 patch 最新代碼,觸發(fā) HMR 熱更新即可。
      基于直播流的模擬器投屏方案
      模擬器運行環(huán)境
      接下來第二個問題,模擬器運行環(huán)境可以使用 Mac 系列設(shè)備,包括不限于 Mbp,Mac mini,Mac Studio 等均可,在 Mac 物理機(jī)上對模擬器進(jìn)行多開,實際可以并發(fā)啟動的數(shù)量與設(shè)備性能正相關(guān),相同規(guī)格的設(shè)備,推薦使用 ARM 架構(gòu)的設(shè)備,性能會更加好。接下來對應(yīng)第三個問題就是如何將模擬器的畫面?zhèn)鬏斨另撁妗?br />圖傳方案/投屏方案對比
      社區(qū)方案,Expo Snack dev,支持真機(jī)預(yù)覽 & Web 兩種形式。

      Expo 真機(jī)界面通過實時圖傳的方式進(jìn)行返回 (如下圖所示),我們也進(jìn)行了類似方案的實踐,實踐結(jié)果是
      在 20 ~ 30FPS 幀率下實時截屏圖傳返回至 Web 再顯示,Socket 存在時序和堆積問題,造成畫面時序不一致且閃爍嚴(yán)重


      其實還有一種方式可以獲取到屏幕的實時畫面,**通過直播推流的形式,將物理屏幕進(jìn)行捕獲推流,網(wǎng)頁拉流播放即可,也就是傳統(tǒng)意義上的"直播"**。
      起初使用 ffmpeg 進(jìn)行畫面捕獲并推流,但由于同一臺物理機(jī)上會多開模擬器,并且存在遮擋問題,模擬器窗口的定位,寬高的識別成本較高
      ffmpeg -f x11grab -video_size 1280x720 -i :0.0+100,200 -f alsa -i default -c:v libx264 -preset ultrafast -pix_fmt yuv420p -c:a aac -f flv rtmp://your-streaming-server-url/your-stream-key
      

      最終采用 OBS 進(jìn)行窗口捕獲及推流,OBS 優(yōu)勢:自帶窗口捕獲,畫布調(diào)整,完整的推流參數(shù)配置,以及內(nèi)置 Web Socket 服務(wù)器可以進(jìn)行直播控制


      OBS 低延遲直播方案

      常見的直播方案如下:



      由于云手機(jī)交互時效性要求,需要一套
      低延遲直播方案
      ,經(jīng)過綜合對比:
      選用 SRS 流媒體服務(wù)器進(jìn)行轉(zhuǎn)碼,使用 OBS RTMP 進(jìn)行推流,Web 使用 WebRTC 進(jìn)行拉流得到云手機(jī)實時畫面。
      SRS 服務(wù)器
      SRS是一個開源的(MIT協(xié)議)簡單高效的實時視頻服務(wù)器,支持RTMP、WebRTC、HLS、HTTP-FLV、SRT、MPEG-DASH和GB28181等協(xié)議。SRS媒體服務(wù)器和FFmpeg、OBS、VLC、 WebRTC等客戶端配合使用,提供流的接收和分發(fā)的能力,是一個典型的發(fā)布 (推流)和訂閱(播放)服務(wù)器模型。SRS支持互聯(lián)網(wǎng)廣泛應(yīng)用的音視頻協(xié)議轉(zhuǎn)換,比如可以將RTMP或SRT, 轉(zhuǎn)成HLS或HTTP-FLV或WebRTC等協(xié)議。

      使用官方 Docker 鏡像,一鍵啟動。詳見 SRS 官方文檔。

      CANDIDATE="192.168.1.10"
      docker run --rm -it -p 1935:1935 -p 1985:1985 -p 8080:8080 \
          --env CANDIDATE=$CANDIDATE -p 8000:8000/udp \
          registry.cn-hangzhou.aliyuncs.com/ossrs/srs:5 ./objs/srs -c conf/rtmp2rtc.conf
      

      OBS 推流與拉流


      接下來對 OBS 進(jìn)行一定的配置,Mac 設(shè)備優(yōu)先選用 H264 硬件編碼進(jìn)行推流,碼率和幀數(shù)控制在一定范圍,推流地址設(shè)置為 rtmp://{your_ip}/live/{your_livestream_key} 即可。
      網(wǎng)頁端使用 WebRTC 播放器進(jìn)行拉流,
      WebRTC(Web Real-Time Communications)是一項實時通訊技術(shù),它允許網(wǎng)絡(luò)應(yīng)用或者站點,在不借助中間媒介的情況下,建立瀏覽器之間點對點(Peer-to-Peer)的連接,實現(xiàn)視頻流和(或)音頻流或者其他任意數(shù)據(jù)的傳輸。
      對 WebRTC 還不太熟悉的同學(xué)可以詳細(xì)閱讀一下 Web RTC API。
      效果如圖所示,
      平均響應(yīng)速度在 0.5s 至 2s 內(nèi)


      至此,我們已經(jīng)獲取到實時畫面,模擬器搖身一變成為
      云手機(jī)
      ,接下來的核心問題:
      解決云手機(jī)的通信和交互,以及多臺云手機(jī)如何調(diào)度分配的問題

      基于 Socket 網(wǎng)關(guān)的云手機(jī)調(diào)度 & 通信交互方案
      基于調(diào)度中心的通信機(jī)制
      首先解決如何分配的問題,場景是:用戶訪問低碼平臺時,需要使用一臺云手機(jī),而一臺物理機(jī)上可以啟動多臺云手機(jī),并可以同時有多臺物理機(jī),需要正確的分配到一臺設(shè)備。
      有同學(xué)可能發(fā)現(xiàn)了,這個模式非常像"反向代理",那么順著這個思路,我們需要實現(xiàn)一個
      虛擬網(wǎng)關(guān),負(fù)責(zé)通信和調(diào)度
      ,我們來看一下大致過程:
      • 將物理機(jī)中的設(shè)備主動上報到調(diào)度中心,并建立 Socket A,上報的設(shè)備存儲在一個"虛擬設(shè)備池"中。
      • 調(diào)度中心對低碼平臺暴露一個 /lock 接口,從設(shè)備池中獲取可用設(shè)備并占用,返回占用的設(shè)備信息,同步設(shè)備池狀態(tài),完成分配。
      • 低碼平臺與云手機(jī)建立 WebRTC 連接,獲取到屏幕實時畫面。

      這里還有一個問題,
      如何保證高并發(fā)下云手機(jī)與用戶的一致性
      (不會出現(xiàn)同一個設(shè)備被重復(fù)分配的問題), 服務(wù)端的同學(xué)應(yīng)該非常熟悉這個場景,關(guān)鍵詞如:"庫存","超賣","秒殺",”搶票“,“下單”,“抽獎”等場景均會涉及到這個問題,
      我們可以通過加鎖來保證資源訪問的單一
      ,如 Redis 分布式鎖,感興趣的同學(xué)可以自行查閱一下相關(guān)資料。
      此時用戶已經(jīng)分配到云手機(jī),且可以看到實時畫面。接下來就要解決如何通訊的問題,既然是通訊那么肯定首選長連接,我們需要與云手機(jī)建立
      Socket B
      ,該 Socket 可以將頁面的消息發(fā)送至云手機(jī) App 并將 App 中的數(shù)據(jù)返回至平臺。上述流程如圖所示:

      此時云手機(jī)通訊機(jī)制已經(jīng)建立,我們可以請求云手機(jī)加載某個 RN 頁面,但此時云手機(jī)無法"使用",云手機(jī)需要支持基本的
      點擊/滑動
      交互:

      在線調(diào)試能力
      基于已經(jīng)建立的通訊連接,我們可以遠(yuǎn)程"操控"云手機(jī)并獲取到 App 中運行的信息以及日志,在平臺側(cè)進(jìn)行展示,為在線聯(lián)調(diào)提供了
      通道
      ,目前主要開放了以下幾個能力:

      快捷工具欄:
      為了還原本地開發(fā)體驗,我們將調(diào)試工具中常用的能力進(jìn)行了可視化,在云手機(jī)一側(cè)提供了工具欄,進(jìn)行快速使用。
      運行狀態(tài)欄:
      在底部狀態(tài)欄的左側(cè)顯示了目前云手機(jī)的設(shè)備信息以及當(dāng)前 App 的信息。
      日志信息欄: 顯示當(dāng)前
      warning
      ,
      error
      的數(shù)量,點擊后展開 Console 面板,查看當(dāng)前 Metro 日志信息,對齊 Chrome Console 體驗。
      • 至此,前文提到在線開發(fā)的7個問題均已解決,我們來看最后一個問題,如何與低碼進(jìn)行結(jié)合

      多維度的可視化搭建
      模擬節(jié)點選中效果,結(jié)構(gòu)樹可視化編排
      在 C 端場景 Tango 也保持了社區(qū)常見的交互形式,通過頁面結(jié)構(gòu)樹面板可以對頁面中的節(jié)點進(jìn)行增刪改查,調(diào)整位置等操作。
      常見交互為大綱樹和設(shè)計器都需要在點擊后回顯選中的節(jié)點,由于 RN 代碼實際運行在客戶端中,此處就帶來了另一個問題:
      靜態(tài)的 RN 代碼節(jié)點與客戶端運行時的節(jié)點如何映射
      ,確實是一個比較有趣的問題,我們可以延續(xù)之前模擬點擊交互傳的思路,大致如下:

      通過標(biāo)記節(jié)點,客戶端計算返回選中的節(jié)點坐標(biāo)寬高信息,模擬選中框覆蓋在云手機(jī)上,達(dá)到選中的效果。
      雙模式切換,源碼模式左看右寫快速開發(fā)
      對于專業(yè) RN 開發(fā)同學(xué),或復(fù)雜場景需切換至源碼進(jìn)行開發(fā),我們也對源碼模式下的開發(fā)體驗進(jìn)行了增強(qiáng),提供"左看右寫"的模式,結(jié)合完善的在線調(diào)試工具,典型場景下,
      可以完全脫離本地開發(fā)環(huán)境,使用線上進(jìn)行開發(fā)。

      多形式的代碼生成

      Tango 本質(zhì)上基于
      源碼驅(qū)動
      ,在 CMS B 端場景,CRUD 類型的頁面可以通過數(shù)據(jù)模型驅(qū)動來快速初始化一個可用頁面。
      由于 C 端場景的高靈活度,開發(fā)時大部分時間是在還原樣式,實現(xiàn)靜態(tài)頁面。通過 D2C AIGC 模板市場等能力可以對設(shè)計稿,典型場景進(jìn)行快速還原并得到初始代碼,再結(jié)合低碼平臺進(jìn)行二次搭建,來降低從 0 搭建成本。
      低碼生態(tài)建設(shè)
      Tango 低碼的理念不僅限于"在線","可視化搭建",
      旨在構(gòu)建一個以源碼為中心,完整的低碼研發(fā)生態(tài)體系

      運行時框架 & 組件
      低碼接入的組件能力完善與否也直接
      影響開發(fā)搭建效率
      ,我們針對典型場景使用的高頻組件進(jìn)行細(xì)分,對此類組件進(jìn)行"低碼化"增強(qiáng),減少原子組件重復(fù)低效使用的問題。
      此外 Tango RN 也延續(xù)了 Tango Boot 的應(yīng)用架構(gòu)推崇 View-Model-Service 三層模型,演化為 Tango RN Boot 應(yīng)用框架,其中模型層定義了 Observable States,視圖層觀察 Model 的變化而進(jìn)行自動更新,服務(wù)層用來創(chuàng)建一組服務(wù)函數(shù),供視圖層和模型層消費。基于 Tango MVVM 理念,Tango RN Boot 在 Stores & Services 以外,對 RN 常見開發(fā)能力進(jìn)行封裝,讓開發(fā)者可以快速構(gòu)建 RN 應(yīng)用。

      數(shù)據(jù)資產(chǎn)沉淀與可視化編排
      • 這里先挖個坑,后續(xù)會有專門的文章詳細(xì)介紹。

      云手機(jī)還能做什么
      云手機(jī)顧名思義就是取代了物理手機(jī),目前依賴物理手機(jī)的場景大部分都可以通過云手機(jī)進(jìn)行平替,并且由于云手機(jī)擁有建全的
      通信機(jī)制,交互能力
      ,可以暢享更多的可能性,以下羅列了一些比較常見的應(yīng)用場景:
      • 掃碼場景

      所有掃碼類的場景都可以接入云手機(jī)進(jìn)行效果預(yù)覽,通過云手機(jī)代替真實手機(jī)訪問掃碼結(jié)果。
      • 協(xié)議調(diào)用/服務(wù)化

      客戶端協(xié)議可以通過云手機(jī)進(jìn)行遠(yuǎn)程聯(lián)調(diào)調(diào)用,測試協(xié)議調(diào)用情況,可以借助云手機(jī)作為運行容器將協(xié)議的調(diào)用服務(wù)化,包裝為 API 接口供三方平臺使用。
      • 視覺驗收

      可以使用云手機(jī)來查看應(yīng)用程序在不同設(shè)備和屏幕尺寸上的顯示效果,并確保界面元素的布局、顏色和交互行為的一致性。
      • 測試回歸

      可以用于測試回歸,測試團(tuán)隊可以使用云手機(jī)來運行自動化測試腳本,執(zhí)行一些特定的任務(wù)。
      低碼的天平問題
      篇幅較長,如果您看到這里了,非常感謝,希望能給各位帶來一些收獲。最后還是想聊一點題外話,市面上大大小小的"低碼"產(chǎn)品非常多,包括不限于各種
      可視化搭建平臺,(X)aaS平臺,代碼插件工具
      等。
      低碼理念的出現(xiàn)本質(zhì)上是為了解決某個(類)問題或某個(些)場景。在近幾年社區(qū)低碼概念的發(fā)展以及業(yè)務(wù)實踐經(jīng)驗來看:
      • 過于通用的方案: 不夠貼合業(yè)務(wù),無法開箱即用,接入成本高,門檻高,拓展性強(qiáng)。
      • 過于垂直的方案: 貼合業(yè)務(wù)場景,可以開箱即用,接入成本低,門檻低,拓展性差。

      這就是一個 "天平" 問題,如何尋找到平衡點是一個值得持續(xù)探討的問題,低碼的本質(zhì)是提效,是解決問題,在這個大前提下,如何做到
      高內(nèi)聚,低耦合的 T 型架構(gòu)
      ,是值得低碼從業(yè)者持續(xù)思考和實踐的 ~ 共勉 ~
      總結(jié)
      目前 RN 低代碼研發(fā)體系建設(shè)正在持續(xù)進(jìn)行,相關(guān)周邊生態(tài)的能力正在不斷完善,后續(xù)會將云手機(jī)能力下沉服務(wù)化,并逐步支持覆安卓云手機(jī),以中臺的形式開放給更多有需要的同學(xué)快速使用。之后會對核心模塊的技術(shù)細(xì)節(jié),以及可視化數(shù)據(jù)編排等進(jìn)行更為詳細(xì)的介紹,請持續(xù)關(guān)注我們的低碼系列文章,感謝 ~
      參考鏈接
      https://time.geekbang.org/column/article/499434
      - END -

      未經(jīng)允許不得轉(zhuǎn)載:RPA中國 | RPA全球生態(tài) | 數(shù)字化勞動力 | RPA新聞 | 推動中國RPA生態(tài)發(fā)展 | 流 > 網(wǎng)易云音樂 RN 低代碼體系建設(shè)思考與實踐

      后臺-系統(tǒng)設(shè)置-擴(kuò)展變量-手機(jī)廣告位-內(nèi)容正文底部
      主站蜘蛛池模板: 谷城县| 凤城市| 郁南县| 镇安县| 务川| 丰城市| 普兰县| 霍林郭勒市| 巴彦县| 方正县| 县级市| 蒲城县| 庄河市| 白山市| 调兵山市| 吉首市| 宜昌市| 肇庆市| 镇平县| 洮南市| 新疆| 湄潭县| 嘉禾县| 寻乌县| 察哈| 营山县| 大庆市| 赫章县| 双峰县| 高邑县| 百色市| 七台河市| 彰化县| 绵阳市| 海淀区| 团风县| 民丰县| 思南县| 津南区| 辽阳市| 北安市|