Website integration overview

Grona runs on your website through one script snippet that you add to the top of every page’s <head>. This page explains what that script does on each page view, so you can reason about flicker, targeting and measurement, and it maps the rest of the website docs.

What the script does on a page

The snippet has three lines: a preconnect hint to cdn.grona.ai, the anti-flicker script and the runtime script (main.js). Both scripts are built for your workspace and served from cdn.grona.ai. On every page view they do the following, in order.

Hide the page. The anti-flicker script runs synchronously and hides the page body, so visitors do not see the original content change in front of them. Search crawlers and testing tools are recognised by their user agent and skip this step, and everything after it.
Load the runtime. main.js downloads asynchronously. It sets up a random visitor id in first-party storage, or reads the one it set earlier.
Check campaigns in priority order. For each active campaign, starting with the highest priority, the runtime checks the schedule, the UTM rules, the URL rules and any audience rules. The first campaign that enrols the visitor wins the page view, and lower-priority campaigns do not run on it.
Apply a variation. The runtime picks the visitor’s variation. The choice is deterministic and sticky per visitor, so the same visitor sees the same variation on every page and visit on the same site address, unless you change the campaign’s traffic split. It downloads that variation’s changes from the CDN and applies them once the page is ready.
Reveal the page. The runtime shows the page as soon as the changes are applied, or straight away if no campaign matched. A safety timer reveals the page 5 seconds after the anti-flicker script ran if the runtime has not finished by then.
Measure. Once a campaign has enrolled the visitor, the runtime records the page view, scroll depth, time on page and clicks on elements it has tagged. Conversions you send with grona('track', ...) are recorded on any page. Everything goes in batches to api.grona.ai. While measuring every page is switched on for your workspace, the runtime also counts one page view on pages no campaign takes; see Data, privacy and security.

On single-page applications the runtime also watches for route changes and runs the campaign check again for the new address. See Single-page applications for what is and is not supported.