Skip to content

Post cover

How to Track Website Traffic and Performance with Anosys

Most web analytics tools give you pageviews and bounce rates. That's fine until you need to answer harder questions: Why did checkout latency spike on Tuesday? Which pages are slowest for mobile users? How does my latest deploy affect real user experience?

Anosys is an observability platform that goes beyond traffic counting. It ingests any signal — page views, custom events, latency measurements, backend traces — into a single queryable system with built-in anomaly detection, alerting, and root cause analysis. This guide shows you how to set it up for a custom website from scratch.

What You'll Get

By the end of this guide, your website will report:

Signal How It Gets There What You Can Do With It
Page views & sessions JavaScript tag or image pixel Traffic dashboards, top-pages reports
Custom user events Custom fields piggybacked on the URL Funnel analysis, segmentation
Performance metrics REST API from backend Latency charts, SLA monitoring
Anomaly alerts Automatic (ML-based) Slack / email notifications when something breaks
Zero-JS fallback Standalone image pixel Track traffic in email, AMP, or no-JS environments

How Data Flows from Your Website to Anosys

Before diving into code, here's the architecture at a high level:

%%{init: {"flowchart": {"curve": "linear"}}}%%
graph LR
    A1("Browser — JS Tag") -->B1[/"s1, s2, n1, n2 … fields piggybacked on URL"/]
    A2("Browser — Image Pixel") -->B1
    A3("Backend — REST API") -->B1
    B1 -->B2[["Anosys Ingestion API"]]
    B2 -->C1["Real-Time Dashboards"]
    B2 -->C2["Anomaly Detection"]
    B2 -->C3["Alerts — Slack / Email"]
    B2 -->C4["Custom Pipelines"]
    B2 -->C5["Root Cause Analysis"]

    style B1 stroke:#1e88e5,color:#fff
    style B2 stroke:#c62828,color:#000

Your website sends data to Anosys through lightweight client-side tags or server-side API calls. Every field is passed as a query parameter (s1, n1, etc.) piggybacked on the URL. The platform processes everything in real time and makes it available for dashboards, alerting, and analysis within seconds.

For the full list of ingestion methods, see the Data Ingestion Options documentation.

Step 1 — Create an Anosys Pixel

A pixel is your data ingestion endpoint. Each pixel has a unique path and project ID.

  1. Sign up at console.anosys.ai (7-day free trial, no credit card).
  2. Navigate to Pixels → Create Pixel and select Web as the integration type.
  3. Copy your project ID and ingestion path — you'll use them in the next steps.

For a detailed walkthrough, see the Getting Started guide.

Step 2 — Add the JavaScript Tracking Tag

Drop this snippet into the <head> of every page you want to track. It loads asynchronously and does not block page rendering:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
<!-- Anosys Web Tracking -->
<script type="text/javascript">
var anosys_project = "YOUR_PROJECT_ID";
</script>

<script async type="text/javascript"
  src="https://api.anosys.ai/webstats.js"></script>
<noscript>
  <img src="https://api.anosys.ai/ingestion/YOUR_UNIQUE_PATH"
       referrerPolicy="no-referrer-when-downgrade"
       width="0" height="0">
</noscript>
<!-- End of Anosys Code -->

Replace YOUR_PROJECT_ID and YOUR_UNIQUE_PATH with the values from your Anosys Console pixel.

What the JavaScript tracker collects automatically

Once loaded, the Anosys JS tracker captures a rich set of signals with zero additional configuration:

Category What's Collected
Page & navigation URL, path, referrer, page title, SPA route changes (pushState / popstate)
User & session Anonymous user ID, session ID, session count, first-touch attribution
Screen & viewport Screen width/height, viewport width/height, color depth, orientation
Browser & device User agent, platform, vendor, language, touch support, Do-Not-Track flag
Performance timing Time to First Byte (TTFB), DOM content loaded, full page load time, server response time
Engagement Scroll depth milestones (25%, 50%, 75%, 90%, 100%), engagement time via heartbeat, visibility state
Click tracking Outbound link clicks, file download clicks (PDF, ZIP, CSV, XLSX, etc.)
Campaign & attribution UTM parameters, Google/Facebook/Microsoft/TikTok/LinkedIn click IDs
Environment Network type & speed, color scheme preference, reduced motion preference, ad blocker detection, battery status
Meta & SEO Open Graph meta tags (og:title, og:type, og:url, og:description)

The tracker respects Do-Not-Track — when DNT is enabled, only a minimal subset of fields is sent.

Lightweight footprint

The tracker script is small and loads asynchronously. It does not inject any visible DOM elements or block page rendering.

