feat: Analytics scroll depth #12079
feat: Analytics scroll depth #12079
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
1 Skipped Deployment
|
Bundle ReportChanges will increase total bundle size by 6.26kB (0.03%) ⬆️. This is within the configured threshold ✅ Detailed changes
|
assume 100% progress beyound 95%
| @@ -31,6 +31,9 @@ export const metadata: Metadata = { | |||
| export default function RootLayout({children}: {children: React.ReactNode}) { | |||
| return ( | |||
| <html lang="en" suppressHydrationWarning> | |||
| <head> | |||
| <PlausibleProvider domain="docs.sentry.io,rollup.sentry.io" /> | |||
There was a problem hiding this comment.
Probably, we should ask @lizokm
There was a problem hiding this comment.
It doesn't look like we have Plausible installed on dev docs (if it is, it's not hooked up to the company account).
| @@ -3,7 +3,7 @@ import './globals.css'; | |||
| import {Theme} from '@radix-ui/themes'; | |||
| import type {Metadata} from 'next'; | |||
| import {Rubik} from 'next/font/google'; | |||
| import Script from 'next/script'; | |||
| import PlausibleProvider from 'next-plausible'; | |||
There was a problem hiding this comment.
What is the advantage of having this instead of the script?
There was a problem hiding this comment.
send events dynamically through a hook, nice TS and local DX experience
| if (document.documentElement.scrollHeight - window.innerHeight === 0) { | ||
| return () => {}; | ||
| } | ||
| const debouncedTrackProgress = debounce(trackProgress, 20); |
There was a problem hiding this comment.
As discussed offline: this prevents events from being sent when a user very quickly scrolls to the bottom and then leaves the page - which might not count as a read anyway
There was a problem hiding this comment.
yes, it doesn't happen if you scroll at any reasonable reading speed
There was a problem hiding this comment.
Have you considered using the IntersectionObserver API for this?
There was a problem hiding this comment.
I think the current approach is more precise
the marketing site / blog use the intersection observer and report 100% when the last heading is reached
a useful heuristic, but not very precise
There was a problem hiding this comment.
The IntersectionObserver is more performant and since it's already being used by the marketing site, we should be keeping the measurement methods the same for better comparison.
closes #12061