Debugging the "hidden" calls in the Dev Tools’ Profiler

Ever wonder why the performance measurements taken with Chrome’s Dev Tools look a bit off, such as the first few frames after starting the capture taking a while to execute? In this post, we will cover how you can expand the functions shown by the Dev Tools when recording profiles and obtain more information on what is going on behind the scenes.

Since the 1.54 release of Cohtml, we have started shipping our packages with Development builds, which can help you get a better understanding of:

• What our native library is doing underneath
• Where its processing time is spent

, by invoking the 'cohtml::System::EnableProfiling(bool enabled, const char * file, unsigned profilingLevel)' call. It allows you to see low-level profiling markers, which you can control by setting the value of the last argument when invoking the method:

To utilize this, you would need to implement a file writer so that Cohtml can create a JSON file to which it will write all profiling messages, similar to what is shown in the documentation here.

Additionally, you might have noticed that when you utilize the Performance Profiler, some of the time functions seem to be taking too long for no apparent reason. For example, if you start the profiler and reload the View, you may observe either 'Synchronize models' or 'Execute Script' is taking a large chunk of the 'Advance' call:

This behavior can occur after starting the performance capture and then sending a performance-heavy event (such as 'click' or page refresh), which will triggerclick' or page refresh), which will result in the triggering of the StartProfiling Chromium method. This occurs even in Chrome, where starting the profiler and refreshing a blank page will also result in a slight performance hit due to this method:

To expand these events, you need to enable the "Timeline: show all events" feature from Dev Tools’s settings:

For example, here’s how the above screenshot would look after enabling this setting:

This can help narrow down what is occurring in the native library and optimize the UI's performance.