Step 3 — Use a Standalone Image Pixel

If you don't want to load JavaScript at all — or if you're tracking from HTML emails, AMP pages, RSS feeds, or other environments where scripts can't run — the image pixel works as a fully standalone tracking method:

1
2
<img src="https://api.anosys.ai/ingestion/YOUR_UNIQUE_PATH/anosys.gif?s1=homepage&s2=newsletter_campaign"
     width="0" height="0">

This fires an HTTP request on load using an invisible 0×0 image. It works everywhere an <img> tag can render — no JavaScript required.

You can attach custom fields as query parameters on the URL using the same s1, s2, n1, n2, b1 convention described below. This makes the image pixel a simple yet powerful option for lightweight tracking.

For more on image pixels, see the Image Pixels documentation.

Step 4 — Track Custom Events with URL Fields

Both the JavaScript tag and the image pixel support custom fields piggybacked on the URL. These let you track anything specific to your business — logged-in users, purchase amounts, A/B test variants, page categories, and more.

Field naming convention

Field Pattern Type Example Use Case
s1, s2, s3, … String User ID, page category, experiment variant, region
n1, n2, n3, … Numeric Cart value, load time (ms), scroll depth (%), item count
b1, b2, b3, … Boolean Is premium user, is mobile, has ad blocker, is logged in

In the JavaScript tag

Pass custom fields by setting variables before the tracking script loads. They are piggybacked onto the request URL automatically:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
<!-- Anosys Custom Event Tracking -->
<script type="text/javascript">
var anosys_project = "YOUR_PROJECT_ID";

// Custom fields — piggybacked on the tracking URL
var s1 = getUserId();       // string: user identifier
var n1 = getPageLoadMs();   // number: page load time in ms
var b1 = isPremiumUser();   // boolean: premium flag
</script>

<script async type="text/javascript"
  src="https://api.anosys.ai/customstats.js"></script>

In the image pixel

Append custom fields directly as query parameters:

1
2
<img src="https://api.anosys.ai/ingestion/YOUR_UNIQUE_PATH/anosys.gif?s1=checkout&s2=us-east-1&n1=42.5&b1=true"
     width="0" height="0">

Every field you send is automatically indexed and queryable in the Anosys dashboards — no schema configuration required. You can use as many fields as you need.

For a complete reference, see the Data Ingestion docs.

Step 5 — Track Performance from the Backend

Client-side JavaScript can't see everything. Server response times, database query latency, cache hit ratios, and API error rates all live on the backend. Anosys handles this with a simple REST API — send an HTTP GET or POST from any language and data appears in your dashboards within seconds.

Python Example

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
import requests
import time

# Your unique Anosys ingestion path
url = "https://api.anosys.ai/ingestion/YOUR_UNIQUE_PATH"

# Measure and report server-side latency
start = time.time()
# ... your application logic here ...
latency_ms = (time.time() - start) * 1000

params = {
    "s1": "checkout_page",    # string: page or endpoint name
    "n1": latency_ms,         # number: server processing time
    "s2": "us-east-1",        # string: region or server ID
    "n2": 200                  # number: HTTP status code
}

try:
    response = requests.get(url, params=params, timeout=10)
    response.raise_for_status()
except requests.exceptions.RequestException as e:
    print("Anosys ingestion error:", e)

cURL Example

The same call from a shell script, cron job, or CI/CD pipeline:

1
2
3
4
5
curl -G "https://api.anosys.ai/ingestion/YOUR_UNIQUE_PATH" \
  --data-urlencode "s1=checkout_page" \
  --data-urlencode "n1=42.5" \
  --data-urlencode "s2=us-east-1" \
  --data-urlencode "n2=200"

All fields are indexed and queryable. For more details, see the REST API documentation.

Step 6 — Build Dashboards and Monitor

Once data is flowing, open the Anosys Console to start building dashboards. Every field you send — whether from the JavaScript tag, image pixel, or REST API — is available for charting, filtering, and alerting.

What you can build:

  • Traffic overview — page views, unique visitors, sessions, and bounce rate over time
  • Top pages report — rank pages by views, engagement, or custom metrics
  • Geographic breakdown — see where your visitors come from
  • Performance monitoring — track server-side latency and frontend load times side by side
  • Conversion funnels — use custom string fields to tag funnel stages and measure drop-off
  • Engagement analysis — scroll depth, time on page, outbound click patterns

Dashboards refresh in real time as new data arrives. You can also use the agentic AI interface to describe a dashboard in plain English and have it generated automatically.

Step 7 — Detect Anomalies Automatically

