For one of our customers we did the performance analysis of their website. Historically, whenever users click on a button on a particular page the CPU utilization at the client side reaches 100% and stays there for almost 2/3 minutes before users could do anything. On investigation we found two areas of improvement:
- Network transfer
The following steps I followed:
- Open the website, go to the page where you suspect the event is present.
- Just before clicking on the problematic button(the scenario) launch Developer Tool (press F12),
- From the Profiler Tab Start Profiling.
4. Wait till the page load finishes then Stop Profiling.
Finally a very cool table as below was generated, which can be exported to an excel file. Here I looked for functions with higher Exclusive Time, (Inclusive Time contains other timings spent inside(in case a function calling other functions, etc.))
In my case I found this:
So, now I have a reason to go back to the developers and show them where the performance improvement is needed. Also developers can leverage the functionality of this cool profiler to identify the hotspots at the early stages of the development lifecycle to ensure end users' happiness.