SAP Hybris Cloud for Customer: Troubleshoot high load time of home page
The home page within your SAP Hybris Cloud for Customer solution can contain a multitude of different tiles, like reports and dashboards. However, this flexibility also holds the risk of performance issues, either by the number of tiles on the screen or by single tiles that take a high time to load. First, it is important to understand the concept of Time To Interact (TTI), which is explained in detail in the note “1 Note: Time to Interaction (TTI)” of the following article: C4C Performance Update – Whats new in 1702
In case of the home page, this concept is specifically helpful, as a user does not have to wait until all tiles have finished loading, until he can start working with others. Nevertheless, we want to look at two different cases of performance issues with the home page in this article.
1. Overall high response time
One common reason for performance issues with the home page is simply the number of tiles displayed on the home page, as each tile increases the loading and rendering time of the whole screen, even if some parts can be processed asynchronously. When editing the home page, there is a warning that alerts the user, when adding too many tiles and reports to the page. It is strongly advised to adhere to this warning to ensure a reasonable response time for the page. Specifically consider this warning and try to reduce/adapt the page as much as possible, if the home page is configured as starting page for any users and by this is loaded every time they log on to the system.
2. Single tiles with high response time
If the page contains a reasonable number of tiles and is still slow or some single tiles are loading very slowly, you might want to find out, which tile is responsible for the high response time. To identify slow parts of the screen, we will use the Network tab of the developer tools within Chrome (similar tools are available within the Internet Explorer). See also the video at the bottom of this article.
Excursion: Post Request Compression
When analyzing the request payload, as described within the rest of the article, you will see that the text in there is not human readable. These cryptic symbols are there, because of compression of the requests. However, you can switch off the compression, by using the debug mode. Keep in mind to not take any performance tests, while in debug mode, as the compression is a feature used to improve performance (especially in cases with slow internet connections)
See the following article for more details on how to switch to the debug mode: How to disable post request compression
Within the Chrome developer tools, open the Network tab and then navigate to the step within the application that you want to record (in this case, go to the point immediately before opening the home page) and start recording the network log.
After the screen has been loaded completely, stop the recording and analyze the trace. The waterfall diagram on the right will show you, at which time each part of the screen is loaded. This will also give you an impression on which parts are loaded synchronously (i.e. the user has to wait for it to finish) and which are loaded asynchronously (in parallel to other synchronous requests). You can either look at the different json requests in the order of loading or if you just want to find specifically slow ones, you could sort the list by response time. After identifying a particularly slow request, click on it to show more details. Check the Request Payload within the Headers tab. In there you will be able to identify the technical name of the corresponding tile on the page (see marked in yellow on the below screenshot).
After identifying the problematic tile, you can decide how to further handle it, e.g. remove it from the page or improve the performance of it. In case of a report, you might want to have a look at the following article for hints on how to optimize it: Best practices for SAP Cloud for Customer Analytics Reports performance
Finally, SAP is also continuously working on improving the performance of the solution. For some improvements in the home page, check out point 2 “Improvement in security authorizations for home page” of the following article: Whats new in C4C Performance – 1711 Edition.
This video walks you through analyzing a single tile with high response time: