Visually complete is a point-in-time metric that measures when the visual area of a page's content has finished loading. Visually complete timing happens substantially earlier than the typical page load time, and optimizing the visually complete timing is more valuable then optimizing other page load timings when targeting the user experience. Visually complete has the following benefits:
- Lets you see exactly how long it takes your end users to see the information they are looking for.
- Provide a true business-relevant metric from the perspective of the user.
- 100% visibility to actual real user experiences, regardless of device.
- Align IT and business to connect user experience with business outcomes.
- Accelerate performance improvement.
- Optimize decisions across development, operations and user journey.
Along with the speed index, these metrics represent the most accurate picture of real page load timings.
Visually complete shows you the exact time your real users spent waiting for above-the-fold content to load completely for any location, device, operating system and browser type. It can also be combined with powerful waterfall charts to understand and tune the rendering of a web page.
The Speed Index marks the average time that visible parts of a page display. It is useful for comparing the user experience of various pages. The lower the number, the better the user experience of the page. The Speed Index is only available for page load actions.
Single page Applications
For single page application frameworks like Angular, visually complete gives even more accurate timings for user actions. Previously on application load, captured user interactions could be correlated with XHR requests being fired afterwards, as shown in the following:
Correlate user performance with business metrics
End user analytics
Visually complete and speed index display for each step in a user action.
In AppMon Web, select Visits, then select the you want to analyze. Click Show visit details to view the actions for that visit. Click on an action step to see contribution timings and the step's action timeline. The action timeline shows timings for all the relevant action stages, including speed index and visually complete. When the performance metric used for the step is user action duration or visually complete, it is highlighted at the top of the timeline.