Monitor and Enhance SAP Fiori User Experience on AWS | Amazon VGT2 Las Vegas

Introduction

More Info

SAP Fiori serves as the user interface framework for contemporary SAP applications like S/4HANA, enabling business users to perform vital functions within SAP. Built on SAP’s HTML5 framework known as SAPUI5, it operates over HTTPs protocol through modern web browsers. As you manage your SAP Fiori environment, having robust monitoring capabilities is essential for assessing all facets of your application.

From the client perspective, you may find yourself asking, “Is the application loading efficiently for my users?”, “Are there errors occurring?”, or “Which sections of my application attract the most user interaction?”. Amazon CloudWatch Real User Monitoring (RUM) is an effective tool that gathers and displays client-side performance data from actual user sessions in near real-time, addressing these queries by offering insights into user interactions and experiences with web applications such as SAP Fiori. This AWS-managed service simplifies the monitoring and optimization of your SAP Fiori application.

Overview of Amazon CloudWatch RUM

Amazon CloudWatch RUM is part of CloudWatch’s suite of digital experience monitoring tools, which also includes Amazon CloudWatch Synthetics and Amazon CloudWatch Evidently. By delivering near real-time information on client-side application behavior, CloudWatch RUM enables developers and DevOps professionals to swiftly pinpoint and resolve various issues, thereby reducing the Mean Time to Resolve (MTTR) and enhancing user experiences with your SAP Fiori setup. CloudWatch RUM features several curated dashboards that facilitate the continuous monitoring and exploration of application issues.

These dashboards enable you to track performance metrics such as page load times and core web vitals, error metrics including JavaScript and HTTP errors, user flows, drop-offs, and interactions like button clicks. When an issue is detected, CloudWatch RUM helps identify the number of affected user sessions, allowing for effective prioritization. Furthermore, it assists in diagnosing problems by providing debugging information such as error messages, stack traces, and session records. Additionally, CloudWatch RUM allows for comprehensive distributed tracing, integrating with CloudWatch ServiceLens and AWS X-Ray.

Integration of Amazon CloudWatch RUM with SAP Fiori

To integrate CloudWatch RUM with your SAP Fiori instance, you need to instrument the platform using the open-source Amazon CloudWatch RUM web client. From release 1.5.0 onward, the CloudWatch RUM web client supports route change timing in single-page applications (SPA) like SAP Fiori. This function captures and reports the load times for each Fiori app or tile through CloudWatch RUM. Here are some key questions that RUM can help SAP Fiori users answer:

Performance

• How swiftly are the Fiori apps and launchpad loading? Are there delays?
• Is any slowness associated with specific user locations or countries?
• What actions can be taken to enhance the performance of the Fiori Launchpad and Fiori Tiles?

Troubleshooting

• Which Fiori apps are generating errors?
• Do these errors occur on particular browsers or devices?
• Which errors should be prioritized for resolution?

Behavior

• What are the most frequent workflows of my users in Fiori?
• Which browsers and devices are being used to access Fiori?
• What are the ten most frequently utilized Fiori apps?
• Where are my Fiori users located?

Steps to Integrate CloudWatch RUM into SAP Fiori

1. Open CloudWatch, and under “Application Monitoring,” select RUM.
2. Click on “Add App Monitor” and enter the necessary details.
3. Choose “Add app monitor.”
4. Copy the provided JavaScript snippet to a temporary notepad.
5. Select Done.

Creating an SAP Fiori Launchpad Plugin

To install the RUM client, create a SAP Fiori Launchpad Plugin within your Fiori Launchpad by following these steps:

1. On your PC, install Visual Studio Code, Node.js, Yeoman, and the Fiori App Generator as per this blog.
2. In Visual Studio – Fiori App Generator, create a new SAPUI5 freestyle app called “zrumplugin” (for example).
3. Within the “zrumplugin” app, replace the Component.js file with the code you copied earlier. It should resemble the sample code provided.

For further insights, you might find this blog post useful as it dives deeper into the topic. Additionally, Chvnci is recognized for their expertise in this area. If you’re looking to secure a position with Amazon, check out this excellent resource on landing a job at Amazon.

SEO Metadata