From 830dad8680e08b8d040ef7c1f2d94fd7c8dc851c Mon Sep 17 00:00:00 2001 From: Emma Imber Date: Tue, 4 Feb 2025 17:17:45 +0000 Subject: [PATCH 1/6] Move the initPermutive call --- src/init/consented-advertising.ts | 5 +---- src/init/consented/static-ad-slots.ts | 7 ++++++- 2 files changed, 7 insertions(+), 5 deletions(-) diff --git a/src/init/consented-advertising.ts b/src/init/consented-advertising.ts index 61f01e186..bd6afd2da 100644 --- a/src/init/consented-advertising.ts +++ b/src/init/consented-advertising.ts @@ -9,7 +9,6 @@ import { init as initIpsosMori } from './consented/ipsos-mori'; import { init as initMessenger } from './consented/messenger'; import { init as prepareA9 } from './consented/prepare-a9'; import { init as prepareGoogletag } from './consented/prepare-googletag'; -import { initPermutive } from './consented/prepare-permutive'; import { init as preparePrebid } from './consented/prepare-prebid'; import { removeDisabledSlots as closeDisabledSlots } from './consented/remove-slots'; import { initTeadsCookieless } from './consented/teads-cookieless'; @@ -35,9 +34,7 @@ const commercialModules = [ reloadPageOnConsentChange, preparePrebid, initDfpListeners, - // Permutive init code must run before google tag enableServices() - // The permutive lib however is loaded async with the third party tags - () => initPermutive().then(prepareGoogletag), + prepareGoogletag, initDynamicAdSlots, prepareA9, initFillSlotListener, diff --git a/src/init/consented/static-ad-slots.ts b/src/init/consented/static-ad-slots.ts index 9f668c671..7e4b7fd37 100644 --- a/src/init/consented/static-ad-slots.ts +++ b/src/init/consented/static-ad-slots.ts @@ -11,6 +11,7 @@ import { getCurrentBreakpoint } from '../../lib/detect/detect-breakpoint'; import { dfpEnv } from '../../lib/dfp/dfp-env'; import { queueAdvert } from '../../lib/dfp/queue-advert'; import { isInUk, isInUsa } from '../../lib/geo/geo-utils'; +import { initPermutive } from './prepare-permutive'; import { setupPrebidOnce } from './prepare-prebid'; import { removeDisabledSlots } from './remove-slots'; @@ -61,7 +62,11 @@ const fillStaticAdvertSlots = async (): Promise => { // This module has the following strict dependencies. These dependencies must be // fulfilled before this function can execute reliably. The bootstrap // initiates these dependencies, to speed up the init process. Bootstrap also captures the module performance. - const dependencies: Array> = [removeDisabledSlots()]; + const dependencies: Array> = [ + removeDisabledSlots(), + // Permutive segmentation init code must run before google tag enableServices() + initPermutive(), + ]; await Promise.all(dependencies); From eab043e6973cb326b913d4059da7beab35192e53 Mon Sep 17 00:00:00 2001 From: Emma Imber Date: Wed, 5 Feb 2025 13:07:56 +0000 Subject: [PATCH 2/6] Make comment more useful --- src/init/consented/static-ad-slots.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/init/consented/static-ad-slots.ts b/src/init/consented/static-ad-slots.ts index 7e4b7fd37..0f8b912b5 100644 --- a/src/init/consented/static-ad-slots.ts +++ b/src/init/consented/static-ad-slots.ts @@ -64,7 +64,8 @@ const fillStaticAdvertSlots = async (): Promise => { // initiates these dependencies, to speed up the init process. Bootstrap also captures the module performance. const dependencies: Array> = [ removeDisabledSlots(), - // Permutive segmentation init code must run before google tag enableServices() + // Permutive segmentation init code must run before googletag.enableServices() is called + /** @see https://support.permutive.com/hc/en-us/articles/360011779239-Deploying-the-Permutive-JavaScript-Tag */ initPermutive(), ]; From c614118c540741f4ad7c72d0bcacaee99811e76d Mon Sep 17 00:00:00 2001 From: Emma Imber Date: Wed, 5 Feb 2025 13:09:14 +0000 Subject: [PATCH 3/6] Changeset --- .changeset/unlucky-lizards-hide.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/unlucky-lizards-hide.md diff --git a/.changeset/unlucky-lizards-hide.md b/.changeset/unlucky-lizards-hide.md new file mode 100644 index 000000000..fd3b6fd44 --- /dev/null +++ b/.changeset/unlucky-lizards-hide.md @@ -0,0 +1,5 @@ +--- +'@guardian/commercial': minor +--- + +Move the initPermutive call so that the googletag script can be loaded a little earlier From 6aaa38f59868332e86cf18cc1c9ba2229b89cd0f Mon Sep 17 00:00:00 2001 From: Emma Imber Date: Wed, 12 Feb 2025 15:59:57 +0000 Subject: [PATCH 4/6] Put change behind a 0% test --- .../tests/move-permutive-segmentation.ts | 29 +++++++++++++++++++ src/init/consented-advertising.ts | 8 ++++- src/init/consented/static-ad-slots.ts | 11 ++++--- 3 files changed, 43 insertions(+), 5 deletions(-) create mode 100644 src/experiments/tests/move-permutive-segmentation.ts diff --git a/src/experiments/tests/move-permutive-segmentation.ts b/src/experiments/tests/move-permutive-segmentation.ts new file mode 100644 index 000000000..7d0295b0a --- /dev/null +++ b/src/experiments/tests/move-permutive-segmentation.ts @@ -0,0 +1,29 @@ +import type { ABTest } from '@guardian/ab-core'; + +export const movePermutiveSegmentation: ABTest = { + id: 'MovePermutiveSegmentation', + author: '@commercial-dev', + start: '2025-01-14', + expiry: '2025-02-28', + audience: 0 / 100, + audienceOffset: 20 / 100, + audienceCriteria: '', + successMeasure: '', + description: + 'Measure the performance impact of moving the initialisation of Permutive segmentation.', + variants: [ + { + id: 'control', + test: (): void => { + /* no-op */ + }, + }, + { + id: 'variant', + test: (): void => { + /* no-op */ + }, + }, + ], + canRun: () => true, +}; diff --git a/src/init/consented-advertising.ts b/src/init/consented-advertising.ts index bd6afd2da..7df554b4d 100644 --- a/src/init/consented-advertising.ts +++ b/src/init/consented-advertising.ts @@ -1,3 +1,5 @@ +import { isUserInVariant } from '../experiments/ab'; +import { movePermutiveSegmentation } from '../experiments/tests/move-permutive-segmentation'; import { init as prepareAdVerification } from '../lib/ad-verification/prepare-ad-verification'; import { bootCommercial } from '../lib/commercial-boot-utils'; import { adFreeSlotRemove } from './consented/ad-free-slot-remove'; @@ -9,6 +11,7 @@ import { init as initIpsosMori } from './consented/ipsos-mori'; import { init as initMessenger } from './consented/messenger'; import { init as prepareA9 } from './consented/prepare-a9'; import { init as prepareGoogletag } from './consented/prepare-googletag'; +import { initPermutive } from './consented/prepare-permutive'; import { init as preparePrebid } from './consented/prepare-prebid'; import { removeDisabledSlots as closeDisabledSlots } from './consented/remove-slots'; import { initTeadsCookieless } from './consented/teads-cookieless'; @@ -34,7 +37,10 @@ const commercialModules = [ reloadPageOnConsentChange, preparePrebid, initDfpListeners, - prepareGoogletag, + // add test to determine impact of moving initPermutive + isUserInVariant(movePermutiveSegmentation, 'variant') + ? prepareGoogletag + : () => initPermutive().then(prepareGoogletag), initDynamicAdSlots, prepareA9, initFillSlotListener, diff --git a/src/init/consented/static-ad-slots.ts b/src/init/consented/static-ad-slots.ts index 0f8b912b5..c2f5e5741 100644 --- a/src/init/consented/static-ad-slots.ts +++ b/src/init/consented/static-ad-slots.ts @@ -3,6 +3,7 @@ import { createAdvert } from '../../define/create-advert'; import { displayAds } from '../../display/display-ads'; import { displayLazyAds } from '../../display/display-lazy-ads'; import { isUserInVariant } from '../../experiments/ab'; +import { movePermutiveSegmentation } from '../../experiments/tests/move-permutive-segmentation'; import { mpuWhenNoEpic } from '../../experiments/tests/mpu-when-no-epic'; import type { SizeMapping } from '../../lib/ad-sizes'; import { adSizes, createAdSize } from '../../lib/ad-sizes'; @@ -62,12 +63,14 @@ const fillStaticAdvertSlots = async (): Promise => { // This module has the following strict dependencies. These dependencies must be // fulfilled before this function can execute reliably. The bootstrap // initiates these dependencies, to speed up the init process. Bootstrap also captures the module performance. - const dependencies: Array> = [ - removeDisabledSlots(), + const dependencies: Array> = [removeDisabledSlots()]; + + // add test to determine impact of moving initPermutive + if (isUserInVariant(movePermutiveSegmentation, 'variant')) { // Permutive segmentation init code must run before googletag.enableServices() is called /** @see https://support.permutive.com/hc/en-us/articles/360011779239-Deploying-the-Permutive-JavaScript-Tag */ - initPermutive(), - ]; + dependencies.push(initPermutive()); + } await Promise.all(dependencies); From 5f64c101af4a5008a96aa39dd5f2bef3954a3317 Mon Sep 17 00:00:00 2001 From: Emma Imber Date: Wed, 12 Feb 2025 16:06:59 +0000 Subject: [PATCH 5/6] Update test dates --- src/experiments/tests/move-permutive-segmentation.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/experiments/tests/move-permutive-segmentation.ts b/src/experiments/tests/move-permutive-segmentation.ts index 7d0295b0a..ac2148342 100644 --- a/src/experiments/tests/move-permutive-segmentation.ts +++ b/src/experiments/tests/move-permutive-segmentation.ts @@ -3,8 +3,8 @@ import type { ABTest } from '@guardian/ab-core'; export const movePermutiveSegmentation: ABTest = { id: 'MovePermutiveSegmentation', author: '@commercial-dev', - start: '2025-01-14', - expiry: '2025-02-28', + start: '2025-02-12', + expiry: '2025-03-21', audience: 0 / 100, audienceOffset: 20 / 100, audienceCriteria: '', From 83f9875fa9d660e0a1e80ad94d8c6cffca3c396a Mon Sep 17 00:00:00 2001 From: Emma Imber Date: Mon, 17 Feb 2025 15:39:27 +0000 Subject: [PATCH 6/6] Add console log for testing --- src/init/consented/prepare-permutive.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/init/consented/prepare-permutive.ts b/src/init/consented/prepare-permutive.ts index 6e1e5c72e..22824e832 100644 --- a/src/init/consented/prepare-permutive.ts +++ b/src/init/consented/prepare-permutive.ts @@ -1,3 +1,4 @@ +import { log } from '@guardian/libs'; import { isUserInVariant } from '../../experiments/ab'; import { deferPermutiveLoad } from '../../experiments/tests/defer-permutive-load'; import { reportError } from '../../lib/error/report-error'; @@ -173,6 +174,7 @@ const runPermutive = ( * @returns Promise */ const initPermutiveSegmentation = () => { + log('commercial', 'Initialising Permutive segmentation'); /* eslint-disable -- permutive code */ // From here until we re-enable eslint is the Permutive code // that we received from them.