天天看點

魯班-58房産低代碼平台設計與實踐

作者:閃念基因

1

導讀

魯班全棧式低代碼開發平台(以下簡稱魯班)是58房産自研的全棧式低代碼開發平台,我們的目标是:人人都可以成為全棧開發工程師。讓後端人員可以幹一些簡單的前端工作,讓前端人員可以幹一些簡單的後端工作。2023年4月初上線,截止目前已經擁有300+的使用者,開發了40+的應用,并上線了270+模型、900+頁面、1600+的接口。

魯班-58房産低代碼平台設計與實踐

圖1:魯班目前的使用情況(這個圖表也是用魯班開發)

2

背景

2.1 傳統開發模式的不足

場景1: 我是一個後端開發工程師,日常工作是後端系統開發,主要精力更關注于高并發、大資料、高性能的架構設計、服務優化等。但是偶爾也會有需求要做一兩個前端頁面,為産品或者運維提供後端的資料查詢、報表展示、配置操作等。比如房産這邊做真房源項目中,産品上線一個新的治理政策之前,希望能夠先通過一個搜尋頁面把一些房源搜尋出來,手動處理一部分看看效果。這種情況下在後端基礎能力已經存在的情況下,就需要前端支援開發這個頁面,需要跨部門協作、PMO排期、開發測試上線。如果按照傳統開發模式,走需求評審,排期,開發,測試,傳遞周期會很長,且資源緊張情況下,還存在被更高優需求替代的現象。

場景2: 我是一個前端開發工程師/IOS/安卓開發工程師,日常工作是主要前端頁面與樣式的開發和功能實作。但是偶爾也會有一些小的需求,需要做資料庫的增删改查操作,需要将這些操作封裝成接口供前端調用。比如房産做的58房産門戶網站内部系統,前端同學就需要自己設計資料庫存儲各網站的url位址、分類關系等,并需要提供增删改查等操作。前端同學對于資料庫的設計、調用、接口封裝等并不熟悉,需要後端同學支援。

随着軟體開發規模的增加和複雜度的提升,将軟體開發人員劃分為不同的角色,如前端開發、後端開發、資料庫工程師、算法工程師、測試人員等,這種劃分使得不同開發人員能夠專注自己的領域,但是同時也帶來一些缺點:

1.知識隔離:過于精細的分工可能導緻不同角色之間的知識隔離,缺乏全局視野。這可能使得團隊難以應對快速變化的需求和市場環境。

2.溝通成本:不同角色之間的溝通可能會增加,需要花費更多時間解釋和協調工作,這可能增加溝通成本。

3.資源浪費:用造飛機的人員分工和流程管理來造一輛自行車,對于一些輕量級的需求也要調動前後端資源和走一遍全部開發流程,高射炮打蚊子,殺雞用牛刀。

魯班-58房産低代碼平台設計與實踐

圖2: 低代碼平台和傳統開發的比較

2.2 低代碼平台調研分析

在魯班項目啟動之初,我們調研了市場上的低代碼和零代碼平台,這些平台對魯班的設計和研發提供了參考和借鑒。

企業 日期 産品 定位 功能特性
騰訊 2022年公測 微搭 小程式、H5 應用、Web 應用等

1.面向前端,拖拽式開發

2.部署騰訊雲

3.多端支援

阿裡 2019年釋出 宜搭 低代碼企業級應用搭建SAAS平台

1.可視化搭建應用

2.根據業務靈活定制

3.內建釘釘快速應用

ClickPass 2017年創立 ClickPaas 企業級低代碼開發平台

1.開發速度快,項目周期短

2.高性能、高擴充、高并發

明道雲 2013年成立 明道雲 零代碼,銷售、營運、人事、采購等核心業務應用

1.雲原生架構

2.分布式架構支援

3.支援私有部署、

4.簡單易學,無需編碼

碼匠 2018年成立 碼匠 面向開發者的低代碼平台,可以幫助企業快速建構和部署應用程式

1.模型驅動開發模式

2.多種資料源支援

3.模型自動生成頁面

