Outbrain Server-Side vs Client-Side Tracking

Overview

Outbrain supports both client-side (browser-based pixel) and server-side (Conversion API) tracking methods. Each approach has distinct advantages and trade-offs. Understanding these differences helps you choose the right implementation for your business needs and technical constraints.

Client-Side Tracking (Browser Pixel)

How It Works

1. JavaScript pixel code loads in user's browser
2. Pixel fires when user visits page or completes action
3. Browser sends tracking data directly to Outbrain servers
4. Outbrain sets and reads first-party cookies for attribution

Implementation

// Base pixel loads on all pages
<script type="text/javascript">
  !function(_window, _document) {
    var OB_ADV_ID = 'YOUR_PIXEL_ID';
    // ... pixel code ...
  }(window, document);

  obApi('track', 'PAGE_VIEW');
</script>

// Conversion pixel fires on conversion pages
<script type="text/javascript">
  obApi('track', 'Conversion', {
    orderValue: 99.99,
    orderId: 'ORD-12345',
    currency: 'USD'
  });
</script>

Advantages

1. Easy Implementation

• Copy-paste JavaScript snippet into site templates or GTM
• No backend development required
• Marketers can deploy without engineering support

2. Real-Time Tracking

• Events fire immediately when user action occurs
• Minimal latency between action and tracking
• No server-side queue or batch processing delays

3. Automatic Cookie Management

• Pixel automatically sets and reads cookies for attribution
• Handles click ID persistence and user identification
• No manual session management needed

4. Rich Client Context

• Access to browser information (user agent, screen resolution, language)
• JavaScript can capture DOM events, scroll depth, time on page
• Easier to track client-side interactions (button clicks, video plays)

5. Lower Server Load

• Tracking requests go directly from browser to Outbrain
• No additional load on your application servers
• Reduces backend infrastructure costs

Disadvantages

1. Ad Blocker Vulnerability

• Browser extensions and privacy tools block tracking pixels
• Can lose 15-30% of conversions depending on audience
• No tracking data for users with blockers enabled

2. Cookie Restrictions

• Third-party cookie blocking in Safari, Firefox, and Chrome (planned)
• ITP (Intelligent Tracking Prevention) limits cookie lifetime
• Privacy modes and incognito browsing prevent tracking

3. JavaScript Dependency

• Requires JavaScript enabled in browser
• Pixel won't fire if JS is disabled or errors occur
• Page load performance can affect pixel execution

4. Limited Offline Conversion Tracking

• Can't track phone orders, in-store purchases, or CRM conversions
• No way to upload historical conversion data
• Difficult to implement delayed attribution (e.g., 30-day trial conversions)

5. Client-Side Data Exposure

• Tracking logic visible in browser source code
• Users can inspect and potentially manipulate data sent to pixel
• Sensitive business logic exposed in client code

6. Network Reliability

• If user closes browser before pixel fires, conversion may not be tracked
• Poor network conditions can cause request failures
• No automatic retry mechanism for failed requests

Best Use Cases

• Content publishers tracking page views and engagement
• Lead generation sites with simple form submissions
• Ecommerce sites with standard checkout flows
• Teams without backend resources for server-side implementation
• Fast deployment when time-to-market is critical

Server-Side Tracking (Conversion API)

How It Works

1. User action triggers event on your backend server
2. Your server sends conversion data to Outbrain's API via HTTPS POST
3. API matches conversion to original click using click ID or hashed user data
4. Outbrain attributes conversion to campaign in Amplify dashboard

Implementation

Node.js Example:

const axios = require('axios');

async function sendOutbrainConversion(conversionData) {
  try {
    const response = await axios.post(
      'https://api.outbrain.com/amplify/v1/conversions',
      {
        click_id: conversionData.obClickId,
        conversion_timestamp: new Date().toISOString(),
        conversion_value: conversionData.revenue,
        transaction_id: conversionData.orderId,
        currency: conversionData.currency,
        hashed_email: hashEmail(conversionData.email)
      },
      {
        headers: {
          'Authorization': `Bearer ${process.env.OUTBRAIN_API_TOKEN}`,
          'Content-Type': 'application/json'
        }
      }
    );

    console.log('Conversion sent to Outbrain:', response.data);
    return response.data;
  } catch (error) {
    console.error('Outbrain API error:', error.response?.data);
    throw error;
  }
}

function hashEmail(email) {
  const crypto = require('crypto');
  return crypto.createHash('sha256').update(email.toLowerCase().trim()).digest('hex');
}

Python Example:

import requests
import hashlib
import os
from datetime import datetime

