3. gtag.js
some issues
Source: in client-side setup likely to
be blocked by modern browsers
Heavy: does is all: GA, Ads, Optimize,
Badges and whatever
Complexity: Much stuff you might
not want
Control: let me define what is
“engaged”!
Consent: Consent Mode is a joke!
What to use (when running your own
endpoint for more than just GA4)?
4. gtag.js
… is odd!
Session Handling & More:
● control over “first_visit” and
“session_start”
● browser knows what is a
conversion, a referral exclusion…
● no way to hide your
measurement id
● much “serverside-stuff” has to be
handled by the browser
5. gtag.js
GTM light?
● Google Tag: “centrally manage
settings without additional code”
● modelled conversions
everywhere
googlemarketinglive.com/americas/
6. ● just “sending hits” is not enough
(for GA4)
● GA4 Measurement Protocol is
not a full replacement
● additional tasks: knowing goals,
send created events, track time…
● event batching
● ssGTM “sendPixelFromBrowser”
● mocking Consent Mode
● sending enough data to feed
GA4 without consent: possible?
gtag.js
why replacing it is hard
9. GA4 Destination: might be one of the
few official partners (soon?)
Everything in place: does have own
session start markers. Utag.data seems
a good fit
Anyone tried this already (without
bundling gtag in the browser)?
Tealium
iQ Standard fits?
Or EventStream?
10. Seems to have all data: there are
timestamps, timings, hit numbers…
Tagging: relies either on HTML
attributes or events sent via JS
Anyone tried this one maybe? ;)
https://github.com/elbwalker/walker.js
elbwalker
open source event tracker
11. You would have to steal it: not open
source
GA4 connection “unofficial”: might
break in the future
Not very lightweight: >40kB
first hand experiences here?
https://www.jentis.com/
The JENTIS
approach
alternative capturing indeed
12. DIY
individual tracking script
● minimal footprint, no
dependencies
● fallback for sendbeacon()
● collect minimal dimensions
● re-use existing dataLayer
● use fingerprint or cookie
● enhanced tracking if consent:
○ session handling
○ returning visitors
○ more dimensions
● use (obfuscated) POST
● quite hard (if only client-side)
14. History
started as a simple replacement for analytics.js
5+ years ago
works from the browser only, but needs an
endpoint that knows the format
Used to forward events to GA, Piwik PRO,
Matomo and a few others
Worked without a “client-side session” well
before implementing GA4
one of the older ones:
https://gist.github.com/mbaersch/34af06d1336f8
78ea10f3f7b0e49d45c
15. evolving code grows ;)
send consent as payload
add an event id to avoid
deduplication problems in
“other systems” ;)
client-side timestamps are fine,
but use your own endpoint to
create new ones
code suddenly needs some
“initialisation”
More Dimensions
16. collect additional info with
consent only
(and throw out some stuff in
your endpoint as well)
remember: resolution,
(language), color depth & co
are all attributes that you
actively “read” from the
visitor´s device
Be Nice!
17. Session Handling
GA4 wants session handling
only active if consent is present
uses localStorage / sessionStorage -
which is only possible on a single
domain AND host
18. Sending Stuff
Try beacons, then AJAX, then
an image pixel as last fallback
…and make sure that your
endpoint looks for get
parameters.
and yes: use guard clauses
instead of all that else stuff if
you like ;)
19. Endpoint
FP endpoint for flexible data
handling
optionally use separate session,
timestamps, identifier
1:n tracking
debugging with headers
GA4: refer to
https://www.thyngster.com/ga4-
measurement-protocol-
cheatsheet/ for a parameter
reference
(would have saved a lot of time for me)
20. Endpoint (2)
Use ssGTM and translate own format to GTM events
or build your own in Node, PHP or whatever
Remember: CNAME is not an option
cloud edge endpoints are a promising alternative
21. Final Tipps
send base64 coded payload
… or even build your own
coding (or just do rot13 :))
Keeping your own format
makes you (somewhat)
independent
remember: a tracking server
has to handle a lot of stuff. Do
not use your website server
(unless you have low traffic
like me ;))
Some kind of a “gtag.js - rant”: Is gtag.js really the best way to collect events in the browser? Why is gtag.js in general odd and what are the features that are used to feed GA4 with data? We will take a look at what gtag.js does, what alternative ways for data capturing already exist and how an individual replacement can be built.
https://www.flaticon.com/
David Vallejo did this for client-side tracking as well! ;)