百度 暫無 愛速搭 更靈活、更強大、更智能應用可視化設計與釋出平台

1.零代碼搭建

2.模型引擎,意見應用生成

攜程 2023年3月 PGClowcode 用戶端(App、小程式、網頁)和營運背景

1.拖拽生成頁面

2.自動化部署運維

3.安全性

4自助化元件開發

表1:低代碼零代碼産品調研

考慮到我們的實際應用場景,我們面對C端的場景,要求功能複雜、互動友好、流量大、性能要求高的場景,肯定還是優先選擇傳統的開發模式。隻有面對B端的場景和一些内部系統,不要求界面精美,可用就行,能夠開發簡單,快速上線。是以魯班低代碼平台的定位就是面對B端場景和一些内部系統。

這些内部系統需要支援58的OA賬号登入鑒權、需要能夠私有化部署在58私有雲、需要能夠支援58的通用底層架構通路(例如58的内部RPC系統SCF服務、分布式消息WMB、存儲系統WOS等)、需要能夠通過内網通路58的内部其他系統(例如經紀人賬号、商業訂單等)。這些訴求就決定了我們不可能采用外部的低代碼平台,隻能自研。

2.3 魯班的目标

魯班全棧式低代碼開發平台,可以幫助後端開發人員做一些輕量級前端的工作,幫助前端開發人員做一些輕量級後端的工作,人人都可以成為全棧開發工程師。降低技術門檻,減少溝通成本,提高開發效率,快速疊代和修改,易于內建和擴充。

3

魯班的功能介紹

3.1 拖轉生成頁面

魯班可以通過可視化拖拽的方式,讓開發人員能夠快速建立和布局應用界面。以下是魯班拖拽生成頁面功能的詳細介紹:

1.直覺的可視化拖拽界面:低代碼開發平台提供了一個直覺的可視化拖拽界面,開發人員可以通過簡單的拖拽操作來建立和布局應用界面。這種方式使得界面設計更加快速和靈活,無需編寫繁瑣的代碼。

2.豐富的元件庫:低代碼開發平台提供了豐富的元件庫,包括文本框、按鈕、表單、圖檔、圖表等常見元素,以及各種業務單據和業務邏輯元件。這些元件可以滿足不同應用程式所需的通用核心功能,是以可以重複使用,以更快地開發不同的解決方案。

3.可重用性:低代碼開發平台擁有完善的功能子產品體系,不同子產品可以滿足不同應用程式所需的通用核心功能,是以可以重複使用,以更快地開發不同的解決方案。

4.可擴充性:為了實作各個資訊系統的整合,友善統一管理和使用者通路,低代碼開發平台提供了豐富的內建接口,支援。

5.多種內建方式:可以很友善地與第三方系統內建,包括市場上多個領域的主流産品,都可以實作無縫對接。跨平台可通路性:低代碼開發平台的全生命周期管理使得應用程式可以輕松地實作跨平台通路,包括PC端、移動端、平闆電腦等裝置。

總的來說,魯班拖拽生成頁面功能通過直覺的可視化拖拽界面和豐富的元件庫,使得開發人員能夠快速建立和布局應用界面,提高了開發效率和品質。同時,該功能還具有可重用性、可擴充性和跨平台可通路性等特點,能夠滿足不同應用程式的開發需求。

魯班-58房産低代碼平台設計與實踐

圖3:魯班頁面設計器

魯班-58房産低代碼平台設計與實踐

圖4:多端支援

3.2 資料可視化

魯班的資料可視化功能是其重要的組成部分,它可以幫助開發人員快速、直覺地展示資料,提供更好的決策支援。以下是對魯班低代碼平台資料可視化功能的介紹:

1.資料驅動的可視化設計:低代碼平台的資料可視化功能通常采用資料驅動的方式進行設計,使用者可以通過簡單的拖拽和配置操作,将資料源與可視化元件進行綁定,實作資料的實時展示。

2.豐富的可視化元件:低代碼平台提供了豐富的可視化元件,如折線圖、柱狀圖、餅圖、地圖等,使用者可以根據需要選擇合适的元件進行資料展示。同時,這些元件通常支援自定義樣式和互動行為,以滿足不同場景下的需求。

