How to add analytics to a Lovable app

To add analytics to a Lovable app, ask Lovable to put a tracking snippet in the <head> of your index.html, add your app's domain to the tool's allowed list, and publish. Page changes inside the app are counted with no more code. The rest of this guide covers what Lovable already measures, what it leaves out, and how to see where your users drop off.

What Lovable's own Analytics covers

Every published Lovable app comes with an Analytics page. It counts visits, page views, pages per visit, visit length and bounce rate, and splits traffic into channels such as SEO & AI, Social, Referral and Direct. For a quick look at whether anyone is coming, that is enough.

Lovable's documentation is clear about where it stops:

• Visits are not people. One person can make several visits, and your own visits count too.
• No funnels. Steps like sign-up or purchase need another tool. Lovable's docs name PostHog.
• 90 days at most. Custom date ranges reach back 90 days.
• No campaign grouping. Visits are not grouped by UTM campaign name.

Once your app has users, the questions change: who signed up, what did they do first, and at which step did the rest give up. That needs an analytics tool that tracks people and events.

Your options

Google Analytics. Lovable has a Google Analytics connector: you add your G- measurement ID in Connectors, then ask Lovable in the project chat to use it. It is free, but GA4 is built for marketing reports, and funnels and per-user journeys take real effort to set up there.

A self-hosted tool. Umami, Plausible Community Edition and PostHog can all be self-hosted for free. You then run the server and database yourself, which is a second project next to the one you are building.

A hosted tool with a free plan. Spreelytics is free up to 1 million events a month and runs on our servers, so there is nothing to host. The steps below use it. Any tool that gives you a script tag goes in the same place.

Step 1: get your snippet

Create an audience in Spreelytics for your app. Open Settings → Tracking script and copy the snippet. It is two script tags with your client key in the second:

<script src="https://cdn.spreelytics.com/cdn/sdk/spreelytics-loader.js"></script>
<script>
  Spreelytics.init({ client_key: "YOUR_CLIENT_KEY" });
</script>

The client key is public on purpose. It can only send data to its own audience, so it is safe in your page source.

Step 2: ask Lovable to add it

A Lovable app is a single-page app with one index.html. Paste this into the project chat, with your snippet at the end:

Add these two script tags inside the <head> of index.html, in this order, before any other scripts. Don't change anything else.

If you edit the code yourself, through GitHub or Lovable's code view, paste the snippet into the <head> of index.html directly.

You do not need to touch the router. Lovable apps use React Router, and the script records a page view each time the visitor moves to a new screen.

Step 3: allow your app's domains

Spreelytics only accepts data from the hostnames on the audience's Allowed domains list, in Settings → Details. Add each address your app is published on:

• your Lovable address, such as your-app.lovable.app
• your custom domain, if you have one, with and without www if you use both

The editor's preview runs on a different hostname, so your own clicking around while you build is not counted. If you do want it counted, add that hostname too.

Step 4: publish and check it works

Publish the app, open it in a normal browser window, and load a page. In Spreelytics, Settings → Tracking script should change to Tracking is live. If it doesn't, click Verify. Then open Realtime, and you should see yourself as a live visitor.

If nothing arrives, the usual causes are a hostname missing from Allowed domains, or an ad blocker in your own browser.

Step 5: mark the clicks that matter

Page views tell you where people went. To see what they did, tag the buttons you care about. You do not need to write tracking code: any element with a data-spree-track attribute sends an event when it is clicked, named after the attribute's value.

Ask Lovable something like:

Add data-spree-track="signup_clicked" to the sign-up button, and data-spree-track="project_created" to the button that creates a project.

Each click on those buttons now shows up on the Events page.

Step 6: build one funnel

A funnel shows how many people made it through each step, and where the rest fell out. In Spreelytics, every step of a funnel is a goal, so create the goals first on the Goals page. A goal can be a page path, such as /pricing, or one of the events from step 5. Then open Funnels and chain them together, for example:

1. visited /
2. signup_clicked
3. project_created

The step with the biggest drop is where to spend your next prompt. Funnels also work on data you already have, so a funnel made today shows last week's numbers too.

If your app takes payments

Many Lovable apps take payments through Stripe. Connect Stripe in Settings → Revenue and pass the visitor id into your checkout, and each payment is credited to the channel that brought the customer. How to see which marketing channel earned each Stripe payment has the code.

Questions

Does it work with Lovable's routing? Yes. The script notices route changes made through the browser's History API, which is what React Router uses, so each screen is counted as a page view.

Will it slow my app down? The first tag loads a small loader, which fetches the main script in the background and holds any calls until it arrives.

Is it free? Up to 1 million events a month, with every feature except session replay and the in-app AI assistant. There is nothing to host.

Do I need a cookie banner? New audiences start cookieless, so the script stores nothing in the browser. Turn Cookieless tracking off in Settings → Tracking script to set one first-party cookie. Which one your site needs depends on where your visitors are; Privacy explains the difference.

The full setup reference is in Tracking script, and everything the script records on its own is in Autocapture.