def send_outbrain_conversion(conversion_data):
    payload = {
        'click_id': conversion_data['ob_click_id'],
        'conversion_timestamp': datetime.utcnow().isoformat(),
        'conversion_value': conversion_data['revenue'],
        'transaction_id': conversion_data['order_id'],
        'currency': conversion_data['currency'],
        'hashed_email': hash_email(conversion_data['email'])
    }

    headers = {
        'Authorization': f"Bearer {os.environ['OUTBRAIN_API_TOKEN']}",
        'Content-Type': 'application/json'
    }

    response = requests.post(
        'https://api.outbrain.com/amplify/v1/conversions',
        json=payload,
        headers=headers
    )

    if response.status_code == 200:
        print('Conversion sent successfully')
        return response.json()
    else:
        print(f'Error: {response.status_code} - {response.text}')
        raise Exception(f'Outbrain API error: {response.text}')

def hash_email(email):
    return hashlib.sha256(email.lower().strip().encode()).hexdigest()

Advantages

1. Ad Blocker Immunity

• Tracking happens server-to-server, bypassing browser blockers
• Captures conversions from users with privacy tools enabled
• Recovers 15-30% more conversions compared to pixel-only tracking

2. Cookie-Independent

• Doesn't rely on browser cookies or client-side storage
• Works in privacy modes, incognito browsing, and cookie-less environments
• Future-proof against browser cookie restrictions and ITP

3. Reliable Delivery

• Backend can retry failed API calls automatically
• Queue and batch conversions during API downtime
• Guaranteed delivery through persistent storage and retries

4. Offline Conversion Support

• Upload phone orders, in-store sales, or CRM conversions
• Track delayed conversions (e.g., trial-to-paid after 30 days)
• Import historical conversion data for attribution analysis

5. Enhanced Data Security

• Conversion logic hidden on server, not exposed to users
• Reduced risk of data manipulation or fraud
• Securely handle sensitive data (PII, transaction details) without client exposure

6. Improved Attribution

• Send hashed email/phone for better user matching
• Include server-side context (user ID, CRM data, LTV)
• More accurate multi-device and cross-session attribution

7. Data Enrichment

• Augment conversions with backend data (customer segment, LTV, profit margin)
• Join with CRM, inventory, or analytics databases
• Send richer event parameters not available client-side

Disadvantages

1. Backend Development Required

• Requires engineering resources to implement and maintain
• More complex than copy-paste pixel deployment
• Longer time-to-market for initial implementation

2. API Authentication & Security

• Need to securely store and rotate API credentials
• Manage token expiration and renewal
• Monitor for API key leaks or unauthorized access

3. Rate Limiting & Quotas

• API may have rate limits or daily quotas
• Need to implement throttling and queue management
• High-volume sites may require batching or special arrangements

4. Latency in Reporting

• Slight delay between conversion and API call (depends on backend processing)
• Not real-time if conversions are queued or batched
• Can impact immediate campaign optimization decisions

5. Click ID Management

• Must capture and persist Outbrain click ID from landing page
• Requires database or session storage to maintain click ID through funnel
• Additional logic to match conversions to clicks

6. No Automatic Page View Tracking

• Server-side API doesn't track page views or engagement by default
• Need separate client-side pixel for audience building and retargeting
• Hybrid approach required for full funnel visibility

7. Debugging Complexity

• Harder to troubleshoot compared to browser DevTools
• Requires server log access and API response monitoring
• Can't easily test with browser extensions or preview modes

Best Use Cases

• High-value conversions where accuracy is critical (enterprise SaaS, financial services)
• Privacy-conscious industries (healthcare, finance) with strict data handling requirements
• Offline conversion tracking (call centers, retail stores, CRM systems)
• Sites with ad blocker-heavy audiences (tech, developer, privacy-focused communities)
• Delayed conversions (free trial to paid, lead to customer over weeks/months)
• Multi-device journeys where user switches devices between click and conversion

Hybrid Approach: Client-Side + Server-Side

Why Use Both?

Combining client-side pixel with server-side API provides maximum coverage and reliability.

Benefits:

• Redundancy: If pixel is blocked, API captures conversion
• Immediate tracking: Pixel fires in real-time, API provides backup
• Rich data: Pixel tracks engagement, API tracks conversions
• Deduplication: Use unique transaction IDs to prevent double-counting

Implementation Strategy

1. Client-Side: Page Views & Engagement

Deploy pixel for all page views, add-to-cart, and engagement events:

// Track page views and engagement with pixel
obApi('track', 'PAGE_VIEW');
obApi('track', 'AddToCart', { productId: 'PROD-123', productValue: 29.99 });

2. Server-Side: High-Value Conversions

Send critical conversions (purchases, leads) via API from backend:

// On server after order is committed to database
await sendOutbrainConversion({
  obClickId: order.obClickId,
  revenue: order.total,
  orderId: order.id,
  currency: order.currency,
  email: customer.email
});

3. Deduplication with Unique Transaction IDs

Both pixel and API include same orderId to prevent double-counting:

// Client-side pixel
obApi('track', 'Conversion', {
  orderId: 'ORD-12345',  // Unique transaction ID
  orderValue: 99.99,
  currency: 'USD'
});

