Skip to main content

Advanced Configurations

Single Page App Support​

Sidecar now officially supports integration within Single Page Apps. This includes new Sidecar configuration tools and SDK methods that you can use to configure your own customer trigger points, giving you full flexibility to control when an experiment should run.

  • Disable Auto Run - When selected, Sidecar will not automatically attempt to run the test on page-load.
  • Custom activation using StatsigSidecar.activateExperiment("<experiment_id>") to activate an experiment manually.
  • Prerun Script - This allows you to define a custom script that will run only once per experiment if the url filter passes. You should use this to bind any listeners or evaluate any custom logic you need to control when to trigger the experiment using activateExperiment.

Spa configuration

Advanced Targeting & Segmentation​

This approach allows you to set User Identity and Attributes for Sidecar, enabling you to perform more advanced targeting and results segmentation.

By default, Sidecar & Autocapture use stableID (an auto-generated device-level guid that gets stored in the user's localStorage) for tracking purposes. If you wish to enrich autocapture events with known user identities and attributes, you can define the following object prior to autocapture/sidecar being loaded.

Watch this video tutorial on how to configure more advanced targeting for your Sidecar experiments.

window.statsigUser = {
  userID: "<USER ID>",
  custom: { // optional attributes object
     isLoggedIn: false 
  }
}

Accessing the Statsig js client​

For accessing the underlying Statsig js client instance, you can call StatsigSidecar.getStatsigInstance().

Persisting stableID across subdomains​

Statsig uses localStorage as the preferred mechanism for storing the user's stableID. Localstorage keys do not persist across any origin boundaries including across subdomains. For example, a user visiting https://example.com, https://show.example.com and https://account.example.com would be issued three distinct stableIDs.

If you are assigning a user to a test on one subdomain, and tracking behavior for metrics purposes on a different subdomain, you'll need to have this solution in place to ensure Statsig can properly attribute cross-origin behavior to the Test Group assignment that took place on the initial experiment domain.

To install, simply paste the following in your HEAD section.

<!-- cross domain id script -->
<script>!function(){let t="STATSIG_LOCAL_STORAGE_STABLE_ID";function e(){if(crypto&&crypto.randomUUID)return crypto.randomUUID();let t=()=>Math.floor(65536*Math.random()).toString(16).padStart(4,"0");return`${t()}${t()}-${t()}-4${t().substring(1)}-${t()}-${t()}${t()}${t()}`}let i=null,n=localStorage.getItem(t)||null;if(document.cookie.match(/statsiguuid=([\w-]+);?/)&&([,i]=document.cookie.match(/statsiguuid=([\w-]+);?/)),i&&n&&i===n);else if(i&&n&&i!==n)localStorage.setItem(t,i);else if(i&&!n)localStorage.setItem(t,i);else{let o=e();localStorage.setItem(t,o),function t(i){let n=new Date;n.setMonth(n.getMonth()+12);let o=window.location.host.split(".");o.length>2&&o.shift();let s=`.${o.join(".")}`;document.cookie=`statsiguuid=${i||e()};Expires=${n};Domain=${s};Path=/`}(o)}}();</script>

<!-- Manually attach stableID from local storage -->
<script>
if(localStorage.getItem('STATSIG_LOCAL_STORAGE_STABLE_ID')) {
  window.statsigUser = {
    customIDs: {stableID: localStorage.getItem('STATSIG_LOCAL_STORAGE_STABLE_ID')}
  }
}
</script>

<!-- sidecar script below -->
<script src="https://cdn.jsdelivr.net/npm/statsig-sidecar/dist/index.min.js?apikey=[client-YOUR-STATSIG-CLIENT-KEY]"></script>