3.資料實時更新:低代碼平台的資料可視化功能支援資料實時更新,當資料源發生變化時,可視化元件會自動更新展示内容,無需人工幹預。這使得使用者可以及時了解資料變化,做出相應決策。

4.資料互動與關聯:低代碼平台的資料可視化功能還支援資料互動與關聯,使用者可以通過點選、滑動等操作,對資料進行篩選、排序等操作,實作資料的個性化展示。同時,不同元件之間也可以實作關聯效果,提高使用者體驗。

總之,魯班平台的資料可視化功能為使用者提供了直覺、高效的資料展示方式,幫助使用者更好地了解和分析資料,為決策提供有力支援。

魯班-58房産低代碼平台設計與實踐

圖5:資料源與可視化元件綁定

魯班-58房産低代碼平台設計與實踐

圖6:豐富的可視化元件

3.3 快速生成接口

魯班支援根據一張表生成CRUD一組http接口,同時能支援将現有的SCF接口(58自研RPC架構)導入并轉換成http接口的能力。生成的接口支援直接通路和在頁面綁定資料源展示使用兩種方式。

魯班生成的接口,可以直接作為背景http接口對外提供接口服務,也可以作為頁面資料源方式與頁面元件進行綁定。

魯班-58房産低代碼平台設計與實踐

圖7:根據資料庫表生成http接口

魯班-58房産低代碼平台設計與實踐

圖8:SCF接口導入生成http接口

3.4 角色與權限

魯班的使用者分為開發使用者和應用使用使用者兩套使用者體系。

同樣角色和權限也分為開發使用者角色和權限、應用使用使用者角色及權限。

魯班-58房産低代碼平台設計與實踐

圖9: 開發使用者及權限

3.5 擴充性支援

低代碼平台通過拖拉拽的方式生成頁面,通過sql方式或者接口導入方式生成接口,這種方式友善快捷,但是也有缺點,就是靈活性不足。比如接口傳回日期資料是時間戳,但是頁面想展示成日期格式。或者是在導入的接口調用之後,對出入參數進行加工。

為了解決這個問題,魯班支援擴充代碼方式對現有功能進行擴充,同時能夠支援前端擴充代碼(js代碼)對頁面資料進行擴充和後端擴充代碼java方式對接口調用做before()和after()的執行。

魯班-58房産低代碼平台設計與實踐

圖10: 前端擴充代碼

魯班-58房産低代碼平台設計與實踐

圖11: 後端擴充代碼

對于後端擴充代碼,為了開發友善及開發習慣,支援代碼下載下傳到本地進行IDEA進行編輯,并支援将運作時資料調用本地代碼進行本地調試。

魯班-58房産低代碼平台設計與實踐

圖12: 本地debug模式

4

魯班的設計與實作

4.1 整體架構設計

魯班-58房産低代碼平台設計與實踐

圖13: 魯班整體架構圖

魯班整體上分為開發環境和運作環境:開發環境是供開發人員使用的系統,提供頁面、接口開發、資料源配置、打包部署上線等功能。運作環境是應用的運作環境,是一個web系統,對外提供http接口,每個應用一個獨立的運作環境,互相隔離。

整體上分為4層:基礎設施層、中間件層、引擎層、業務中台層,其中前端引擎和後端引擎是核心。

同時提供了openApi功能可以對外提供服務,和内置了一些58内部系統的登入、通路、鑒權等能力。

4.2 中繼資料設計

1.前端頁面設計:

頁面設計的内容以中繼資料DSL格式存儲在mongodb資料庫中,在運作時動态加載,并通過頁面解析器解析展示。

魯班的前端頁面代碼是把頁面資訊編輯成JSON Schema,平台生成JSON Schema是在formily/json-schema規範的基礎上擴充了部分字段,以來相容非form元件的渲染。其中大部分字段可以在formily的文檔中找到屬性描述。

魯班-58房産低代碼平台設計與實踐

圖14: 前端頁面中繼資料設計

