This project is part of TrigerSoft product line. ux-profiler is a chrome browser extension.
- What is ux-profiler useful for?
- Non-goals
- User Transaction column description
- What kind of events are tracked?
- What kind of events are not tracked?
-
The first purpose of ux-profiler is to answer a question: "How much time does it take the user to perform an action?". When an action involves network requests, timeouts, requires etc, it's not simple to track these and see the whole picture. ux-profiler does exactly that, tracks and groups related operations and shows them graphicaly, calling them "User Transactions".
-
The second purpose of ux-profiler is to profile operations that are processed too long. Just add an operation to Profiles and re-run the "User Transaction". The profiling session of the specified operation and only it will be created under Profiles Chrome tab.
- ux-profiler is not a precise logging tool. For example, very short events are filtered out with a single idea in mind - focus on things that really affect UX. As a result, sometimes an operation times do not equal to sum of its children. We choose to calculate times before the filter is applied, so they are accurate.
- User Time: Total time elapsed to perform an operation and its "children" from user perspective.
- Self/Total Time: Self/Total processing (JavaScript execution) time, without delays and waits.
- Delay From Parent: For a child operation, time elapsed since the parent operation ended. Can be negative for the nested events.
- Delay From Invocation: For a child asynchronous operation, time elapsed since the request (timeout/network/...).
- Exception: Boolean indicating whether an exception was thrown during processing.
- Timeline: Graphical relative timeline, useful for comparison of different operations in the same user transaction. Each line includes:
- Delay
- Self Work Time
- Children User Time
In total, 3 these constitute the user time of an operation and its children.
- Any browser events, that are listened using JQuery API, e.g.
$(...).click()
. Calling<element>.addEventListener
directly is not supported. - XmlHttpRequests (XHR)
- AMD require/requirejs
- timeouts < 1000ms
- Direct
<element>.addEventListener
. - setTimeout with timeout >= 1000 ms. If used, is not considered is as part of a user transaction.
- setInterval - if used, is not considered is as part of a user transaction.