This is where Anosys separates itself from standard web analytics tools. Instead of staring at dashboards hoping to notice something wrong, the platform runs statistical and ML-based anomaly detection on every ingested metric — continuously, in real time.

Anosys anomaly detection identifies a latency spike and fires an automated alert — no manual threshold configuration required.

How it works:

  • Automatic baselines — the platform learns hourly, daily, and weekly traffic patterns and flags deviations without manual threshold configuration.
  • Latency anomaly detection — a sudden spike in response time triggers an alert before users start complaining.
  • Traffic anomaly detection — unexpected drops or spikes in page views (bot traffic, DDoS, broken deploys) are surfaced automatically.
  • Root cause correlation — when multiple metrics spike at the same time (e.g., latency goes up and traffic drops), Anosys groups them and surfaces the likely root cause.

Set up alerts:

Get notified where you already work:

  • Slack — anomaly notifications delivered to your team's channel within seconds
  • Email — alert summaries on a schedule or instantly for critical events
  • Custom thresholds — define your own static or dynamic rules alongside the automatic detection

Combining Frontend and Backend Data

One of the main advantages of using a single observability platform for website tracking is correlation. Most analytics tools only see the frontend. Most APM tools only see the backend. With Anosys, both streams land in the same system.

A practical example: the JavaScript tracker captures page load timing (TTFB, DOM content loaded, full load time) from the browser, while your backend reports server processing time via the REST API (using n1 for latency in ms). In the Anosys dashboard, you can chart both on the same timeline and immediately see whether a slow user experience is caused by frontend rendering or backend processing.

This client-server correlation is native — no additional configuration, no data joins, no third-party glue.

Correlate with AI agent telemetry too

If your website is powered by AI features (chatbots, recommendations, search), you can use the OpenAI Agents or Anthropic Agents integrations to send model traces into the same Anosys workspace. This lets you correlate user-facing performance with model latency and token costs in a single view.

Full Integration Example

Here's a complete, copy-paste-ready setup for a website that tracks page views with the JavaScript tag, extends tracking with custom fields, and reports server performance from a Python backend:

Frontend (HTML)

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>My Website</title>

  <!-- Anosys Tracking with custom fields -->
  <script type="text/javascript">
  var anosys_project = "YOUR_PROJECT_ID";
  var s1 = document.title;                                    // page title
  var n1 = performance.now();                                  // time to render (ms)
  var b1 = /Mobi|Android/i.test(navigator.userAgent);         // is mobile
  </script>
  <script async src="https://api.anosys.ai/customstats.js"></script>
  <noscript>
    <img src="https://api.anosys.ai/ingestion/YOUR_UNIQUE_PATH/anosys.gif?s1=my-page"
         referrerPolicy="no-referrer-when-downgrade" width="0" height="0">
  </noscript>
</head>
<body>
  <h1>Welcome</h1>
  <!-- your page content -->
</body>
</html>

Backend (Python / Flask)

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
import time
import requests
from flask import Flask, request

app = Flask(__name__)
ANOSYS_URL = "https://api.anosys.ai/ingestion/YOUR_UNIQUE_PATH"

@app.before_request
def start_timer():
    request._start_time = time.time()

@app.after_request
def report_to_anosys(response):
    latency_ms = (time.time() - request._start_time) * 1000
    try:
        requests.get(ANOSYS_URL, params={
            "s1": request.path,              # endpoint
            "n1": round(latency_ms, 2),      # latency in ms
            "n2": response.status_code,      # HTTP status
            "s2": request.remote_addr,       # client IP (or hash it)
        }, timeout=2)
    except Exception:
        pass  # non-blocking; don't let analytics failures break your app
    return response

Why Anosys vs. Google Analytics or Datadog

Capability Google Analytics Datadog Anosys
Page view tracking ✅ ❌ (not its focus) ✅
Custom event fields Limited ✅ ✅ (unlimited indexed fields)
Server-side latency monitoring ❌ ✅ ✅
Client + server correlation ❌ Requires setup ✅ (native, same pixel)
ML anomaly detection ❌ ✅ (extra cost) ✅ (included)
AI agent observability ❌ ❌ ✅ (OpenAI, Anthropic, any OTEL)
Standalone image pixel (no-JS) ❌ ❌ ✅
Scroll depth & engagement Plugin required ✅ ✅ (automatic)
Pricing model Free / per-property Per-host + per-GB Per-GB (no seat charges)
Setup time Medium High Minutes

Google Analytics is built for marketing teams. Datadog is built for infrastructure teams. Anosys sits in the middle — it handles web analytics and backend observability in one platform, so you don't need two separate tools (and two separate bills) to understand how your website is actually performing.

Next Steps