Landing Page Engineering for Indian D2C & B2B

[User Taps Meta Ad in Mumbai / Jaipur]
                 │
                 ▼ (0.0s – 1.0s) Network latency & DNS handshake
                 │
                 ▼ (1.0s – 2.5s) Third-party page builder executes 2MB scripts
                 │
                 ▼ (2.5s – 4.0s) Unoptimized images & font files downloading
                 │
                 ▼ (4.2s) ─────► 46% OF USERS BOUNCE BEFORE PAGE RENDERS
                 │
                 ▼ (5.0s+) Only high-intent survivors see your offer

// app/api/track-conversion/route.ts
import { NextRequest, NextResponse } from 'next/server';
import crypto from 'crypto';

function hashData(value: string): string {
  return crypto.createHash('sha256').update(value.trim().toLowerCase()).digest('hex');
}

export async function POST(req: NextRequest) {
  try {
    const { email, phone, value, currency = 'INR', eventName = 'Lead' } = await req.json();

    const clientIp = req.headers.get('x-forwarded-for') || '127.0.0.1';
    const userAgent = req.headers.get('user-agent') || '';

    const payload = {
      data: [
        {
          event_name: eventName,
          event_time: Math.floor(Date.now() / 1000),
          action_source: 'website',
          user_data: {
            em: email ? [hashData(email)] : undefined,
            ph: phone ? [hashData(phone)] : undefined,
            client_ip_address: clientIp,
            client_user_agent: userAgent,
          },
          custom_data: {
            currency: currency,
            value: value,
          },
        },
      ],
    };

    const pixelId = process.env.META_PIXEL_ID;
    const accessToken = process.env.META_ACCESS_TOKEN;

    const res = await fetch(`https://graph.facebook.com/v19.0/${pixelId}/events?access_token=${accessToken}`, {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify(payload),
    });

    const result = await res.json();
    return NextResponse.json({ success: true, metaResponse: result });
  } catch (error: any) {
    return NextResponse.json({ success: false, error: error.message }, { status: 500 });
  }
}