diff --git a/package.json b/package.json
index 5a97a3ed1a..c953e03202 100644
--- a/package.json
+++ b/package.json
@@ -26,6 +26,7 @@
     "dependencies": {
         "@sentry/sveltekit": "^8.38.0",
         "h3": "^1.13.0",
+        "posthog-js": "^1.204.0",
         "sharp": "^0.33.5"
     },
     "devDependencies": {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 6d72be7299..4e809f444c 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -14,6 +14,9 @@ importers:
       h3:
         specifier: ^1.13.0
         version: 1.13.0
+      posthog-js:
+        specifier: ^1.204.0
+        version: 1.204.0
       sharp:
         specifier: ^0.33.5
         version: 0.33.5
@@ -2228,6 +2231,9 @@ packages:
     resolution: {integrity: sha512-U71cyTamuh1CRNCfpGY6to28lxvNwPG4Guz/EVjgf3Jmzv0vlDp1atT9eS5dDjMYHucpHbWns6Lwf3BKz6svdw==}
     engines: {node: '>= 0.6'}
 
+  core-js@3.39.0:
+    resolution: {integrity: sha512-raM0ew0/jJUqkJ0E6e8UDtl+y/7ktFivgWvqw8dNSQeNWoSDLvQ1H/RN3aPXB9tBd4/FhyR4RDPGhsNIMsAn7g==}
+
   core-util-is@1.0.3:
     resolution: {integrity: sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==}
 
@@ -2561,6 +2567,9 @@ packages:
   fastq@1.17.1:
     resolution: {integrity: sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==}
 
+  fflate@0.4.8:
+    resolution: {integrity: sha512-FJqqoDBR00Mdj9ppamLa/Y7vxm+PRmNWA67N846RvsoYVMKB4q3y/de5PA7gUmRMYK/8CMz2GDZQmCRN1wBcWA==}
+
   file-entry-cache@8.0.0:
     resolution: {integrity: sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==}
     engines: {node: '>=16.0.0'}
@@ -3565,6 +3574,12 @@ packages:
     resolution: {integrity: sha512-9ZhXKM/rw350N1ovuWHbGxnGh/SNJ4cnxHiM0rxE4VN41wsg8P8zWn9hv/buK00RP4WvlOyr/RBDiptyxVbkZQ==}
     engines: {node: '>=0.10.0'}
 
+  posthog-js@1.204.0:
+    resolution: {integrity: sha512-wVt948wKPPztCZ3OeDq8y0dtaPbhbY8vFuEVBUNHOn7PohbTXr7HZ4CNhH8fXgFkx5COEzz/20wWJmEsSU5oCA==}
+
+  preact@10.25.4:
+    resolution: {integrity: sha512-jLdZDb+Q+odkHJ+MpW/9U5cODzqnB+fy2EiHSZES7ldV5LK7yjlVzTp7R8Xy6W6y75kfK8iWYtFVH7lvjwrCMA==}
+
   prelude-ls@1.2.1:
     resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==}
     engines: {node: '>= 0.8.0'}
@@ -4310,6 +4325,9 @@ packages:
       jsdom:
         optional: true
 
+  web-vitals@4.2.4:
+    resolution: {integrity: sha512-r4DIlprAGwJ7YM11VZp4R884m0Vmgr6EAKe3P+kO0PPj3Unqyvv59rczf6UiGcb9Z8QxZVcqKNwv/g0WNdWwsw==}
+
   webidl-conversions@3.0.1:
     resolution: {integrity: sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==}
 
@@ -6641,6 +6659,8 @@ snapshots:
 
   cookie@0.6.0: {}
 
+  core-js@3.39.0: {}
+
   core-util-is@1.0.3: {}
 
   cross-fetch@3.1.8(encoding@0.1.13):
@@ -7009,6 +7029,8 @@ snapshots:
     dependencies:
       reusify: 1.0.4
 
+  fflate@0.4.8: {}
+
   file-entry-cache@8.0.0:
     dependencies:
       flat-cache: 4.0.1
@@ -7992,6 +8014,15 @@ snapshots:
     dependencies:
       xtend: 4.0.2
 
+  posthog-js@1.204.0:
+    dependencies:
+      core-js: 3.39.0
+      fflate: 0.4.8
+      preact: 10.25.4
+      web-vitals: 4.2.4
+
+  preact@10.25.4: {}
+
   prelude-ls@1.2.1: {}
 
   prettier-plugin-svelte@3.3.2(prettier@3.3.3)(svelte@4.2.19):