2.接口出入參模版設計:

魯班目前支援14種接口類型,新增、修改、單條删除、批量删除、分頁清單、無分頁清單、下拉框清單、數量查詢、批量id查詢、詳情、全部導出、批量導出、自定義導出、自定義類型。這些接口類型主要是定義了出入參模版,供頁面或者直接使用。這些接口出入參的定義,也是用JSON Schema方式存儲下來作為中繼資料使用。

使用的場景有:接口出入參展示、格式校驗、資料轉換等。

魯班-58房産低代碼平台設計與實踐

圖15: 接口出入參模版中繼資料設計

4.3 前端引擎

前端引擎主要有頁面設計器、圖示設計器、js擴充代碼等組成。

魯班-58房産低代碼平台設計與實踐

圖16: DSL解析器

首先設計器會加載所需元件庫、元件屬性設定器等物料,接着開發人員根據産品需求在畫布中進行布局設定、元件 CRUD 操作、API屬性配置和邏輯編排等操作,這些操作會不斷生成操作節點模型,然後設計器将操作節點模型轉化成頁面描述即JSON chema,此為設計器的産物。最後經過解析器進行生命周期、事件流、資料綁定等邏輯處理并渲染成真實頁面。

元件與資料層的綁定:元件需要被魯班特定方法包裹,該方法判斷元件是否為受控元件,如果是則将元件的value、onchange方法與資料字段模型Field綁定,進而實作第三方元件資料與頁面資料雙綁的能力。除元件資料外,元件的描述、校驗狀态、校驗方法等均可綁定。整個方案不會破壞存量元件庫,改造動作小,且不影響其在傳統開發項目中的正常使用。

魯班-58房産低代碼平台設計與實踐

圖17:元件與資料層綁定

4.4 多租戶、多環境與隔離性

4.4.1 多租戶

魯班低代碼開發平台是一種典型的Saas模式,每個應用都是獨立一套雲叢集環境,叢集間重新開機、版本部署、中繼資料、網絡鍊路等皆互不影響。

魯班-58房産低代碼平台設計與實踐

圖18:多租戶

4.4.2 多環境

魯班低代碼平台分為開發環境和運作環境。

開發環境是開發人員開發接口、設計頁面的開發平台,使用者開發設計的頁面、資料庫中繼資料、接口中繼資料、變量、擴充代碼等都存儲在開發環境。

運作環境是系統實際運作的平台,分為開發環境和正式環境,部署在K8s叢集,以及58集團私有雲環境。使用者開發完的應用,可以不用上線,直接在開發環境雲行及預覽。

待開發完成在開發環境測試聯調通過之後,可以在魯班一鍵打包并部署到正式環境,同時根據部署包支援復原到某個指定版本。

魯班-58房産低代碼平台設計與實踐

圖19: 多環境支援

多環境環境變量:

魯班運作環境分為開發環境和正式環境,開發環境是根據使用者開發的内容實時顯示,正式環境需要打包上線之後才會更新内容。在日常的開發過程中,有些配置資訊需要開發環境和正式環境不同,比如使用的資料庫配置,開發環境用測試庫,正式環境用線上庫;調用的接口開發時用開發環境的接口,上線之後用正式環境的接口。在使用的變量的環節用luban.${var_name}表示,在運作時會從變量定義中進行替換。

魯班-58房産低代碼平台設計與實踐

圖20: 多環境環境變量

4.4.3 隔離性

設計時環境與運作時環境相隔離,設計時開發存儲于中繼資料,運作時隻依賴于中繼資料并提供緩存功能。即使運作時出現問題,不影響運作時的原型。

運作時的開發環境和正式環境相隔離,開發環境依賴開發環境的中繼資料,随着使用者的開發實時變化,正式環境的中繼資料隻有打包部署之後才會更新,開發環境的變動不會影響運作環境,保證了運作環境的穩定性。

魯班不同的應用互相隔離,運作在各自不同的docker容器中,互相不會影響。

4.5 版本管理

魯班-58房産低代碼平台設計與實踐

圖21: 版本管理

