מה חדש בקוד המעקב Tracker.js

קוד המעקב של Agent Analytics קיבל שדרוג גדול.

דברים רבים שבעבר דרשו JavaScript מותאם אפשר עכשיו להגדיר באמצעות מאפייני HTML בלבד. נוסף על כך, הוספנו יכולות שהופכות את ההטמעה ואת בדיקות האיכות לפשוטות הרבה יותר.

מעקב הצהרתי אחרי אירועים

החידוש המרכזי: אפשר לעקוב אחרי אירועים בלי לכתוב JavaScript.

<button data-aa-event="signup" data-aa-event-plan="pro">
  הרשמה למסלול Pro
</button>

לחיצה על הכפתור תשלח signup עם { plan: "pro" }.

אפשר לצרף תכונות נוספות באמצעות data-aa-event-*:

<a href="/pricing"
   data-aa-event="cta_click"
   data-aa-event-id="hero_pricing"
   data-aa-event-section="hero">
  לצפייה בתמחור ←
</a>

כך הוספת מעקב בידי סוכן או מפתח הופכת למשימה כמעט טריוויאלית.

מעקב אחרי קישורים יוצאים

אם חשוב לכם לדעת לאן משתמשים יוצאים, אפשר לאפשר מעקב אוטומטי:

<script src="https://api.agentanalytics.sh/tracker.js"
  data-project="my-site"
  data-token="aat_..."
  data-track-outgoing="true"></script>

כל לחיצה על קישור חיצוני תיצור אירוע outgoing_link עם הכתובת, הטקסט ושם המארח.

זיהוי משתמשים

אחרי הרשמה או התחברות אפשר לחבר ביקור אנונימי למשתמש אמיתי:

window.aa.identify('user_123');

כך היסטוריית הגלישה והאירועים לפני ההתחברות לא הולכת לאיבוד.

גרסאות ניסוי עם HTML עשיר

ניסויים כבר לא מוגבלים להחלפת טקסט. אפשר לבדוק HTML עשיר:

<div data-aa-experiment="hero_test"
     data-aa-variant-b="<h1>השיקו מהר יותר</h1><p>הסוכן מטפל בשאר</p><img src='/new-hero.png'>">
  <h1>בנו טוב יותר</h1>
  <p>נתוני שימוש שהסוכן שלכם יכול לקרוא</p>
  <img src="/hero.png">
</div>

כך אפשר לבדוק מקטעים שלמים ולא רק כותרת אחת.

כפיית גרסאות לצורך בדיקות איכות

אפשר לכפות גרסה באמצעות כתובת העמוד:

https://my-site.com?aa_variant_hero_test=b

האפשרות שימושית לצילומי מסך, לבדיקות איכות ולשיתוף פנימי לפני העלאת הגרסה.

מעקב בין דומיינים

אם יש לכם כמה תתי-דומיינים, אפשר לשמור על אותה זהות אנונימית ביניהם:

<script src="https://api.agentanalytics.sh/tracker.js"
  data-project="my-site"
  data-token="aat_..."
  data-link-domains="yoursite.com,app.yoursite.com,docs.yoursite.com"></script>

הדבר שימושי במיוחד במסע שחוצה אתר שיווקי, תיעוד ויישום.

פרטיות ובקשת “לא לעקוב”

קוד המעקב יודע לכבד גם את הגדרת DNT בדפדפן וגם ביטול מעקב מקומי:

<script src="https://api.agentanalytics.sh/tracker.js"
  data-project="my-site"
  data-token="aat_..."
  data-do-not-track="true"></script>

ואפשר גם לכבות את המעקב באמצעות:

localStorage.setItem('aa_disabled', 'true');

זמני ביצועים

אפשר לקבל אוטומטית מדדים של טעינת הדף:

<script src="https://api.agentanalytics.sh/tracker.js"
  data-project="my-site"
  data-token="aat_..."
  data-track-performance="true"></script>

המערכת שולחת אירוע $performance עם מדדים כמו TTFB, זמן מוכנות ה-DOM וזמן הטעינה.

זמן בעמוד

כדי למדוד כמה זמן באמת משתמשים שהו בעמוד:

<script src="https://api.agentanalytics.sh/tracker.js"
  data-project="my-site"
  data-token="aat_..."
  data-heartbeat="30"></script>

קוד המעקב יודע לעצור כשהלשונית מוסתרת ולחדש כשהיא מוצגת, כך שהמדידה שימושית יותר מהנחה ש”הלשונית נשארה פתוחה”.

מעקב אחרי שגיאות JavaScript

אפשר ללכוד שגיאות JavaScript בסיסיות בלי להוסיף כלי נפרד:

<script src="https://api.agentanalytics.sh/tracker.js"
  data-project="my-site"
  data-token="aat_..."
  data-track-errors="true"></script>

שגיאות שלא טופלו ודחיות של הבטחות נשלחות כאירוע $error.

תכונות כלליות

באמצעות aa.set() אפשר להוסיף תכונות לכל האירועים הבאים:

window.aa.set({ plan: 'pro', team: 'acme-corp' });
window.aa.set({ plan: null });

כך נוח לפלח לפי תוכנית, צוות או סוג משתמש.

ניהול הסכמה

למקרים שבהם נדרשת הסכמה לפני המעקב:

<script src="https://api.agentanalytics.sh/tracker.js"
  data-project="my-site"
  data-token="aat_..."
  data-require-consent="true"></script>

ואז אפשר:

window.aa.grantConsent();
window.aa.revokeConsent();

עומק גלילה, חשיפות ומדדי חוויית שימוש

הגרסה החדשה מוסיפה גם:

• $scroll_depth כדי לדעת עד כמה גוללים
• data-aa-impression כדי למדוד אם מקטע באמת נצפה
• $web_vitals עבור LCP, CLS ו-INP
• מעקב אוטומטי אחרי הורדות קבצים

המדדים האלה עוזרים להבין לא רק אם הדף נטען, אלא אם המשתמשים באמת ראו וחוו אותו.

למה זה חשוב

הכיוון הכללי ברור: פחות קוד מותאם ויותר הטמעה הצהרתית.

זה טוב למפתחים, אבל חשוב במיוחד לסוכנים. כשסוכן יכול להוסיף מעקב באמצעות מאפיינים במקום לכתוב שכבה שלמה של JavaScript מותאם, קל לו הרבה יותר לסגור את הלולאה בין שינויי המוצר למדידה.

זו בדיוק הסיבה שבנינו את השדרוג הזה.