smartserve.js

This is for:

Developer

In this article, we’ll introduce you to Smartserve, what it’s used for, and how to use it synchronously and asynchronously for the best results based on your requirements.

What is Smartserve?

The Smartserve script is a JavaScript bundle hosted on a CDN, which contains all the code required to deliver experiences, segment users, and collect data. Each time you publish a change to a segment or experience, we republish a new version of smartserve.js that includes your changes.

Tip
Leading practice

You can get your Smartserve script from the Settings page. See Getting Your Script.
Note

The Smartserve script must be added to each property’s main domain and any subdomains.

Whether smartserve.js is added synchronously or asynchronously on a page depends on the balance between minimizing page load and minimizing flicker.

Warning

To ensure the best possible data accuracy and experience delivery, it is important to place this script tag as early as possible on the page. For those clients that cannot add the script to <head>, and therefore opt to place the tag in <body>, it is important to understand that this will increase the time it takes for Smartserve to load and will therefore impact flicker.

Minimizing page load

For the best user experience, and to minimize page load, we recommend an asynchronous setup:

<script src='//static.goqubit.com/smartserve-<YOUR_PROPERTY_ID>.js' async></script>

Observe the following recommendations:

  • The tag should be loaded at the head of the page

  • The tag should be loaded asynchronously

  • The tag can be loaded within a tag manager, although this is not recommended as it could potentially add flicker

In our experience, this is a suitable setup for campaigns that deliver additional messaging to a page such as personalized content, pointers, toggle sliders, and modal boxes.

With this setup, experiments designed to change the content of a landing page or home page banners may expose the visitor to small amounts of perceived flicker.

Minimizing flicker

For clients who intend to run a full-site testing optimization program that includes landing pages, home page takeovers, and other areas of the site where the user experience is sensitive to perceived user flicker, then we recommend the following setup:

<script src='//static.goqubit.com/smartserve-1234.js'></script>

Observe the following recommendations:

  • The tag should be loaded at the head of the page

  • The tag should be loaded synchronously

  • The tag should be loaded outside of a tag manager

It is important to understand that this setup comes with a trade-off of increased page latency. Our testing shows that this increased latency is largely imperceptible to the end-user, but this of course depends on the connection used.

Improving performance

Clients often express concerns about the impact of Smartserve on page loading and overall site performance.

Whilst Qubit has released a number of changes in the past year to minimize loading time, it is worth pointing out that the solution is typically custom to the site itself and often related to other site issues.

We do have a number of recommendations, however, that you might consider to further minimize Smartserve loading time:

  • Archiving un-used experiences and segments - it is important to understand that each live and recently paused experience and each segment injects logic into Smartserve and therefore contributes to its weight and the number of CPU cycles needed to execute it

Tip
Leading practice

For this reason, we recommend archiving any live experiences you are no longer using and deleting any unused segments.

  • Removing jQuery - this is an option for clients that are able to ensure jQuery is loaded on a page before Smartserve runs

  • Using packages - for common functionality used across experiences, using packages can have a significant positive impact on Smartserve performance. Refer to our Experiences section and in particular Packages for more information