魯班的node運作環境、java運作環境都是容器(docker鏡像)。這些運作環境的容器都是通用的,可以運作任何一個應用。

魯班低代碼平台将頁面中繼資料、接口中繼資料、配置資訊、擴充代碼等打成一個運作時版本包。

在部署環節隻要将某個版本的運作環境部署,并将這些應用中繼資料資訊加載,加載A應用的中繼資料資訊就是A應用的運作環境,加載B應用的運作資訊就是B應用的運作環境。

這種設計實作了應用和運作環境的隔離,可以實作同一個應用的部署更新、復原、灰階等操作。

4.6 路由規則

魯班的運作環境和應用是互相隔離的,魯班通過統一的網關來進行路由分發。路由規則有三層,分别是:環境、組織、應用。魯班的接口調用規則如下:luban.58corp.com/{env}/{org}/{app}/path。其中env表示環境資訊:開發環境offline or 線上環境online。org表示組織代碼,app表示應用代碼。

魯班-58房産低代碼平台設計與實踐

圖22: 路由規則

4.7 擴充性設計

4.7.1 接口參數映射

有時候,原始導入的接口參數,并不滿足使用者希望提供的接口參數訴求,魯班支援對接口的出入參進行映射擴充。

魯班-58房産低代碼平台設計與實踐

圖23: 出入參映射

4.7.2 接口擴充代碼

魯班-58房産低代碼平台設計與實踐

圖24: 接口擴充代碼

魯班支援對每個接口做切面擴充,在接口的調用之前執行before方法和執行之後再執行after方法。

魯班對于接口的擴充代碼,以中繼資料的方式存儲在代碼倉庫中,在運作時動态加載動态編譯方式加載到運作環境中,當代碼有更新時,開發環境動态拉取最新代碼重新加載編譯,線上環境為了系統的穩定性,隻有在使用者點選打包上線之後才會更新代碼。

因為頁面自帶開發工具不如本地IDEA好用,魯班平台支援将擴充代碼下載下傳到本地進行編輯調試,并可以在本地啟動一個web系統,在運作時通過本地debug開關和ip+port的方式,将before/after的接口請求轉發到本地進行調試。

調試成功的接口,可以通過push方式更新到代碼倉庫。

luban-SDK提供了魯班低代碼平台常用的一些能力,比如擷取應用資訊、使用者登入資訊、調用平台其他接口功能等。

5

接入案例分享

5.1 安心交易

為推進二手房交易規範化,幫助更多使用者實作安心交易,58同城、安居客攜手合和緻遠、邦安家,為全國使用者提供“安心交易保障”,目前,“安心交易保障”已經在武漢、太原、長沙、西安、杭州 、南京、鄭州、珠海、青島等10幾個城市的糯家、邦安家、安個家等合作門店推行。

安心交易主要用到了魯班根據資料庫表自動生成CRUD接口和操作頁面,開發了53個接口,14個頁面。降低了開發難度,提高了開發效率,減少了人員投入,相比傳統開發方式,人力投入從2人減少到1.5人,開發周期從24天減少到17天。

魯班-58房産低代碼平台設計與實踐

圖25: 安心交易

5.2 房産SKU管理背景

房産SKU管理背景是為開發、測試、營運人員提供的一個查詢背景,提供了SKU資訊、挂靠關系、記錄檔能的查詢功能。這些能力是通過背景服務提供接口(SCF服務,58内部RPC服務),魯班通過接口設計功能将這些接口轉換成http接口,并通過拖拉拽方式設計查詢或者操作頁面進行資料綁定,進而實作了對背景資料的通路。

主要用到了魯班背景接口導入和頁面拖拉拽編輯功能,所有功能都完全由SKU背景開發人員負責,降低了開發難度,減少了跨部門協作和業務溝通成本。人員投入由傳統開發方式的2人将低到1人,開發周期從13天減少為5天。

魯班-58房産低代碼平台設計與實踐

圖26: 房産sku背景

5.3 房産門戶網站

房産門戶網站是58房産内部系統,将所有房産業務群常用的網站進行分類整理,統一門戶。房産的産品、開發、營運、測試可以一站直達任意網站。

