AddThis Academy

An ever-growing library of resources to help you become a better online marketer.

Optimizing AddThis Performance

Asynchronous Loading

Normally, AddThis executes initialization code as soon as it arrives on the page. While we strive to make this as efficient as possible, load times of more important resources can be affected. To optimize for performance and load time, AddThis can be loaded asynchronously, such that no assets are loaded and only the most essential processing occurs.

To enable asynchronous loading, add the querystring parameter “async” to the end of the addthis_widget.js script tag. Here’s an example:

<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#async=1"></script>

This will prevent all AddThis assets from loading except for the initial script. When you’re ready for AddThis to load, call the function “addthis.init()”, like this:

function initAddThis() {
    addthis.init()
}

// After the DOM has loaded...
initAddThis();

The addthis_widget.js will begin loading whenever it’s parsed by the browser. If you’re concerned about your page load time, you can place the script at the bottom of your page. Alternatively, you can use JavaScript with our ‘DOM-ready’ parameter to dynamically add the script tag to your page after the DOM is ready.

Caveats

  1. Initialization must be performed AFTER the DOM is ready.
  2. Click tracking will not occur until initialization.

Optimizing AddThis Performance
3 (60%) 1 vote

Was this article helpful to you?