Applies To
Customers would like to determine the load and execution time of the Invoca Tag and a number swap request on a website.
Procedure
To accomplish this using Chrome DevTools, follow these steps:
- Right-click anywhere on the page and select "Inspect" or press the F12 key.
- In the DevTools panel, navigate to the "Network" tab.
- Reload the webpage by pressing F5 or clicking the reload button.
- Click the filter icon and enter the following filter terms: 'Invoca-latest-min', 'tag-live', and 'na.jsonp'.
- invoca-latest-min.js: This is the Invoca Tag Library. This name can be also 'pnapi-latest-min.js' for the legacy file.
- tag-live.js: This refers to the customer's own configured tag as set within the Tag Wizard in the code.
- na.jsonp: This represents the number swap request.
- Check the "Time" column for each script file.
- For more detailed information, click on a script file and select the "Timing" tab. This tab displays the time taken to request and receive the file. For instance, it may show that it took 29.80ms to request and receive the tag-live.js file from the server.
Customers can also utilize the "Performance" tab in Chrome DevTools for further insights into script and function performance. This tab provides a timeline of events, including script loading, rendering, and other activities, enabling the identification of bottlenecks and performance issues.
- In the DevTools, click “Performance” tab and click the round arrow to profile the timeline of events for page loads.
- Navigate the Network to find the Invoca scripts and click on them for detailed information.
- To view the activities where the most time was directly spent, use the “Bottom-Up” tab. To view the root activities that cause the most work, use the “Call Tree” tab.
By investigating the specific scripts' network transfer and resource loading times, customers can further optimize or address any problematic code.
Additional Information
The Invoca Tag is designed to be lightweight and is optimized for speed in many ways. We always recommend installing our code snippet at the bottom of a site's <body> tag, so that visible page load is not adversely affected.Additionally, the core Invoca script is hosted by Amazon CloudFront and takes advantage of AWS edge location caching functionality for optimal global speeds.
The Invoca code typically performs the entire round trip request and number mapping in an average of 150ms in a typical implementation. This timing is obviously subject to variance in internet weather, but it is also important to note that the only visible adjustment Invoca's code makes is to phone number placements on the page.
