Add Traces product page

[SaraMiteva]

Changes

Adds a new /traces product page for PostHog's distributed tracing (APM) product, built on the shared Slides/Presentation template and mirroring the /logs page layout.

Slides, in order:

• Hero – "Straight to the line that broke"
• Your product, fixing itself – tabbed walkthrough (Scout → Signal → Investigate → PR → Merge)
• Every span of a request, in one waterfall – copy + screenshot split
• Catnip for agents – why traces beat other signal sources (styled after the /code instrumentation cards)
• PostHog vs… (tl;dr) – standard comparison-summary
• Feature comparison – custom table vs. Better Stack, Datadog, Sentry, with competitor logos in the header
• PostHog Code in Slack – closing callout with the yellow "About the Slack app" CTA

Traces is registered as a WIP product in useProduct.ts, so it doesn't yet surface in the billed-products grid.

Why: New product landing page for Traces, authored slide by slide from a Slack thread.

Note: the Datadog column uses an existing Cloudinary image (a .jpeg with a white background) since we don't have a transparent Datadog logo in the repo yet — worth swapping for a proper SVG later.

Checklist

• I've read the docs and/or content style guides.
• Words are spelled using American English
• Use relative URLs for internal links
• I've checked the pages added or changed in the Vercel preview build
• If I moved a page, I added a redirect in vercel.json

---

Created with PostHog from a Slack thread

[github-actions]

Deploy preview

Status	Details	Updated (UTC)
🟢 Ready	View preview	Jul 06, 2026 12:33PM

[github-actions]

Bundle report

Total JS (gzip)

6.30 MiB (+5.0 KiB / +0.1%)

Largest changed named chunks

Chunk	Gzip	Δ vs master
0bb1dd44b1bd3a60bee477d3e0806b68b5e25292.js	30.4 KiB	new
69d164372a2c8a9de106892eaf692e5a0d68963a.js	7.4 KiB	new
779e4efdbaaca25a23ccc55f6f242e580522eb0a.js	7.3 KiB	new
b9ba1f9f2072ee8f12268be85313f5d3a38d724f.js	4.9 KiB	new
app.js	1983.0 KiB	+2.7 KiB / +0.1%
component---src-pages-traces-index-tsx.js	2.3 KiB	new

Eager graph (static-import closure per entrypoint)

Entrypoint	Eager size	Budget	Modules
✅ app	24.23 MiB (+7.6 KiB / +0.0%)	report-only	5516

Largest modules in the app closure

Module	Size
css ./node_modules/.pnpm/css-loader@5.2.7_webpack@5.101.3/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[8].oneOf[1].use[1]!./node_modules/.pnpm/postcss-loader@4.3.0_postcss@8.5.6_webpack@5.101.3/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[8].oneOf[1].use[2]!./src/styles/global.css	707.9 KiB
./src/components/Stickers/Stickers.tsx	696.4 KiB
./.cache/caches/gatsby-plugin-mdx/mdx-scopes-dir/31a094f140f119e73085d847ae81b99b.js + 2 modules	585.5 KiB
./node_modules/.pnpm/@radix-ui+react-icons@1.3.2_react@18.3.1/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js	481.4 KiB
./node_modules/.pnpm/@codemirror+view@6.38.2/node_modules/@codemirror/view/dist/index.js	458.1 KiB
./node_modules/.pnpm/rehype-raw@7.0.0/node_modules/rehype-raw/lib/index.js + 29 modules	395.1 KiB
./node_modules/.pnpm/@posthog+icons@0.36.6_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@posthog/icons/dist/posthog-icons.cjs.js	364.8 KiB
./node_modules/.pnpm/@posthog+icons@0.36.6_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@posthog/icons/dist/posthog-icons.es.js	354.8 KiB
./src/hooks/useCustomers.tsx + 54 modules	353.9 KiB
./node_modules/.pnpm/react-markdown@8.0.7_@types+react@16.14.66_react@18.3.1/node_modules/react-markdown/lib/react-markdown.js + 88 modules	351.4 KiB
./node_modules/.pnpm/cloudinary-core@2.14.0_lodash@4.17.21/node_modules/cloudinary-core/cloudinary-core.js	281.9 KiB
./src/components/ProductComparisonTable/index.tsx + 116 modules	267.6 KiB
./node_modules/.pnpm/@codesandbox+sandpack-react@2.20.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@codesandbox/sandpack-react/dist/index.mjs	266.6 KiB
./node_modules/.pnpm/d3@7.9.0/node_modules/d3/src/index.js + 208 modules	247.4 KiB
./src/components/Pricing/PricingSlider/Slider.tsx + 87 modules	239.9 KiB

---

Eager-graph budgets are report-only until a baseline is established. Sizes are gzip of public/**/*.js; eager size is webpack module source bytes.