Jerry的碎碎念：SAPUI5, Angular, React和Vue

去年我去一个国内客户现场时，曾经和他们IT部门的一位架构师聊到关于在SAP平台上进行UI应用的二次开发时，UI框架是选用UI5仍是Vue这个话题.

咱们表明SAP, 向客户推荐使用UI5是基于如下六点缘由：

1. Fiori consists of a large number of UI controls aimed at Enterprise application developed by top JavaScript developers in SAP. Those UI controls pass strict testing by SAP regarding functionality, usability, accessibility and performance. By developing on top of those controls, Fiori application developers can really concentrate on the implementation of their business logic. The final built application have a consistent look and feel.

2. Fiori is a responsive UI framework, which achieves that develop once, and can run on any supported terminals listed in SAP help. No additional pack and installation is necessary which is inevitable for other open source UI framework.

3. Fiori won Red Dot Award out of 4680 competitors from 61 countries in Design Concept Competition in 2015, which proves that the UX idea of Fiori has completely been confirmed by UX professionals.

4. Fiori provides robust role based access control and authorization where the concept of PFCG role is reused. Customer do not need to apply any third party authorization solutions.

5. Fiori has its dedicated software component and thus the upgrade is decoupled from CRM backend. While the backend version can keep stable, Fiori can be free to keep to latest version to benefit from continuous function enhancement and performance improvement shipped by SAP, no worry about any risks that this UI upgrade can have negative impact on backend.

6. The maintenance and continuous development ( new function iteration ) can never be ignored in Enterprise application development. There are also lots of tool-sets provided by Fiori to help customer with automation test and regression test, mock server to separate frontend / backend development. All of those help customer improve their development efficiency.

而客户的IT部门架构师考虑到他们部门的开发人员对Vue比较熟悉，已经有了不错的技术积累，同时他们对UI5作过简单调研，以为UI5的性能存在问题，所以他们更青睐Vue.

回到office以后，我把这个问题抛到SAP内部的微信群上，激起技术人员们热烈的讨论。你们能基本达成一致的观点是 - 正如抛开应用场景单独谈论几种编程语言的优劣是耍流氓行为同样 - 这些UI框架各自有其特定的使用场景，在特定的场景下选用合适的UI框架能最大程度的扬长避短。

我从2014年10月起才开始用UI5作SAP的Fiori应用的标准开发，而对于Angular，React和Vue, 我不是专家，仅仅停留在会用的阶段，而且在项目需求的状况下读过这三个框架的相关源码，所以这是这篇文章取名"碎碎念"的缘由。

一位SAP的同事, Fahad Alshunaiber, 曾经在他的博文Side by Side: SAPUI5 vs. React & Angular2里对于UI5, Angular和React作过一个比较:

SAP labs里的不少同事都读过这篇博文，而且都有本身的看法。有的同事认为这个比较出自SAP employee之手而不是第三方机构，是否能作到绝对客观？有的同事对这个图标里的某些判断持保留意见。但大多数同事的见解仍是比较统一：

若是在SAP平台上作二次开发来填补SAP标准产品的功能gap, UI5是一个不错的选择，理由见这篇文章最开始的那6点阐述
若是业余时间本身作一些小的应用来玩或者知足本身我的某方面的须要(好比本身的知识管理应用，或者是作一个Labs内部足球俱乐部的管理应用), 这时你们会倾向于尝试UI5之外的其余应用.

我本身在学习这些非UI5的框架时，喜欢和个人另外一篇文章Jerry的ABAP, Java和JavaScript乱炖提到的同样，把一些不管任何UI框架都必须实现的一些最基本的功能点拿出来横向比较。下面是个人一些学习笔记：

1. Compare Event handling mechanism: SAPUI5 and Angular
   https://blogs.sap.com/2016/06/09/compare-event-handling-mechanism-sapui5-and-angular/

2. Compare Data Binding mechanism: SAPUI5 and Angular
   https://blogs.sap.com/2016/06/30/compare-data-binding-mechanism-sapui5-and-angular/

3. Compare Controller mechanism: SAPUI5 and Angular
   https://blogs.sap.com/2016/07/01/compare-controller-mechanism-sapui5-and-angular/

4. Two way data binding: UI5 VS Vue https://blogs.sap.com/2017/06/14/two-way-data-binding-ui5-vs-vue/

同时，在个人这篇博文 Use Chrome development Tool to compare Rendering performance between SAPUI5 and React
https://blogs.sap.com/2016/02/26/use-chrome-development-tool-to-compare-rendering-performance-between-sapui5-and-react/
里，我分别用UI5和React作了两个最简单的应用，而后试图去比较他们的渲染性能。Walldorf的UI5开发专家Andreas Kunz（我曾经在个人公众号文章Jerry的UI5框架代码自学教程里提到过他)绝不客气地指出了这种性能比较实际没有任何意义。

因此若是您已经读到了这里，建议您点开上面的原文连接，去阅读Andreas写了一大段的为何认为个人比较是毫无心义的缘由，我相信必定会有收获。

还有一些有意思的比较是用这几个UI框架在Github上的Star number已经帮助文档的点击数来判断谁更在UI developers中间用得更多。

而一位前端开发人员laizimo, 则在他的博文2017前端技术大盘点（原文连接: https://github.com/laizimo/zimo-article/issues/48）里面形象地将Angular, React和Vue比喻成了三驾马车。如下两张图均来自laizimo的博文：

最后，正如前面博文提到，讨论这些UI框架"谁是winner"的这种问题永远都不会有确切的答案。做为SAP从业者，若是您在您的项目里使用到了UI5之外的其余框架，欢迎留言，告诉你们您的故事。

要获取更多Jerry的原创技术文章，请关注公众号"汪子熙"或者扫描下面二维码: