PageSourceSearch

https://posthog.com/component---src-pages-r-observability-tsx-136a569bbd455a27e1ce.js

js posthog.com collected 2026-09-24 07:59:40 UTC 19,105 bytes, 2 lines download raw bytes

1"use strict";(self.webpackChunkposthog_com=self.webpackChunkposthog_com||[]).push([[2727],{31751:function(e,s,t){t.r(s),t.d(s,{default:function(){return _}});var r=t(95114),o=t(30758),i=t(8462),n=t(40435),a=t(91965),l=t(72753),c=t(56380),d=t(83079),h=t(76652),p=t(2212),g=t(93747),u=t(43998),m=t(7233),x=t(36165),y=t(54932),j=t(82159),w=t(72433),k=t(49271),f=t(86070);const b=8,v=["/docs/error-tracking/installation/nextjs","/docs/error-tracking/installation/react","/docs/error-tracking/installation/web","/docs/error-tracking/installation/react-native","/docs/error-tracking/installation/node","/docs/error-tracking/installation/python","/docs/error-tracking/installation/manual","/docs/error-tracking/installation/flutter","/docs/error-tracking/installation/nuxt","/docs/error-tracking/installation/angular","/docs/error-tracking/installation/android","/docs/error-tracking/installation/svelte","/docs/error-tracking/installation/hono","/docs/error-tracking/installation/ruby","/docs/error-tracking/installation/ios","/docs/error-tracking/installation/go"];function _(){const{0:e,1:s}=(0,o.useState)(!1),{0:t,1:_}=(0,o.useState)(!1),{0:N,1:A}=(0,o.useState)(!1),S=(0,x.A)("docs/error-tracking/installation","observability installation"),E=(0,o.useMemo)(()=>{const e=new Map(S.map(e=>[e.url,e])),s=v.map(s=>e.get(s)).filter(Boolean),t=S.filter(e=>!v.includes(e.url)),o=[].concat((0,r.A)(s),(0,r.A)(t));return{top:o.slice(0,b),rest:o.slice(b)}},[S]);return(0,o.useEffect)(()=>{let e;const s=()=>{_(!1),clearTimeout(e),e=setTimeout(()=>_(!0),2e3)};s(),window.addEventListener("pointermove",s),window.addEventListener("keydown",s);const t=document.querySelector("[data-radix-scroll-area-viewport]");return null==t||t.addEventListener("scroll",s),()=>{clearTimeout(e),window.removeEventListener("pointermove",s),window.removeEventListener("keydown",s),null==t||t.removeEventListener("scroll",s)}},[]),(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(i.Ay,{title:"Observability built for product engineers",description:"PostHog Observability bundles error tracking, session replay, and logs into one SDK and one tool – wired up to MCP so your AI agent can investigate issues end-to-end. Free tier covers 100k exceptions, 5k recordings, and 10GB of logs every month.",noindex:!0}),(0,f.jsxs)(n.Ay,{hideLeftSidebar:!0,hideRightSidebar:!0,hideTitle:!0,title:"Observability built for product engineers",contentMaxWidthClass:"max-w-5xl",showQuestions:!1,children:[(0,f.jsxs)("div",{className:"grid grid-cols-1 @lg:grid-cols-[2fr_0.6fr] gap-10 items-center mb-6 max-w-7xl mx-auto",children:[(0,f.jsxs)("div",{children:[(0,f.jsx)("h1",{className:"text-3xl md:text-5xl !mb-4",children:"Your errors, replays, and logs already know each other"}),(0,f.jsxs)("p",{className:"text-lg md:text-xl !mb-6 text-secondary",children:["Error tracking, session replay, and logs from one SDK – same user, same session, linked the moment they arrive. An MCP server so you can debug without ever opening a dashboard or learning a UI.",(0,f.jsx)("br",{}),"Time to make it official."]}),(0,f.jsxs)("div",{className:"flex flex-wrap gap-2 mb-6",children:[(0,f.jsx)(l.E0,{type:"primary",size:"md",to:"https://app.posthog.com/signup",children:"Get started free"}),(0,f.jsx)(l.E0,{type:"secondary",size:"md",onClick:()=>{var e;null===(e=document.getElementById("quest-item-let-your-ai-agent-debug-for-you"))||void 0===e||e.scrollIntoView({behavior:"smooth"})},children:"Install MCP"})]}),(0,f.jsxs)("p",{className:"text-sm !mb-0 text-secondary",children:["One install gets you"," ",(0,f.jsx)(p.A,{to:"/docs/error-tracking",state:{newWindow:!0},children:"error tracking"}),","," ",(0,f.jsx)(p.A,{to:"/docs/session-replay",state:{newWindow:!0},children:"session replay"}),", and"," ",(0,f.jsx)(p.A,{to:"/docs/logs",state:{newWindow:!0},children:"logs"})," ","– already connected to each other. Free for 100k exceptions, 5k web + 2.5k mobile recordings, and 10 GB of logs every month. No credit card, no per-seat pricing."]})]}),(0,f.jsx)("div",{className:"flex justify-center",children:(0,f.jsx)(g.A,{src:"https://res.cloudinary.com/dmukukwp6/image/upload/q_auto,f_auto/bug_catcher_719a67117f.png",alt:"PostHog hedgehog with a magnifying glass",className:"w-full max-w-[220px] mx-auto"})})]}),(0,f.jsxs)("div",{className:"mb-12 max-w-7xl mx-auto",children:[(0,f.jsxs)("div",{className:"flex flex-wrap items-center gap-x-10 gap-y-6 text-primary dark:text-primary-dark",children:[(0,f.jsx)(y.A,{className:"fill-current object-contain max-w-full h-7"}),(0,f.jsx)(g.A,{src:"https://res.cloudinary.com/dmukukwp6/image/upload/q_auto,f_auto/2025_MG_Logo_Full_9fdb693543.png",alt:"MoneyGram",imgClassName:"h-9 w-auto object-contain max-w-full dark:brightness-0 dark:invert"}),(0,f.jsx)(j.A,{className:"object-contain max-w-full h-11"}),(0,f.jsx)(w.A,{className:"object-contain max-w-full h-5"})]}),(0,f.jsxs)("p",{className:"text-xs mt-3 !mb-0",children:[(0,f.jsx)("span",{className:"font-semibold",children:"A few PostHog customers debugging with us in production."}),(0,f.jsx)("br",{}),(0,f.jsx)("span",{className:"text-muted",children:"(Yes they actually use us, no it's not just some random engineer who tried us out 2+ years ago.)"})]})]}),(0,f.jsx)("div",{className:t?"quest-idle":"",children:(0,f.jsxs)(a.Lj,{firstSpeechBubble:"Let's get observable!",lastSpeechBubble:"Time to start shipping!",children:[(0,f.jsxs)(a.iT,{title:"Install once, get all three",subt
1itle:"Error tracking, replay, and logs from one SDK",icon:"IconMagicWand",children:[(0,f.jsxs)("p",{children:["One PostHog SDK install enables ",(0,f.jsx)("strong",{children:"error tracking"}),","," ",(0,f.jsx)("strong",{children:"session replay"}),", and ",(0,f.jsx)("strong",{children:"logs"}),". The Wizard handles config in a single command – no copy-pasting three different snippets, no juggling three different services."]}),(0,f.jsx)(m.A,{}),(0,f.jsx)("p",{children:"The three signals share the same user identity, the same session, and the same project. An exception, a replay of the user who hit it, and the surrounding log lines are already linked the moment they arrive."}),(0,f.jsx)("h3",{children:"Or install the SDK directly"}),(0,f.jsx)(h.A,{className:"grid gap-4 grid-cols-2 @md:grid-cols-2 not-prose",items:E.top}),e&&E.rest.length>0&&(0,f.jsx)(h.A,{className:"grid gap-4 grid-cols-2 @md:grid-cols-2 not-prose mt-4",items:E.rest}),(0,f.jsx)("button",{onClick:()=>s(!e),className:"mt-3 text-red dark:text-yellow font-semibold text-sm cursor-pointer hover:underline",children:e?"Show less":"See more platforms"}),(0,f.jsxs)("p",{className:"mt-4 text-sm text-secondary",children:["Need platform-specific instructions for just one signal? See the"," ",(0,f.jsx)(p.A,{to:"/docs/session-replay/installation",state:{newWindow:!0},children:"session replay"})," ","or"," ",(0,f.jsx)(p.A,{to:"/docs/logs/installation",state:{newWindow:!0},children:"logs"})," ","install guides."]}),(0,f.jsx)("div",{className:"mt-4",children:(0,f.jsx)(l.E0,{type:"primary",size:"md",to:"https://app.posthog.com/signup",children:"Get started free"})})]}),(0,f.jsxs)(a.iT,{title:"Let your AI agent debug for you",subtitle:"MCP across errors, replays, and logs",icon:"IconSparkles",children:[(0,f.jsxs)("p",{children:[(0,f.jsx)("strong",{children:"Already shipping with PostHog Code, Claude Code, Cursor, Codex, or Windsurf? Boy howdy, you're going to love this."})," ","Wire up the PostHog MCP server and your agent can investigate an exception, pull the replay of the user who hit it, and tail the surrounding logs – all from your editor."]}),(0,f.jsx)("h3",{children:"Install in 30 seconds"}),(0,f.jsx)(u.hc,{language:"bash",showAskAI:!1,children:"npx @posthog/wizard mcp add"}),(0,f.jsx)(d.p,{videoLight:"https://res.cloudinary.com/dmukukwp6/video/upload/mcp_error_tracking_debugging30_6e25828d88.mp4",videoDark:void 0,classes:"rounded border border-primary",autoPlay:!0,loop:!0}),(0,f.jsx)("h3",{children:"Try prompts like"}),(0,f.jsxs)("ul",{children:[(0,f.jsx)("li",{children:(0,f.jsx)("em",{children:'"Why are checkout errors spiking? Show me a replay of a user who hit one and the surrounding logs."'})}),(0,f.jsx)("li",{children:(0,f.jsx)("em",{children:'"A user reported the dashboard is broken at 2pm. Find the session, the exception, and the matching log lines."'})}),(0,f.jsx)("li",{children:(0,f.jsx)("em",{children:'"Generate a regression test from the failing session in replay 12345 using the stack trace and request payload."'})}),(0,f.jsx)("li",{children:(0,f.jsx)("em",{children:'"Show error logs from the API service in the last hour and group by route."'})}),(0,f.jsx)("li",{children:(0,f.jsx)("em",{children:'"Find every session where CheckoutButton threw an error in the last 24h and summarize the pattern."'})})]}),(0,f.jsx)("h3",{children:"Or use PostHog AI inside the app"}),(0,f.jsxs)("p",{children:["Don't want to leave the browser?"," ",(0,f.jsx)(p.A,{to:"/docs/posthog-ai",state:{newWindow:!0},children:"PostHog AI"})," ","lives in the app and can search replays, summarize log patterns, and triage errors in plain language."]}),(0,f.jsxs)("div",{className:"flex flex-wrap gap-2 mt-4",children:[(0,f.jsx)(l.E0,{type:"primary",size:"md",onClick:()=>{navigator.clipboard.writeText("npx @posthog/wizard mcp add"),A(!0),setTimeout(()=>A(!1),2e3)},children:N?"npx command copied! 🚀":"Install MCP"}),(0,f.jsx)(l.E0,{type:"secondary",size:"md",to:"https://app.posthog.com/signup",children:"Get started free"})]})]}),(0,f.jsxs)(a.iT,{title:"Catch every exception",subtitle:"Autocapture errors with real stack traces",icon:"IconWarning",children:[(0,f.jsxs)("p",{children:["Autocapture in Error Tracking catches ",(0,f.jsx)("code",{children:"$exception"})," events the moment they're thrown, client- or server-side. Upload your source maps and stack traces point straight to your original co
1de – file, line, and function."]}),(0,f.jsx)("p",{children:"Exceptions group into issues automatically. Assign them, resolve them, or wire up Slack, Discord, Teams, or a webhook so the right person hears about it instead of your users."}),(0,f.jsx)(c.G,{imageLight:"https://res.cloudinary.com/dmukukwp6/image/upload/SCR_20250728_ryub_aa8398de10.png",imageDark:"https://res.cloudinary.com/dmukukwp6/image/upload/SCR_20250728_rzmm_23fa3181c4.png",alt:"Error tracking issue with stack trace",classes:"rounded",padding:!1,zoom:void 0}),(0,f.jsxs)("ul",{children:[(0,f.jsx)("li",{children:"Autocapture exceptions in the browser, mobile, and server-side"}),(0,f.jsx)("li",{children:"Accurate stack traces via source maps"}),(0,f.jsx)("li",{children:"Customize issue grouping with rules"}),(0,f.jsx)("li",{children:"Alerts on triggers, filters, and trends"}),(0,f.jsxs)("li",{children:[(0,f.jsx)(k.IconRewindPlay,{className:"text-yellow w-5 -mt-1 inline-block"})," Jump from any exception straight into the replay of the user who hit it"]})]}),(0,f.jsx)("div",{className:"mt-4",children:(0,f.jsx)(l.E0,{type:"primary",size:"md",to:"/docs/error-tracking",state:{newWindow:!0},children:"Explore error tracking"})})]}),(0,f.jsxs)(a.iT,{title:"Watch the session with the console open",subtitle:"Session replay with DevTools context",icon:"IconRewindPlay",children:[(0,f.jsxs)("p",{children:["Rethink what replays look like with PostHog. Sure, you get the video, but you also get dev-tools level context synced to the timeline: console logs, network requests, performance data, rage clicks, dead clicks, craaaazy clicks. (Yes, even those.)",(0,f.jsx)("br",{}),(0,f.jsx)("br",{}),'When a user says "it just broke," you get the full picture with frontend context and backend visibility.']}),(0,f.jsx)(c.G,{imageLight:"https://res.cloudinary.com/dmukukwp6/image/upload/q_auto,f_auto/annotated_replay_inspector_ec4ceb5761.png",imageDark:"https://res.cloudinary.com/dmukukwp6/image/upload/q_auto,f_auto/annotated_replay_inspector_dark_c040e66ee5.png",alt:"Session replay activity panel",classes:"rounded",padding:!1,zoom:void 0}),(0,f.jsxs)("ul",{children:[(0,f.jsx)("li",{children:"Jump to any event in the timeline to skip to what matters"}),(0,f.jsx)("li",{children:"See console errors and network failures in exact context"}),(0,f.jsx)("li",{children:"Automatic rage-click and dead-click detection (no tagging needed)"}),(0,f.jsx)("li",{children:"Save filters as collections your team can reuse"}),(0,f.jsxs)("li",{children:[(0,f.jsx)(k.IconWarning,{className:"text-orange w-5 -mt-1 inline-block"})," Every replay is linked to the exceptions and"," ",(0,f.jsx)(k.IconCode2,{className:"text-purple w-5 -mt-1 inline-block"})," log lines from the same session"]})]}),(0,f.jsx)("div",{className:"mt-4",children:(0,f.jsx)(l.E0,{type:"primary",size:"md",to:"/docs/session-replay",state:{newWindow:!0},children:"Explore session replay"})})]}),(0,f.jsxs)(a.iT,{title:"Search and tail your logs",subtitle:"OTel-native logs with full-text search",icon:"IconCode2",children:[(0,f.jsx)("p",{children:"PostHog Logs works with any OpenTelemetry client – no PostHog-specific packages required. Point your existing OTel SDK at PostHog, drop in your project token, and your structured logs land alongside everything else."}),(0,f.jsx)(c.G,{imageLight:"https://res.cloudinary.com/dmukukwp6/image/upload/w_1600,c_limit,q_auto,f_auto/logs_light_dd81ff5093.png",imageDark:"https://res.cloudinary.com/dmukukwp6/image/upload/w_1600,c_limit,q_auto,f_auto/logs_dark_d7135f1b22.png",alt:"PostHog Logs search interface",classes:"rounded",padding:!1,zoom:void 0}),(0,f.jsxs)("ul",{children:[(0,f.jsx)("li",{children:"Full-text search with multiple tokens and negative filters"}),(0,f.jsx)("li",{children:"Filter by time, service, resource attributes, or log level"}),(0,f.jsx)("li",{children:"Alert when error logs spike or specific patterns appear"}),(0,f.jsxs)("li",{children:[(0,f.jsx)(k.IconRewindPlay,{className:"text-yellow w-5 -mt-1 inline-block"})," One click from a log line to the session replay of the user who triggered it"]}),(0,f.jsxs)("li",{children:[(0,f.jsx)(k.IconWarning,{className:"text-orange w-5 -mt-1 inline-block"})," Logs with"," ",(0,f.jsx)("code",{children:"$exception"})," events automatically become issues in error tracking"]})]}),(0,f.jsx)("div",{className:"mt-4",children:(0,f.jsx)(l.E0,{type:"primary",size:"md",to:"/docs/logs",state:{newWindow:!0},children:"Explore logs"})})]}),(0,f.jsxs)(a.iT,{title:"One signal, three views",subtitle:"Why the bundle beats three vendors",icon:"IconLogomark",children:[(0,f.jsx)("p",{children:"Most observability stacks are three tools stitched together with hope. PostHog Observability is one tool with three lenses on the same data. Every exception already knows the session it came from. Every log line already knows the user. Every replay already has the network calls and console errors attached."}),(0,f.jsxs)("h3",{children:[(0,f.jsx)(k.IconWarning,{className:"text-orange w-7 -mt-1 inline-block"})," Error → Replay"]}),(0,f.jsx)("p",{children:"Click any exception to land in the replay of the user who hit it. No matching IDs, no CSV exports, no copy-
1pasting timestamps between dashboards."}),(0,f.jsx)(d.p,{videoLight:"https://res.cloudinary.com/dmukukwp6/video/upload/Error_tracking_sessions_0b0a535be8.mp4",videoDark:void 0,autoPlay:!0,loop:!0,classes:"rounded border border-primary"}),(0,f.jsxs)("h3",{children:[(0,f.jsx)(k.IconCode2,{className:"text-purple w-7 -mt-1 inline-block"})," Logs → Session"]}),(0,f.jsx)("p",{children:"Log lines link to the session and user who produced them. Jump from a noisy log burst straight into the recording to see the clicks and network failures that produced it."}),(0,f.jsx)(c.G,{imageLight:"https://res.cloudinary.com/dmukukwp6/image/upload/q_auto,f_auto/SCR_20260427_tlab_c79adf4315.png",imageDark:"https://res.cloudinary.com/dmukukwp6/image/upload/q_auto,f_auto/SCR_20260427_tpbx_e2154c4155.png",alt:"Logs linked to a session replay",classes:"rounded",padding:!1,zoom:void 0}),(0,f.jsxs)("h3",{children:[(0,f.jsx)(k.IconRewindPlay,{className:"text-yellow w-7 -mt-1 inline-block"})," Replay → Logs & Errors"]}),(0,f.jsx)("p",{children:"The activity panel inside every replay already shows the console errors, network failures, and structured log lines for that session. Same data, same place, no tab switching."}),(0,f.jsx)("div",{className:"mt-4",children:(0,f.jsx)(l.E0,{type:"primary",size:"md",to:"https://app.posthog.com/signup",children:"Try the bundle – free"})})]}),(0,f.jsxs)(a.iT,{title:"Use for free",subtitle:"100k exceptions, 5k recordings, 10 GB of logs",icon:"IconPiggyBank",children:[(0,f.jsx)("p",{children:"Good news: no per-seat pricing, no enterprise plan required."}),(0,f.jsx)("p",{children:"More than 90% of companies use PostHog for free."}),(0,f.jsx)("h3",{children:"TL;DR 💸"}),(0,f.jsxs)("ul",{children:[(0,f.jsx)("li",{children:"No credit card required to start"}),(0,f.jsxs)("li",{children:[(0,f.jsx)("strong",{children:"Error tracking:"})," 100k exceptions/mo free, then $0.000370 per exception with volume discounts"]}),(0,f.jsxs)("li",{children:[(0,f.jsx)("strong",{children:"Session replay:"})," 5,000 web + 2,500 mobile recordings/mo free, then from $0.005 per recording"]}),(0,f.jsxs)("li",{children:[(0,f.jsx)("strong",{children:"Logs:"})," 10 GB ingested/mo free, then $0.25/GB with discounts"]}),(0,f.jsxs)("li",{children:[(0,f.jsx)("strong",{children:"PostHog MCP is included"})," on every plan (no enterprise plan required)"]}),(0,f.jsx)("li",{children:"Set billing limits per product to avoid surprise charges"}),(0,f.jsxs)("li",{children:["See full pricing for"," ",(0,f.jsx)(p.A,{to:"/docs/error-tracking/pricing",state:{newWindow:!0},children:"error tracking"}),","," ",(0,f.jsx)(p.A,{to:"/docs/session-replay/pricing",state:{newWindow:!0},children:"session replay"}),", and"," ",(0,f.jsx)(p.A,{to:"/docs/logs/pricing",state:{newWindow:!0},children:"logs"})]})]}),(0,f.jsx)("hr",{className:"my-6"}),(0,f.jsx)("p",{children:"That's it! You're ready to start integrating."}),(0,f.jsxs)("div",{className:"flex flex-wrap gap-2 mt-4",children:[(0,f.jsx)(l.E0,{type:"primary",size:"md",to:"https://app.posthog.com/signup",children:"Get started free"}),(0,f.jsx)(l.E0,{type:"secondary",size:"md",to:"/talk-to-a-human",state:{newWindow:!0},children:"Talk to a human"})]})]})]})}),(0,f.jsxs)("div",{className:"text-center py-16 mt-4 opacity-60 hover:opacity-100 transition-opacity duration-500",children:[(0,f.jsx)("p",{className:"text-sm text-secondary italic !mb-4",children:"You made it to the bottom. That means you probably read stack traces before filing a bug report. Mad respect."}),(0,f.jsx)(g.A,{src:"https://res.cloudinary.com/dmukukwp6/image/upload/q_auto,f_auto/Frame_10138_5169832152.png",alt:"PostHog hedgehog",className:"mx-auto mb-4",imgClassName:"w-28 h-auto"}),(0,f.jsxs)("p",{className:"text-sm text-secondary italic !mb-0",children:["Now go install the"," ",(0,f.jsx)(p.A,{to:"/docs/model-context-protocol",className:"underline",children:"PostHog MCP"})," ","and let your agent do the debugging. You've earned it."]})]})]})]})}}}]);
2//# sourceMappingURL=component---src-pages-r-observability-tsx-136a569bbd455a27e1ce.js.map

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.