Clicky Server-Side vs Client-Side Tracking

Tracking Approaches Overview

Clicky supports both client-side (JavaScript) and server-side (API) tracking. Each approach has distinct advantages depending on your requirements.

Client-Side Tracking

How It Works

The JavaScript tracking code runs in the visitor's browser, capturing interactions and sending data to Clicky's servers.

<script>
  var clicky_site_ids = clicky_site_ids || [];
  clicky_site_ids.push(YOUR_SITE_ID);
</script>
<script async src="//static.getclicky.com/js"></script>

Advantages

• Easy implementation: Just add the script
• Rich data collection: Browser info, screen size, JavaScript events
• Heatmaps: Requires client-side for visual tracking
• Real-time updates: Immediate data flow

Disadvantages

• Ad blockers: Some visitors block tracking scripts
• JavaScript required: No tracking if JS is disabled
• Performance impact: Additional script to load
• Privacy concerns: Client-side scripts are visible

Best For

• Standard website analytics
• Heatmap and session recording needs
• Event tracking on interactive elements
• Quick implementation without backend changes

Server-Side Tracking

How It Works

Your server sends tracking data directly to Clicky's API, bypassing the browser entirely.

# Basic tracking pixel approach
curl "https://in.getclicky.com/in.php?site_id=YOUR_SITE_ID&type=pageview&href=/page&title=Page%20Title"

API Parameters

Server-Side Implementation

PHP Example:

function trackClicky($page, $title, $type = 'pageview') {
    $params = http_build_query([
        'site_id' => YOUR_SITE_ID,
        'sitekey_admin' => YOUR_ADMIN_KEY,
        'type' => $type,
        'href' => $page,
        'title' => $title,
        'ip_address' => $_SERVER['REMOTE_ADDR'],
        'ua' => $_SERVER['HTTP_USER_AGENT'],
        'ref' => $_SERVER['HTTP_REFERER'] ?? ''
    ]);

    file_get_contents('https://in.getclicky.com/in.php?' . $params);
}

// Usage
trackClicky('/checkout/complete', 'Order Confirmation');

Node.js Example:

const https = require('https');

function trackClicky(page, title, visitorIP, userAgent) {
  const params = new URLSearchParams({
    site_id: YOUR_SITE_ID,
    sitekey_admin: YOUR_ADMIN_KEY,
    type: 'pageview',
    href: page,
    title: title,
    ip_address: visitorIP,
    ua: userAgent
  });

  https.get(`https://in.getclicky.com/in.php?${params.toString()}`);
}

Python Example:

import requests

def track_clicky(page, title, ip_address, user_agent):
    params = {
        'site_id': YOUR_SITE_ID,
        'sitekey_admin': YOUR_ADMIN_KEY,
        'type': 'pageview',
        'href': page,
        'title': title,
        'ip_address': ip_address,
        'ua': user_agent
    }
    requests.get('https://in.getclicky.com/in.php', params=params)

Advantages

• Ad blocker immune: Server requests can't be blocked by browsers
• Complete control: Choose exactly what data to send
• Better privacy: No client-side tracking script
• Reliable: Not dependent on JavaScript execution

Disadvantages

• More complex: Requires backend development
• Limited data: No automatic browser details without passing them
• No heatmaps: Client-side required for visual tracking
• Manual event tracking: Must explicitly track each interaction

Best For

• API-driven applications
• Privacy-focused implementations
• Tracking that must avoid ad blockers
• Backend events (webhooks, cron jobs, etc.)

Hybrid Approach

Combine both methods for comprehensive coverage:

<!-- Client-side for interactive tracking -->
<script>
  var clicky_site_ids = clicky_site_ids || [];
  clicky_site_ids.push(YOUR_SITE_ID);
</script>
<script async src="//static.getclicky.com/js"></script>

// Server-side for critical conversions
function trackConversion($orderId, $amount) {
    // Server-side tracking ensures this is captured
    // even if client-side was blocked
    $params = http_build_query([
        'site_id' => YOUR_SITE_ID,
        'sitekey_admin' => YOUR_ADMIN_KEY,
        'type' => 'goal',
        'goal' => 'purchase',
        'revenue' => $amount,
        'title' => 'Order #' . $orderId
    ]);
    file_get_contents('https://in.getclicky.com/in.php?' . $params);
}

Choosing Your Approach

Recommendation

• Most websites: Start with client-side, add server-side for critical events
• Privacy-focused: Server-side only, or hybrid with consent
• E-commerce: Hybrid for complete conversion tracking
• SPAs/APIs: Server-side for backend events, client-side for UI interactions