@@ -8739,6 +8770,8 @@ snapshots:
       - supports-color
       - terser
 
+  web-vitals@4.2.4: {}
+
   webidl-conversions@3.0.1: {}
 
   webpack-sources@3.2.3: {}
diff --git a/src/lib/actions/analytics.ts b/src/lib/actions/analytics.ts
index b1905d2a60..ba3891d271 100644
--- a/src/lib/actions/analytics.ts
+++ b/src/lib/actions/analytics.ts
@@ -2,6 +2,7 @@ import { Analytics, type AnalyticsPlugin } from 'analytics';
 import Plausible from 'plausible-tracker';
 import { get } from 'svelte/store';
 import { page } from '$app/stores';
+import posthogEvent from 'posthog-js';
 
 import { ENV } from '$lib/system';
 import { browser } from '$app/environment';
@@ -54,7 +55,10 @@ const analytics = Analytics({
     plugins: [plausible('appwrite.io')]
 });
 
-export const trackEvent = async (name: string, data: object = {}) => {
+export const trackEvent = async (platforms: {
+    plausible?: { name: string; data?: object };
+    posthog?: { name: string };
+}) => {
     if (!isTrackingAllowed()) {
         return;
     }
@@ -63,9 +67,15 @@ export const trackEvent = async (name: string, data: object = {}) => {
     const path = currentPage.route.id ?? '';
 
     if (ENV.DEV || ENV.PREVIEW) {
-        console.log(`[Analytics] Event ${name} ${path}`, data);
+        console.log(`[Analytics] Event`, platforms.plausible, platforms.posthog);
     } else {
-        await analytics.track(name, { ...data, path });
+        if (platforms.plausible) {
+            await analytics.track(plausible.name, { ...platforms.plausible.data, path });
+        }
+
+        if (platforms.posthog) {
+            posthogEvent.capture(platforms.posthog.name);
+        }
     }
 };
 
diff --git a/src/lib/components/AppwriteIn100Seconds.svelte b/src/lib/components/AppwriteIn100Seconds.svelte
index 686e1e1978..6153e08c44 100644
--- a/src/lib/components/AppwriteIn100Seconds.svelte
+++ b/src/lib/components/AppwriteIn100Seconds.svelte
@@ -17,7 +17,10 @@
 <button
     on:click={() => {
         show = true;
-        trackEvent('Appwrite in 100 seconds');
+        trackEvent({
+            plausible: { name: 'Appwrite in 100 seconds' },
+            posthog: { name: 'intro-video-btn_hero_click' }
+        });
     }}
     class="web-button is-secondary cursor-pointer"
 >
diff --git a/src/lib/components/IsLoggedIn.svelte b/src/lib/components/IsLoggedIn.svelte
index f136b80c4d..86b6782f46 100644
--- a/src/lib/components/IsLoggedIn.svelte
+++ b/src/lib/components/IsLoggedIn.svelte
@@ -6,21 +6,21 @@
 
     export let classes = '';
 
+    const isLoggedIn = browser && 'loggedIn' in document.body.dataset;
+
     function getTrackingEventName() {
-        return browser
-            ? 'loggedIn' in document.body.dataset
-                ? 'Go to console'
-                : 'Get started'
-            : 'Get started';
+        return browser ? (isLoggedIn ? 'Go to console' : 'Get started') : 'Get started';
     }
 </script>
 
 <a
     class={classNames('web-button web-u-inline-width-100-percent-mobile', classes)}
     href={PUBLIC_APPWRITE_DASHBOARD}
-    on:click={() => {
-        trackEvent(`${getTrackingEventName()} in header`);
-    }}
+    on:click={() =>
+        trackEvent({
+            plausible: { name: `${getTrackingEventName()} in header` },
+            ...(isLoggedIn ? {} : { posthog: { name: 'get-started-btn_nav_click' } })
+        })}
 >
     <span class="hidden group-[&[data-logged-in]]/body:block">Go to Console</span>
     <span class="block group-[&[data-logged-in]]/body:hidden">Get started</span>
diff --git a/src/lib/components/PreFooter.svelte b/src/lib/components/PreFooter.svelte
index 235ccb59b6..4fc058c698 100644
--- a/src/lib/components/PreFooter.svelte
+++ b/src/lib/components/PreFooter.svelte
@@ -19,7 +19,7 @@
         <a
             href={PUBLIC_APPWRITE_DASHBOARD}
             class="web-button is-transparent web-self-center"
-            on:click={() => trackEvent('Get started in pre footer')}
+            on:click={() => trackEvent({ plausible: { name: 'Get started in pre footer' } })}
         >
             <span class="text">Get started</span>
         </a>
@@ -47,7 +47,12 @@
                     <a
                         href={`${PUBLIC_APPWRITE_DASHBOARD}/register`}
                         class="web-button is-secondary is-full-width-mobile web-u-cross-child-end"
-                        on:click={() => trackEvent('Get started Free plan')}
+                        on:click={() =>
+                            trackEvent({
+                                plausible: {
+                                    name: 'Get started Free plan'
+                                }
+                            })}
                     >
                         <span class="text">Get started</span>
                     </a>
@@ -68,7 +73,12 @@
                         class="web-button is-full-width-mobile web-u-cross-child-end"
                         target="_blank"
                         rel="noopener noreferrer"
-                        on:click={() => trackEvent('Get started Pro plan')}
+                        on:click={() =>
+                            trackEvent({
+                                plausible: {
+                                    name: 'Get started Pro plan'
+                                }
+                            })}
                     >
                         <!-- <span class="text">Start trial</span> -->
                         <span class="text">Start building</span>
diff --git a/src/lib/components/ProductsSubmenu.svelte b/src/lib/components/ProductsSubmenu.svelte
index 0d9464de89..61956e040f 100644
--- a/src/lib/components/ProductsSubmenu.svelte
+++ b/src/lib/components/ProductsSubmenu.svelte
@@ -121,7 +121,12 @@
                         <a
                             href={product.href}
                             use:melt={$item}
-                            on:click={() => trackEvent(`${product.name} in products submenu`)}
+                            on:click={() =>
+                                trackEvent({
+                                    plausible: {
+                                        name: `${product.name} in products submenu`
+                                    }
+                                })}
                             class="group flex gap-3 rounded-xl p-1 text-white outline-none transition-colors focus:bg-white/8"
                         >
                             <div
diff --git a/src/lib/components/Technologies.svelte b/src/lib/components/Technologies.svelte
index 2b8d2b73a8..5296a26f7b 100644
--- a/src/lib/components/Technologies.svelte
+++ b/src/lib/components/Technologies.svelte
@@ -75,7 +75,7 @@
                 <a
                     href={platform.href}
                     class="web-icon-button web-box-icon has-border-gradient"
-                    on:click={() => trackEvent(`${platform.name} clicked`)}
+                    on:click={() => trackEvent({ plausible: { name: `${platform.name} clicked` } })}
                 >
                     <img
                         src={platform.image}
diff --git a/src/lib/layouts/Main.svelte b/src/lib/layouts/Main.svelte
index ee2964bd72..ddf4251469 100644
--- a/src/lib/layouts/Main.svelte
+++ b/src/lib/layouts/Main.svelte
@@ -23,10 +23,29 @@
     import InitBanner from '$lib/components/InitBanner.svelte';
     import { trackEvent } from '$lib/actions/analytics';
     import MainNav, { type NavLink } from '$lib/components/MainNav.svelte';
+    import posthog from 'posthog-js';
 
     export let omitMainId = false;
     let theme: 'light' | 'dark' | null = 'dark';
 
+    // posthog
+    let isHeaderExperiment: boolean = false;
+    let mounted: boolean = false;
+
+    onMount(async () => {
+        if (posthog) {
+            if (posthog.getFeatureFlag('sticky-navigation_ab-test') === 'control') {
+                isHeaderExperiment = false;
+            }
+
+            if (posthog.getFeatureFlag('sticky-navigation_ab-test') === 'sticky-nav') {
+                isHeaderExperiment = true;
+            }
+
+            mounted = true;
+        }
+    });
+
     function setupThemeObserver() {
         const handleVisibility = () => {
             theme = getVisibleTheme();
@@ -97,7 +116,7 @@
         return setupThemeObserver();
     });
 
-    let navLinks: NavLink[] = [
+    let navLinks: Array<NavLink> = [
         {
             label: 'Products',
             submenu: ProductsSubmenu,
@@ -249,7 +268,11 @@
                     target="_blank"
                     rel="noopener noreferrer"
                     class="web-button is-text web-u-inline-width-100-percent-mobile"
-                    on:click={() => trackEvent('Star on GitHub in header')}
+                    on:click={() =>
+                        trackEvent({
+                            plausible: { name: 'Star on GitHub in header' },
+                            posthog: { name: 'github-stars_nav_click' }
+                        })}
                 >
                     <span class="web-icon-star" aria-hidden="true" />
                     <span class="text">Star on GitHub</span>
diff --git a/src/routes/+layout.server.ts b/src/routes/+layout.server.ts
deleted file mode 100644
index b5d99caa3b..0000000000
--- a/src/routes/+layout.server.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { getAllChangelogEntries } from './changelog/utils';
-
-export const prerender = true;
-export const trailingSlash = 'never';
-
-export const load = async () => {
-    return {
-        changelogEntries: (await getAllChangelogEntries()).length
-    };
-};
diff --git a/src/routes/+layout.ts b/src/routes/+layout.ts
new file mode 100644
index 0000000000..a4815b8096
--- /dev/null
+++ b/src/routes/+layout.ts
@@ -0,0 +1,21 @@
+import { getAllChangelogEntries } from './changelog/utils';
+import { browser } from '$app/environment';
+import posthog from 'posthog-js';
+import { PUBLIC_POSTHOG_API_KEY } from '$env/static/public';
+
+export const prerender = true;
+export const trailingSlash = 'never';
+
+export const load = async () => {
+    if (browser) {
+        posthog.init(PUBLIC_POSTHOG_API_KEY, {
+            api_host: 'https://eu.i.posthog.com',
+            person_profiles: 'identified_only',
+            persistence: 'memory'
+        });
+    }
+
+    return {
+        changelogEntries: (await getAllChangelogEntries()).length
+    };
+};
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 234c1a1d2b..c8f2b94cb1 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -123,13 +123,12 @@
                     <a
                         href="/blog/post/introducing-database-backups"
                         class="web-hero-banner-button mb-4"
-                        on:click={() => trackEvent('Banner button click')}
+                        on:click={() => trackEvent({ plausible: { name: 'Banner button click' } })}
                     >
                         <span class="web-icon-star shrink-0" aria-hidden="true" />
                         <span class="text-caption shrink-0 font-medium">New</span>
                         <div class="web-hero-banner-button-sep" />
                         <span class="text-caption web-u-trim-1">Introducing Database Backups</span>
-
                         <span class="web-icon-arrow-right shrink-0" aria-hidden="true" />
                     </a>
                     <Hero>
@@ -148,7 +147,11 @@
                             <a
                                 href={PUBLIC_APPWRITE_DASHBOARD}
                                 class="web-button w-full lg:w-fit"
-                                on:click={() => trackEvent('Get started in hero')}
+                                on:click={() =>
+                                    trackEvent({
+                                        plausible: { name: 'Get started in hero' },
+                                        posthog: { name: 'get-started-btn_hero_click' }
+                                    })}
                             >
                                 Get started
                             </a>
@@ -159,7 +162,7 @@
                 </section>
             </div>
             <div class="mb-12 lg:my-[7.5rem]">
-                <section class="container web-u-padding-block-0" style="--container-size:78.75rem">
+                <section class="web-u-padding-block-0 container" style="--container-size:78.75rem">
                     <div class="web-media-container">
                         <img
                             class="block"
@@ -457,7 +460,8 @@
                         <a
                             href="/docs/sdks"
                             class="web-button is-secondary"
-                            on:click={() => trackEvent('Explore all SDKs')}>Explore all SDKs</a
+                            on:click={() => trackEvent({ plausible: { name: 'Explore all SDKs' } })}
+                            >Explore all SDKs</a
                         >
                     </section>
                 </div>
diff --git a/src/routes/products/auth/(components)/SSR.svelte b/src/routes/products/auth/(components)/SSR.svelte
index a4ae685c15..cd88d20bf7 100644
--- a/src/routes/products/auth/(components)/SSR.svelte
+++ b/src/routes/products/auth/(components)/SSR.svelte
@@ -159,7 +159,8 @@ async function getLoggedInUser(request) {
                             <a
                                 href={platform.href}
                                 class="platform flex size-14 items-center justify-center rounded-lg bg-white p-2"
-                                on:click={() => trackEvent(`${platform.name} clicked`)}
+                                on:click={() =>
+                                    trackEvent({ plausible: { name: `${platform.name} clicked` } })}
                             >
                                 <img
                                     src={platform.image}