SAP 前端技術的演化史簡介

Jerry以前曾經寫過一篇微信公衆號文章，題目叫<<SAP UI和Salesforce UI開發漫談>>

關注個人公號「汪子熙」後，在歷史菜單「前端開發相關」裏便可找到這篇文章：

該文章簡單回顧了SAP UI技術的發展歷史，而後提了下Salesforce的Apex和Lighting Component等技術和框架。

目錄

SAP UI
SAP GUI + Dynpro
Web Dynpro
BSP/CRM WebClient UI
SAP UI5/Fiori
UI5 in SAP Cloud for Customer

Hybris Enterprise Commerce Platform

Salesforce UI
Apex
Lightning Experience
Aura Framework
Lightning Component Framework
Visualforce

我也畫了張簡單的圖：

R1和針對於大型機的R2對咱們來講實在太古老了，對咱們來講，只能經過SAPGUI裏的復古主題，即Classical Theme來體驗一下這些老古董的外觀風采。

到了1992年出現了相似JSP技術的BSP(business server page)，可以藉助在服務器端執行的ABAP語言實現動態網頁效果。

在運行時，每一個BSP頁面會自動生成一個臨時的ABAP類，執行這些BSP頁面上嵌入的ABAP代碼，執行的結果再渲染成原生的HTML代碼。

值得一提的是，BSP技術兼容普通的HTML/JavaScript應用，換句話說，幾乎全部能運行在除Netweaver覺得的web服務器上的基於HTML/JavaScript的web應用，也能以BSP爲載體，運行在Netweaver上。所以，即便是現在SAP的旗艦級產品S/4HANA裏的不少Fiori UI應用，也是以BSP應用爲載體存儲在Netweaver上的。

好比S/4HANA物料主數據管理的Fiori應用，其名稱在Chrome開發者工具裏能看到：

這個BSP應用在Netweaver上能找到：

誕生於1992年的BSP技術到了今天還在服役，這自己就是一個奇蹟了。固然它自己因爲歷史緣由也有一些侷限：

1. 開發效率不夠高，沒有相似後來UI5裏控件庫的概念，致使開發人員須要重複造不少輪子。SAP後來本身也發佈了一些BSP Extension，相似JSP裏的tag，以此來彌補開發效率的缺陷。

另外BSP的開發工具在SAPGUI裏只有事務碼SE80，這個工具在作HTML和JavaScript開發時顯得不夠友好。所以後期SAP Fiori開發也採起了在本地現代IDE好比Eclipse裏作開發，完畢後再上傳到Netweaver自動生成BSP的方式。

1. 沒有MVC的概念，在大型企業級應用開發中顯得力不從心。

正是因爲暴露了這兩個缺陷，促成了WebUI和Webdynpro的問世。對這兩種前端技術的詳細介紹，請參考Jerry以前提到的微信文章：SAP UI和Salesforce UI開發漫談，這裏再也不重複，只是聊聊一些該文章中沒有提過的內容。

ABAP Webdynpro的亮點就是可以以所見即所得的方式進行UI界面開發，缺點是再也不支持相似BSP那樣兼容傳統的HTML/JavaScript，所以沒法實現某些對界面複雜度和交互性要求較高的需求。

而WebUI在繼承了BSP全部優勢的同時，在BSP基礎上提供了對MVC的封裝，使得開發效率大大提升，同時開發出來的Web應用結構清晰，再也不會出現一個視圖頁面幾千行代碼的狀況。

下圖是一個典型的WebUI模型，MVC三層在workbench裏有清晰的界定。

WebUI和ABAP Webdynpro至今仍普遍應用於SAP產品中。在S/4HANA的CRM模塊裏，WebUI繼續扮演着很是重要的角色，詳情請閱讀我下面這篇文章：Hello World, S/4HANA for Customer Management 1.0

而Webdynpro，是SAP SRM UI開發的主流技術。

搜索公網上全部使用了SAP BSP技術的網站：
https://www.google.com/search...:/sap/bc/bsp/&gws_rd=ssl

使用了Webdynpro的：

隨着時間的推移，用戶對移動設備上訪問網頁的體驗要求愈來愈高，所以有了SAP從業者如今很熟悉的前端技術：SAP UI5。

關於UI5最新的技術發展方向，請關注個人公衆號「汪子熙」，閱讀我寫的這篇文章：

Fiori Fundamentals和SAP UI5 Web Components

要獲取更多Jerry的原創文章，請關注公衆號"汪子熙":