• 3 min read

Azure Application Insights JavaScript SDK: reliability and performance improvements

Recently, we have improved the robustness of web page monitoring in Application Insights, and introduced the ability not to use cookies. Transmission is now more reliable in the face of throttling and network issues, and when a page is about to unload. With Azure Application Insights you can monitor performance and usage of your apps. With a little snippet of JavaScript you can get timings of page loads and AJAX calls, counts and details of browser exceptions and AJAX failures, as well as users and session counts.

Recently, we have improved the robustness of web page monitoring in Application Insights, and introduced the ability not to use cookies. Transmission is now more reliable in the face of throttling and network issues, and when a page is about to unload.

With Azure Application Insights you can monitor performance and usage of your apps. With a little snippet of JavaScript you can get timings of page loads and AJAX calls, counts and details of browser exceptions and AJAX failures, as well as users and session counts. To learn more how to get started you can visit our documentation.

New JavaScript SDK features

In addition to internal improvements we have fixed some bugs, cleaned up the SDK, and added a couple more features:

Add snippet.js to NPM package:

Snippet.js is a file used for those who want to use application insights from a separate file instead of using inline JavaScript using a Gulp pipeline. By RehanSaeed. Thanks Muhammed Rehan!

Option to disable cookies

This was an ask from some of our users. Now you can disable cookies, but some features will be lost. Without cookies every page view will count as a new user and session. For more configuration options please see our Application Insights SDK JavaScript API

Enable dependency correlation headers

These are now turned off by default, but you can enable them manually. To correlate dependencies with server request set disableCorrelationHeaders in your config file to false. If you opt in to this feature you will then be able to see the server request that correlate with your client side AJAX calls.

JavaScript SDK Improvements

The below improvements have been made that elevate our JavaScript SDK without any additional work when onboarding

Security

The JS SDK has fully switched to https. We now use https to send all telemetry and to download the library. Also, for all secure sites the SDK will create cookies with a secure flag – more on set-cookie documentation

Transmission

One of the biggest goals for Application Insights JavaScript SDK is to provide as much functionality as possible, while not degrading the instrumented page in any way. This includes performance and user experience. Because transmission reliability is a crucial part of the SDK, we’ve recently made a few improvements in this area.

Telemetry is now sent more reliably when:

1. The Application Insights portal is imposing throttling, or is temporarily unable to accept data.

Retry and error handling features are helping to improve transmission reliability. In the case of network issues, the SDK will retry sending the telemetry data with an exponential backoff.

2. The user navigates to a new page within the same site, shortly after your code sends a telemetry event. Previously, events not yet sent were lost when the page was unloaded. Events are now kept in a session buffer that is preserved across pages in the same site.

Beacon API

JavaScript SDK also provides experimental support for a Beacon API. The Beacon API is designed to transmit telemetry when the browser is not busy with time-critical operations. All data is delivered even if the user navigates away or closes a browser tab.

The Beacon API only allows to queue data for transmission, and the actual transmission is handled by the browser outside of our control. Thus, the JavaScript SDK cannot receive a confirmation from the Application Insights backend that all telemetry was received and processed correctly.

If a default JavaScript SDK configuration doesn’t fully work for you and you suspect that not all events are tracked or that transmission is impacting the performance of your page, you can try using the Beacon API.  The feature is currently disabled, but you can enable it by setting ‘isBeaconApiDisabled’ to false – see config. If you decide to send your data using the Beacon API, the SDK will automatically turn off Session Storage Buffer and Retry features.

Performance.now in Session Class

After working with the PowerBI and Edge team we have moved to using performance.now in session calls. This improves the performance of our library’s date/time handling.

Feedback

If you have any questions or experiencing any problems with the JavaScript SDK, feel free to open an issue on GitHub.

Special Thanks

Special thanks to Kamil Szostak for help preparing this post.