Skip to content

Commit

Permalink
Update item-view event, improve analytics debouncing
Browse files Browse the repository at this point in the history
In terms of quality of data, the current event style wasn't super useful since it spread the collections out into separate categories.

This change makes separate events for each collection found, with the `category` field being updated.  This way in GA we can count within each collection.

Also, the way debouncing was working to help keep down the number of duplicate calls wasn't sufficient in most cases.  This is because the debounce method doesn't care about whether the calls are actually duplicate just that they are being triggered in quick succession.  So we were getting some lost events and still some duplicated.

This commit sets up a simple debouncing-cache that has short-lived cache entries that are checked against incoming events to decide whether to block or not.
  • Loading branch information
thostetler committed Mar 28, 2024
1 parent 57919ef commit 1d15e69
Show file tree
Hide file tree
Showing 3 changed files with 145 additions and 34 deletions.
108 changes: 102 additions & 6 deletions src/js/components/analytics.js
Original file line number Diff line number Diff line change
Expand Up @@ -82,10 +82,58 @@ define(['underscore', 'jquery'], function (_, $) {
}
}

const CACHE_TIMEOUT = 300;
/**
* Simple debouncing mechanism with caching
* this will store stringified version of the incoming events and provide a way to
* check if the event has recently been cached. With a short rolling timer to keep the timeout short to hopefully
* only target duplicate calls.
*/
class AnalyticsCacher {
constructor() {
this.timer = null;
this.cache = new Set();
}

stringify(args) {
return JSON.stringify(args, function (key, value) {

// filter out this cache-buster id added by GTM
if (key === 'gtm.uniqueEventId') {
return undefined;
}
return value;
});
}

add(...args) {
this._resetTimeout();
return this.cache.add(this.stringify(args));
}

has(...args) {
return this.cache.has(this.stringify(args));
}

_resetTimeout() {
clearTimeout(this.timer);
this.timer = setTimeout(this._clear.bind(this), CACHE_TIMEOUT);
}

_clear() {
this.cache.clear();
}
}

const cacher = new AnalyticsCacher();
const Analytics = function (action, event, type, description, ...args) {
adsLogger.apply(null, _.rest(arguments, 3));
if (cacher.has(arguments)) {
return;
}

cacher.add(arguments);

adsLogger.apply(null, _.rest(arguments, 3));
// if the action is send and the event is event, then we want to send the event to the dataLayer
if (Array.isArray(window.dataLayer) &&
action === 'send' && event === 'event'
Expand Down Expand Up @@ -116,12 +164,60 @@ define(['underscore', 'jquery'], function (_, $) {
}
};

// expose a function to send custom events
Analytics.push = (data) => Array.isArray(window.dataLayer) && window.dataLayer.push(data);
Analytics.reset = () => Array.isArray(window.dataLayer) && (window.dataLayer.push(function () {
this.reset();
}));
/**
* Get the datalayer for sending events to
* @returns {*|*[]}
*/
Analytics.getDL = () => {
if (window.dataLayer && Array.isArray(window.dataLayer)) {
return window.dataLayer;
}
return [];
}

/**
* Push a new object to the datalayer
* @param {Object} data
*/
Analytics.push = (data) => {
if (cacher.has(data)) {
return;
}
cacher.add(data);
Analytics.getDL().push(data);
}

/**
* Reset the datalayer
*/
Analytics.reset = () => {
Analytics.getDL().push(function() {
this.reset();
});
}

/**
* set a value on the datalayer
* @param {string} property
* @param {unknown} value
*/
Analytics.set = (property, value) => {
Analytics.getDL().push(function() {
this.set(property, value);
});
}

/**
* get a value on the datalayer
* @param {string} property
*/
Analytics.get = (property) => {
let value;
Analytics.getDL().push(function() {
value = this.get(property);
});
return value;
}

return Analytics;
});
57 changes: 34 additions & 23 deletions src/js/components/navigator.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,8 +35,6 @@ define([
var APP_TITLE = 'NASA/ADS';
var TITLE_SEP = ' - ';

const FIELDS_TO_SEND = ['bibcode', 'database', 'bibstem', 'property', 'resultsIndex'];

// This function is used to hash the user id before sending it to Analytics
const digestMessage = function (message) {
const crypto = window.crypto || window.msCrypto;
Expand Down Expand Up @@ -94,32 +92,46 @@ define([
}, 500),

_onCustomEvent: function (ev, data) {
console.log('Custom Event', ev, data);

switch (ev) {
case 'update-document-title':
this._updateDocumentTitle(data);
break;
case 'latest-abstract-data':
this._debouncedAnalyticsCall({
event: 'view_item',
items: [
{
item_id: data.bibcode,
item_name: data.title,
...data.database.slice(1).reduce(
(acc, cat, idx) => ({
...acc,
[`item_category${idx + 1}`]: cat,
}),
{item_category: data.database[0]},
),
index: data.resultsIndex,
property: data.property,
refereed: data.property.includes('REFEREED'),
},
],
});
case 'latest-abstract-data': {
if (Array.isArray(data.database)) {
analytics.set('items', undefined);
data.database.forEach((database) => {
// do not debounce here, since we want multiple
analytics.push({
event: 'view_item',
items: [
{
item_id: data.bibcode,
item_name: data.title,
item_category: database,
index: data.resultsIndex,
refereed: data.property.includes('REFEREED'),
},
],
});
});
} else {
this._debouncedAnalyticsCall({
event: 'view_item',
items: [
{
item_id: data.bibcode,
item_name: data.title,
item_category: '(no collection)',
index: data.resultsIndex,
refereed: data.property.includes('REFEREED'),
},
],
});
}
break;
}
case 'search-page-results':
// clear items array on the data layer
this._debouncedAnalyticsCall({
Expand All @@ -141,7 +153,6 @@ define([
item_list_name: 'Search Results',
item_variant: 'search_result_item',
index: doc.resultsIndex,
property: doc.property,
refereed: doc.property.includes('REFEREED'),
};
}),
Expand Down
14 changes: 9 additions & 5 deletions src/js/widgets/abstract/widget.js
Original file line number Diff line number Diff line change
Expand Up @@ -325,6 +325,7 @@ define([
this._docs = {};
this.maxAuthors = MAX_AUTHORS;
this.isFetchingAff = false;
this.listenTo(this.model, 'change:abstract', this._onAbstractLoaded);
},

activate: function(beehive) {
Expand Down Expand Up @@ -431,11 +432,6 @@ define([
'update-document-title',
this._docs[bibcode].title
);
ps.publish(
ps.CUSTOM_EVENT,
'latest-abstract-data',
this._docs[bibcode]
);
}
this.updateState(this.STATES.IDLE);
},
Expand Down Expand Up @@ -561,6 +557,14 @@ define([
}
},

_onAbstractLoaded: function() {
const doc = this.model.toJSON();
const ps = this.getPubSub();
if (ps && doc) {
ps.publish(ps.CUSTOM_EVENT, 'latest-abstract-data', doc);
}
},

processResponse: function(apiResponse) {
var r = apiResponse.toJSON();
var self = this;
Expand Down

0 comments on commit 1d15e69

Please sign in to comment.