Guide

Tracking Architectures

From copy-and-paste client tags to hybrid server-side setups — explore diagrams, tradeoffs, and when not to use each pattern.

Architecture Overview

Six patterns from simple client-side tags to hybrid and CDN-based setups. Select one to jump to the full section.

Complexity of Tracking Architectures

“Copy & Paste — How We Tracked Data in the Last Century”
1 Simple

Client-Side Tracking / Tagging

A third-party JavaScript library is loaded onto the website, providing external functionality or tracking features. User and browser data is extracted from the website and sent directly to the third-party vendor for processing or tracking.

JavaScript Integration on the Website

  • Direct Integration (Hardcoded) Snippet is embedded directly into the website's codebase.
  • Integration via Tag Management System (TMS) Loaded dynamically through a Tag Management System, allowing for more flexibility and easier updates.
Simple

Client-Side Tracking / Tagging

JavaScript Snippet Integration

Simple Setup — External Control

  • Quick copy/paste integration
  • Script runs in the browser and automates tracking
  • Sends required data directly to the third-party vendor
  • Versioning handled externally by the vendor

img Tag-Based Integration

Custom Setup — Full Ownership

  • Manual setup: you must add data to the stream yourself
  • Full control over cookie & storage management (e.g., Click-IDs)
  • Enhanced data governance — data remains under your control
  • Versioning managed by your own system
2 Simple

Gateways

One First-Party JavaScript Snippet

  • Injected into the website to send data to a first-party server-side endpoint (via A-Record)

Loads Vendor JavaScript Library

  • Initializes the vendor-specific data layer in the browser
  • Tracks client-side events and sends them to the tracking gateway endpoint

Unified Data Collection & Forwarding

  • Collects standardized event streams from the browser or other sources

No Traditional Tag Management System (TMS)

  • Clean architecture: no layered tag management overhead
  • Easier to audit, maintain, and govern
6 Simple

CDN Tracking

Better Performance & Privacy

  • Less script weight in the browser, less main-thread work, and often cleaner page rendering.
  • Less uncontrolled third-party script execution in the browser.

No code required for many basic setups

  • Faster deployment for standard analytics and marketing integrations.

Not everything can be treated like classic client-side tag management

  • For highly custom browser behaviors, client-side tag managers can still feel more direct and flexible.

Less transparent browser-side debugging

  • Teams used to Chrome DevTools plus vendor pixel helpers may find troubleshooting less intuitive.

Complexity of Tracking Architectures

“Builds on simple tracking by increasing data accuracy and reliability.”
3 Medium

Server Side Tracking

Best Data Quality

  • HTTP requests are sent directly from the server backend to third-party vendors.
  • High data quality and reliability.

No Client-Side Dependencies

  • No reliance on browser data or client-side execution for tracking.

High Implementation Complexity

  • Requires advanced backend infrastructure and setup
  • Consent handling must be implemented server-side
  • Increased development and integration effort
  • Ongoing maintenance and monitoring required
  • Higher entry barrier compared to client-side solutions
4 Medium

Server Side Tagging

Centralized Data Collection

  • Single first-party JavaScript snippet sends data to your server-side endpoint
  • Reduces reliance on multiple third-party scripts in the browser
  • Simplifies frontend implementation

Full Data Control & Ownership

  • Build and enrich your own first-party data
  • Define exactly what data is shared with each vendor

Implementation & Setup Effort

  • Requires server-side infrastructure
  • Initial setup is more complex than client-side tagging

Consent & Compliance Complexity

  • Responsibility for legal compliance shifts to your backend

Complexity of Tracking Architectures

“Combine multiple tracking architectures to maximize the value of your data.”
5 Expert

Hybrid Tagging

High Data Quality

  • HTTP requests are sent directly from the server to third-party vendors.
  • This improves reliability and helps preserve data quality.

Additional Client-Side Signals

  • Capture browser-based information that is only available on the client side.
  • This helps you get more value from supported browsers and enrich your tracking data.

High Implementation Complexity

  • Hybrid tagging requires coordination between client-side and server-side tracking layers.
  • Deduplication, consistent event mapping, and consent handling increase implementation effort.

A Modern Tracking Architecture

A combined reference view of how first-party collection, consent, enrichment, deduplication, and vendor forwarding fit together.