একটি SvelteKit অ্যাপে গোপনীয়তা-প্রথম অ্যানালিটিক্স যোগ করা

SvelteKit 2 বেশিরভাগ বিদ্যমান অ্যানালিটিক্স ইন্টিগ্রেশন নীরবে ভেঙে দিয়েছে। একটি সাধারণ <script> ট্যাগ যা SvelteKit 1-এ ভালো কাজ করত তা SvelteKit 2-এ শুধু হার্ড রিলোডে ট্রিগার হবে, প্রতিটি ক্লায়েন্ট-সাইড নেভিগেশন মিস করবে। স্ট্যান্ডার্ড ফিক্স — history.pushState হুকিং — কাজ করে না, কারণ SvelteKit pushState কল করার আগে রাউটার স্তরে নেভিগেশন ইন্টারসেপ্ট করে। Monoid ট্র্যাকার এটি বাক্সের বাইরে সঠিকভাবে পরিচালনা করে।

কেন স্বাভাবিক পদ্ধতি ব্যর্থ হয়

প্রচলিত অ্যানালিটিক্স স্ক্রিপ্ট history.pushState এবং history.replaceState মাঙ্কি-প্যাচ করে রুট পরিবর্তন সনাক্ত করে। SvelteKit-এর রাউটার তার নিজস্ব অভ্যন্তরীণ নেভিগেশন প্রিমিটিভ কল করে এবং শুধুমাত্র একটি সাইড ইফেক্ট হিসেবে pushState কল করে, রুট ট্রানজিশন ইতিমধ্যে অগ্রগতিতে থাকার পরে। যে সময়ে প্যাচ করা pushState ট্রিগার হয়, নতুন রুট হয়তো পুরোপুরি রেন্ডার নাও হতে পারে এবং কিছু নেভিগেশন টাইপে (প্রোগ্রাম্যাটিক goto() কল, প্রিলোডিং সহ <a> ক্লিক) সময় ডুপ্লিকেট বা মিস হওয়া ইভেন্ট তৈরি করে।

এটি SvelteKit 2 অ্যাপ্লিকেশনগুলোতে Google Analytics GA4 প্রাথমিক লোডে শুধু প্রথম পেজভিউ রেকর্ড করে এমন ব্যাপকভাবে রিপোর্ট করা সমস্যার মূল কারণ।

সঠিক পদ্ধতি

আপনার রুট +layout.svelte-এ <svelte:head> ব্যবহার করে একবার Monoid ট্র্যাকার স্ক্রিপ্ট যোগ করুন:

<svelte:head>
  <script
    async
    src="https://api.monoid.website/tracker.min.js"
    data-site-id="YOUR_SITE_ID"
  ></script>
</svelte:head>

ট্র্যাকারের বিল্ট-ইন DOMContentLoaded লিসেনার প্রাথমিক পেজ লোডে ট্রিগার হয়। পরবর্তী ক্লায়েন্ট-সাইড নেভিগেশনের জন্য, ট্র্যাকারের history.pushState হুক SvelteKit-এর অভ্যন্তরীণ নেভিগেশন সমাধান হওয়ার পরে ট্রিগার হয় — যার অর্থ প্রতিটি রুট, প্রথমটি সহ, ডুপ্লিকেট বা মিস হওয়া ইভেন্ট ছাড়াই ঠিক একবার ট্র্যাক করা হয়।

যাচাই করতে, DevTools-এ Network ট্যাব খুলুন এবং /collect-এ POST অনুরোধগুলো দেখুন। আপনি প্রতিটি রুট পরিবর্তনে একটি দেখতে পাবেন।

স্টেজিং ট্রাফিক আলাদা করা

SvelteKit প্রকল্পগুলো সাধারণত ডেভেলপমেন্টের সময় localhost-এ চলে। একটি পৃথক সাইট নিবন্ধন করুন এবং এর site_id একটি এনভায়রনমেন্ট ভ্যারিয়েবলে বাঁধুন যাতে ডেভেলপমেন্ট ট্রাফিক কখনোই প্রোডাকশন মেট্রিকগুলোকে দূষিত না করে:

<script>
  const siteId = import.meta.env.VITE_MONOID_SITE_ID
</script>

<svelte:head>
  {#if siteId}
    <script
      async
      src="https://api.monoid.website/tracker.min.js"
      data-site-id={siteId}
    ></script>
  {/if}
</svelte:head>

ডেভেলপমেন্টের জন্য .env.local-এ VITE_MONOID_SITE_ID সেট করুন (অথবা ট্র্যাকিং দমন করতে অসেট রাখুন) এবং প্রোডাকশনের জন্য আপনার ডিপ্লয়মেন্ট পরিবেশে। {#if siteId} ব্লক নিশ্চিত করে যে ভ্যারিয়েবল সেট না থাকলে ট্র্যাকার কখনো ইনজেক্ট করা হবে না।

আপনার যা প্রয়োজন নেই

কোনো কুকি কনসেন্ট ব্যানার নেই। কোনো কুকি নীতি আপডেট নেই। কোনো navigator.cookieEnabled চেক নেই। কালেকশন এন্ডপয়েন্ট IP অ্যাড্রেস, User-Agent, একটি সার্ভার-সাইড সিক্রেট এবং বর্তমান তারিখ থেকে একটি দৈনিক ভিজিটর হ্যাশ উদ্ভূত করে:

visitor_hash = SHA-256(IP + UA + SALT_SECRET + YYYY-MM-DD)

হ্যাশ প্রতি 24 ঘণ্টায় রিসেট হয় এবং IP বা User-Agent পুনরুদ্ধার করতে বিপরীত করা যায় না। দর্শনার্থীর ডিভাইসে কিছুই সংরক্ষণ করা হয় না। এর অর্থ হলো ইন্টিগ্রেশনটি ePrivacy বা PECR কনসেন্ট প্রয়োজনীয়তা ট্রিগার করে না — কনসেন্ট দেওয়ার মতো কিছু নেই।

ড্যাশবোর্ডে যাচাই করা

ডিপ্লয় করার পরে, আপনার অ্যানালিটিক্স ড্যাশবোর্ড খুলুন এবং আপনার লাইভ সাইটে বেশ কয়েকটি রুটের মধ্যে নেভিগেট করুন। প্রতিটি নেভিগেশন সঠিক পাথ সহ একটি নতুন পেজভিউ এন্ট্রি উৎপাদন করবে। আপনি যদি নেভিগেশন নির্বিশেষে শুধু একটি এন্ট্রি দেখেন, চেক করুন যে স্ক্রিপ্টটি রুট লেআউটে লোড হয়েছে এবং VITE_MONOID_SITE_ID প্রোডাকশন পরিবেশে সেট করা আছে।

আপনি যে SvelteKit অ্যাডাপ্টার ব্যবহার করেন (Cloudflare, Vercel, Node, static) তা অ্যানালিটিক্স সংগ্রহকে প্রভাবিত করে না, যেহেতু হাইড্রেশনের পরে সম্পূর্ণরূপে ব্রাউজারে ট্র্যাকিং ঘটে।