// Server-side API (same transaction ID)
await sendOutbrainConversion({
  transaction_id: 'ORD-12345',  // Same ID
  conversion_value: 99.99,
  currency: 'USD'
});

Outbrain automatically deduplicates conversions with matching transaction IDs.

Recommended Hybrid Configuration

Decision Matrix: Which Approach to Use?

Choose Client-Side Pixel If:

• ✓ You need quick deployment without backend changes
• ✓ Marketing team needs to manage tracking independently
• ✓ Tracking page views, engagement, and lower-funnel events
• ✓ Audience has low ad blocker usage
• ✓ Simple ecommerce or lead gen site
• ✓ Limited engineering resources
• ✓ Real-time event tracking is essential

Choose Server-Side API If:

• ✓ High-value conversions where accuracy is critical
• ✓ Audience has high ad blocker or privacy tool usage
• ✓ Need to track offline conversions (phone, in-store, CRM)
• ✓ Privacy regulations require minimizing client-side tracking
• ✓ Delayed conversions (trials converting weeks later)
• ✓ Complex multi-device or cross-session user journeys
• ✓ Engineering team available for implementation and maintenance

Choose Hybrid Approach If:

• ✓ Want maximum conversion coverage and reliability
• ✓ Critical that no conversions are missed
• ✓ Need both real-time engagement data and accurate conversion attribution
• ✓ Have resources for both pixel and API implementation
• ✓ Running high-spend campaigns where ROI accuracy matters
• ✓ Compliance requires server-side tracking but want pixel as backup

Migration Path: Pixel to Server-Side

If transitioning from client-side to server-side tracking:

Phase 1: Assessment (Week 1)

• Audit current pixel implementation
• Estimate conversion loss due to ad blockers (compare pixel conversions to backend orders)
• Document backend architecture and identify integration points
• Secure API credentials from Outbrain

Phase 2: Development (Weeks 2-4)

• Capture Outbrain click ID from landing pages, store in session/database
• Implement API integration on conversion completion endpoint
• Add error handling, retry logic, and logging
• Test in staging environment with test conversions

Phase 3: Parallel Tracking (Weeks 5-6)

• Deploy server-side tracking to production alongside existing pixel
• Monitor both channels for conversion volume and accuracy
• Compare attribution between pixel and API
• Verify deduplication is working (no double-counting)

Phase 4: Optimization (Week 7+)

• Adjust attribution windows if needed
• Fine-tune enhanced matching (hashed email/phone)
• Gradually shift campaign optimization to rely on API data
• Optionally reduce reliance on pixel for critical conversions

Performance & Scalability Considerations

Client-Side Pixel

• Page load impact: Minimal (async script loading)
• Scalability: Scales with user traffic, no server load
• Monitoring: Use Real User Monitoring (RUM) to track pixel performance

Server-Side API

• API latency: Typically 100-500ms per request
• Scalability: Must handle API rate limits and quotas
• Retry strategy: Implement exponential backoff for failed requests
• Monitoring: Track API success rate, latency, and error codes

Hybrid Approach

• Complexity: Higher operational complexity managing two tracking methods
• Cost: May require additional infrastructure for API integration
• Benefit: Maximum reliability and conversion coverage

Compliance & Privacy Implications

Client-Side Pixel

• GDPR/CCPA: Requires user consent before firing pixel
• Cookie consent: Must integrate with consent management platform (CMP)
• Data exposure: User can see tracking code and data sent

Server-Side API

• Privacy-friendly: Less reliance on browser cookies
• Server logs: Ensure backend logging complies with data retention policies
• PII handling: Hash emails/phones before sending to API

Best Practices

• Always hash PII (email, phone) with SHA-256 before sending
• Respect user opt-outs: check consent before sending conversions (client or server)
• Document data flows for privacy impact assessments
• Use HTTPS for all tracking requests (client and server)

Troubleshooting Comparison

Implementation Checklist

Client-Side Pixel

• Pixel code obtained from Amplify dashboard
• Base pixel deployed on all site pages
• Conversion pixel on post-conversion pages
• GTM container configured (if using Tag Manager)
• Tested in browser DevTools Network tab
• Test conversions appear in Amplify
• Consent management integration (GDPR/CCPA)

Server-Side API

• API credentials obtained and securely stored
• Click ID captured from landing page URLs
• Click ID persisted in session or database
• API integration implemented on conversion endpoint
• Error handling and retry logic added
• Test conversions sent successfully (HTTP 200)
• Conversions appear in Amplify with correct attribution
• Monitoring and alerting for API errors
• PII hashing implemented (SHA-256)

Hybrid Approach

• Both pixel and API implemented
• Unique transaction IDs used for deduplication
• Conversion volume monitored on both channels
• Discrepancies between pixel and API investigated
• Attribution accuracy validated in Amplify
• Runbook created for troubleshooting both methods