CRM WebClient UI

WebUI最后渲染出来的dom element这些C#_W#的id是在哪行ABAP代码被render出来的？

See my blog WebClient UI element ID generation logic

https://blogs.sap.com/2018/01/31/webclient-ui-element-id-generation-logic/

Hybris

既然是JSP，套路都一样的。Hybris application developer不用重复造轮子，直接在jsp page里使用ycommerce tag:

这个ycommerce tag的实现如下。从注释里也能清楚看出这个JSP tag的实现，为了确保id唯一，采用的是和CRM WebClient UI一样的方式：内部维护一个计数器，每次生成element后加1.

计数器加一的代码：

等价于WebClient UI第16行代码:

JSP没办法直接被浏览器执行，而是编译成.class，最后浏览器输出的native html source code来自这些.class:

既然一个是BSP，一个是JSP，当然有很多相通之处了。

CRM WebUI

每个应用的入口都是search，为了避免application developer重复造轮子，SAP WebUI的框架开发人员把搜索的逻辑实现在了tag advancedSearch里，这样SAP的应用开发人员就可以直接使用这个tag来实现搜索功能。

双击tag，可以看到实现的class和对应方法。

Hybris

jsp有类似的逻辑。看jsp抬头的那些定义，和BSP几乎一模一样。注意第8行的cms:component, 此处将一个UI component include进来。

runtime这个jsp的source code也会被转换成原生的html source code：

每个tag的render逻辑也分为render前，render中和render后。

请和BSP这个三个方法相比：

在执行具体render时，采取的逻辑也是delegate给对应的render class进行render。这个逻辑和Fiori控件的render方式一致，见我的文章A Tutorial how I do self-study on a given Fiori control and UI5 framework code behind里的第2篇: Control renderer：

https://blogs.sap.com/?p=133359