58房産門戶網站的開發模式是為前端開發人員提供後端開發的能力,前端開發人員利用魯班配置連接配接資料庫,并對資料庫表提供CRUD的功能,對外提供通路接口,這些資料庫表存儲了分類網站的類别、網站url位址等資訊。

因為整個開發都隻有前端同學參與,人員投入由傳統開發方式的2人降低到1.5人,開發周期從21天減少為15天。

魯班-58房産低代碼平台設計與實踐

圖27:房産門戶網站

6

總結及展望

6.1 總結

1.目前市場上的常見的低代碼平台,例如阿裡宜搭、騰訊微搭、簡道雲、輕流等,基本上是偏前端的使用場景,注重頁面設計,對于後端支援一般比較弱,擴充性不足。魯班低代碼平台是前後端結合的低代碼平台,後端功能甚至要重于前端設計,主要展現在快速接口搭建、後端擴充代碼的支援等方面。

2.魯班低代碼平台對58的基礎能力的支援,比如針對58内部RPC架構SCF的接口一鍵導入、58内部OA賬号登入等,提升了内部使用者使用效率。同時依托58提供的私有雲,部署運作環境時即可以部署原生k8s,也可以部署在58私有雲平台,兼顧了靈活性和穩定性的要求。

3.魯班低代碼平台的高擴充性,尤其是後端擴充代碼+SDK結合的能力,甚至可以當作一個獨立的web開發架構使用,開發便捷、部署靈活。

6.2 未來規劃

1.流程引擎,常用的業務場景有工作流、審批流等。

2.内嵌的模式,魯班開發的頁面或者接口能夠内嵌到其他系統使用,其他系統的接口或者頁面能夠内嵌到魯班應用中使用,取長補短,互相補充。這種方式目前可以部分支援,未來希望能夠做到無縫連接配接,更便捷。

3.互動設計優化,在實際使用中我們發現,在一些開發場景中,對開發者的使用引導還有欠缺,初次使用有一定的學習成本,未來希望能夠做到不需要閱讀文檔,拿來就會用。

4.房産通用服務内置子產品化, 比如房源庫基礎服務,樓盤字典基礎服務等,使用者用到這些服務不需要自己再去申請,通過魯班内置SDK就可以通路。

5.AI賦能(需求抽象、代碼生成、資料分析、智能輔助等)。

參考文獻

例如:

[1] 百度低代碼平台:https://mp.weixin.qq.com/s/4tyZnBCwJkzEWn-zfWFqIA

[2] 低代碼vs.傳統開發一個全面的比較:https://mp.weixin.qq.com/s/riu_itoEipSdArMjVKuyWw

[3] 攜程背景低代碼平台的探究與實踐:https://mp.weixin.qq.com/s/_atcGO_J5C2lx13gZCrp6g

[4] 如何讓低代碼平台發揮出真正的價值:https://mp.weixin.qq.com/s/5pRaajrP8oeb9w6P6viCGw

[5] 騰訊微搭:https://weda.cloud.tencent.com/learn

[6] 阿裡宜搭:https://yida-pro.ding.zj.gov.cn/

作者簡介:

李春雷:58安居客-房産技術部後端架構師。緻力于高并發、大資料、高性能的後端服務研發;曾成功實作了58、趕集、安居客房産三網業務融合與資料融合,目前專注于雲原生與低代碼方向的研發工作。

馬震:58安居客-房産技術部後端架構師。緻力于設計高效、穩定、可擴充的系統架構,具備深厚的技術功底和豐富的實踐經驗;目前負責房産核心基礎服務、AI智能對話、低代碼平台等方向的架構設計與研發工作。

周軍:58安居客-房産技術部後端架構師。曾負責58房産詳情頁微服務化、房源搜尋、房産開放平台等;目前負責房産核心基礎服務、低代碼平台等方向的架構設計與研發工作。

來源-微信公衆号:58技術

出處:https://mp.weixin.qq.com/s/DAJhQjGatYASZfvV0lA7ig

繼續閱讀