Technical Articles
SAP Fiori for SAP S/4HANA – Performance: What is CDN?
UPDATE – Relevant for S/4HANA 2021, 2020, 1909, 1809, 1709, 1610 – This feature will be deprecated.
If you have been dealing with Fiori Performance issues, you may have heard something about CDN and want to try it out. If this is the case, please keep reading.
Let’s start by answering the main question of this blog: What the #@¢% is CDN?
The acronym CDN stands for Content Delivery Network and it can be defined as:
“… a globally distributed network of proxy servers deployed in multiple data centers. The goal of a CDN is to serve content to end-users with high availability and high performance. CDNs serve a large fraction of the Internet content today, including web objects (text, graphics and scripts), downloadable objects (media files, software, documents), applications (e-commerce, portals), live streaming media, on-demand streaming media, and social networks.”
Content Delivery Network. Retrieved from: https://en.wikipedia.org/wiki/Content_delivery_network
Second question you may be thinking of is: Why do I need a CDN for SAP Fiori?
SAP Fiori Launchpad Performance is generally an issue for end-users. Main reason for this is the fact that the SAP UI5 libraries are located in the ABAP Front-end Server (FES), when the Fiori web page is rendered it needs to make a call to the ABAP FES to load the JavaScript libraries. In high-latency networks this results in high rendering time lapses which affect end-user performance. One way to overcome this situation is to load UI5 libraries from a Content Delivery Network.
Now we know that CDN is a globally distributed network and it will help end users load UI5 libraries from a server closest to their geographical location offering high availability and performance. This leads to the third question: How can I setup CDN in Fiori?
Simple answer, you just need to set it up.
Now that the concept is clear, let’s go through the configuration options. Let’s start by identifying the technical prerrequisites:
- SAP_UI 751 SP01 (equivalent: SAP_UI 740 SP17, SAP_UI 750 SP06) or higher.
- End user devices have internet access.
Overall, two steps are needed to configure CDN:
- Create PFCG Role and Fiori Catalog ZUI5_CDN, which will enable/disable Content Delivery Network.
- Fiori Catalog will be based on Target Mapping configurations, semantic object “Shell”, action “bootConfig”
**Note: You can copy catalog “/UI2/CONFIG/UI5/CDN” to your custom Fiori Catalog.
This time we will skip the steps for creating a PFCG Role and Fiori Catalogs so we can focus on explaining the Target Mapping parametrization, which basically requires you to setup two parameters:
| Parameter | Description |
| /ui5/cdn/enabled | The parameter value can be set to “true” or “false” depending whether you want to enable or disable CDN. Setting the value to “true”, allows ABAP Method /UI2/CL_FLP_HTTP_HANDLER~CREATE_CDN_JSON to dynamically switch requests to the CDN url. |
| /ui5/cdn/url |
Setting this parameter requires you to specify the url of the CDN and version of the UI5 libraries you wish to implement. Use the syntax https://<customer provided CDN>/<version>/resources , where version stands for the UI5 library version, for example, 1.44.10 The use of this parameter is intended only for testing purposes, we strongly recommend not using this parameter in productive environments |
When you are done with the settings, your Target Mapping should look similar to:
Once this is done, assign the PFCG Role to your end-users. If you wish to test if the feature is working you just need to use your friendly browser developer tools like in the following examples:
Enable CDN:
Disable CDN:
UPDATE:
Fourth question you may be thinking of is: Can I use SAP’s CDN for my on-premise SAP Fiori implementation?
As mentioned in note 2943781 – Is the usage of SAP’s Content Delivery Network for onPremise systems permitted?
“The usage of the SAPUI5 CDN is only allowed for SAP Cloud products like e.g. SAP Cloud Platform, SAP S/4HANA Cloud, SAP SuccessFactors or SAP HANA Enterprise Cloud, however on premise installations/systems are not allowed to bootstrap SAPUI5 from the SAPUI5 CDN. This also applies for SAP Fiori/SAPUI5 applications which were built by customers and partners. When running on SAP Cloud Platform, the usage of the SAPUI5 CDN is included, also for the development phase with e.g. SAP Web IDE or SAP Business Application Studio.
However, when being deployed to an on premise system, the SAP Fiori/SAPUI5 applications must not consume SAPUI5 from SAP’s CDN.”
Fifth question is: What can I do if I really want to use CDN in my on-premise SAP Fiori Implementation?
The solution is to configure an own CDN based on a contract with the CDN provider of your choice.
**Note – If you wish to learn how to implement your own CDN provider, you can go through this excellent blog by Mario de Felipe: How to improve the performance of SAPUI5 Apps such as Fiori using Amazon CloudFront as CDN
Sixth question is: I’ve been using SAP’s CDN for some time now. Can I continue to use it?
Unfortunately, loading SAPUI5 from a Content Delivery Network (CDN) using a target mapping is now deprecated. The function will be removed in a future version (target: ABAP Platform 2021).
You can find more details in the following: link
If you have used the target mapping option described in this blog, you need to switch now. We recommend using SAPUI5 boostrapping instead.
Becoming a SAP Fiori for SAP S/4HANA guru
You’ll find much more on our SAP Fiori for SAP S/4HANA wiki
Do you have any questions? Let us know in the comments section.
Thanks,
SAP S/4HANA RIG
Hi Jorge,
great blog, thanks for sharing.
By setting the parameter /UI5/CDN/URL it is possible to specify any UI5 version which is wanted. So it should be also possible to specify a newer version which would be available on the FES.
Is this supported by SAP or are there any disadvantage?
Regards
Simon
Hi Simon,
As long as the version and patch you wish to use is available in the overview page you should not have any issues.
Be careful when selecting your version as some versions are "Cloud only" (1.46.xx) so you cannot use those in an On Premise system.
As of now (20.06.17) the latest UI5 version you can use for On-Premise is 1.44.15 and it is the latest version/patch available in the overview page, you may also find the note to implement this version in the FES
Regards,
JB
Hi Jorge,
we tried this with SAP_UI 750 SP07 but it did not work. The Fiori catalog "/UI2/CONFIG/UI5/CDN" is not found in our system and if i manually create the catalog and target mapping the FLP raises an error when loading the site.
Any hints or help is much appreciated 🙂
Regards,
Nils
Hi Nils,
As there is an error when loading FLP, I'm assuming there may be a network issue. Can you make sure that there are no proxy or firewall restrictions to reach the CDN url?
If there are no restrictions you may need to raise an incident to SAP.
Regards,
JB
Hi Nils,
I similarly tried it with a SAP_UI 750 SP07 system and encountered same as you. The Fiori catalog "/UI2/CONFIG/UI5/CDN" does not exist. Indeed there is no such catalog with "CDN" in its name. Did you figure out what to do? Otherwise I'm questioning whether this is indeed supported for this release level.
Regards
John
Hi John,
no we do not figured it out. Since it is our development system, we are going to patch to 751 to get the features.
Regards
Nils
Hi John, Hi Nils
Actually Loading SAPUI5 from a Content Delivery Network is a feature that comes with SAPUI5 1.44 and higher and therefore with SAP_UI 7.51 SP01 or higher. So the information in the blog about SAP_UI 740 SP17 (containing 1.28.*) and SAP_UI 750 SP06 (containing 1.38.*) is not correct. Check also the above link leading to the related documentation.
Regards, Margot
It seems official documentation is a little bit confusing about this topic.
According to SAP note 2526542:
"This functionality is available as of SAP_UI 751 SP01 (equivalent: SAP_UI 740 SP17, SAP_UI 750 SP06)."
According to HelpSAP: https://help.sap.com/viewer/a7b390faab1140c087b8926571e942b7/7.51.2/en-US/843dafd6bf0c413e9a5fe698e1550380.html
"This feature is only supported for SAPUI5 versions 1.44 and higher."
I guess the correct answer is that both requisites should be accomplished in order to be able to load sapui5 libraries from CDN.
PS: Great article Javi!
Best Regards,
Emanuel
Thanks Emanuel for directing me to note 2526542. In fact the information there is not correct as those two requisites are mutually exclusive as SAPUI5 1.44 is only available from SAP_UI 751 SP01 on which is NOT equivalent to SAP_UI 740 SP17 nor to SAP_UI 750 SP06.
I asked to update the note accordingly.
Dear Jorge,
I've just tried this configuration on our 7.51 SP2 System which is our central FES. Setting up the Catalog and Role worked smooth and as soon as I assign my User to the Role the configured SAPUI5 version is loaded from the CDN. But what I'm wondering is why the libraries are loaded at every refresh again from the CDN and not from the local browser cache? I've tested with IE and Chrome with the same behaviour. Only when I switch back to the local delivery caching for SAPUI5 is active again. The first load of the launchpad in Chrome (empty cache) transfers about 1.8 MB are transferred. When doing a refresh it's only 62.9 KB. When doing it again with the CDN it loads 1.9 MB. A refresh loads again 1.9 MB over the network. Could it be that the Expires headers at Akamai are not set in an optimal way? I've used https://sapui5.hana.ondemand.com/1.44.16/resources/ as the CDN URL.
Best regards
Gregor
Hi Gregor,
do you only see this behavior when specifying a full cdn url only or for the simple cdn on/off option as well?
If the latter this should be looked into. For specifying a full custom url I would recommend to use this only for testing but not in production for several reasons. Most obvious one is that FLP has dependencies between ABAP and SAPUI5 versions. That is also why we did not document this 'hiddden' feature. Still for testing a new version in DEV this makes a lot of sense.
Se also: https://help.sap.com/viewer/a7b390faab1140c087b8926571e942b7/7.51.1/en-US/843dafd6bf0c413e9a5fe698e1550380.html
Hi Gregor,
In Chrome I've seen this behaviour when SSL certificates are not set correctly but not in IE. I currently don't have an answer for you so let me try to find something.
Regards,
JB
Hi Jorge,
How can we setup a behaviour where launchpad is access both from Internet and intranet ? or in case when internet is down and still launchpad is accessible via intranet ?
regards
Yashpal Gupta
Hi Jorge,
any change to store UI5 content LOCALLY on ma notebook.
Network infrastructure here in Germany is hell....
Best Regards
Alex
Hi Jorge,
Do have any idea on where all are the Akamai data centers located. I tried to hunt this information online but have had no luck with the same.
Kind regards,
Sagar
Hi. if I enable CDN but dont mention the full cdn url (the second parameter) like recommended in this blog, where would the ui5 library be loaded from? Would the system generate the url dynamically and get the content automatically from the local data center in the Akamai regions? And also would it know to fetch the correct version of the libraries also automatically?
Hello,
Thanks for this blog.
I have done it successfully, but what about a custom theme, which is build on the FES UI5 version not on the CDN one.
For the moment my theme doesn't react as expected because I have to rebuild it on the CDN UI5 version. How to do it ?
Regards,
Joseph
Hi Jorge,
I followed the above mentioned steps , but getting below error and FLP doesn't load at all.
The error seems like CORS error, but since it's a SAP suggested method, do we need to do any additional setting on server to allow CDN.
Please suggest.
Thanks,
Rakesh
I believe we should not use CDN enablement for productive environment..correct ?