fix(blog): remove inline backticks and add indexed per-dollar images

[Oseltamivir]

Summary

• remove Tailwind Typography-generated backticks from inline code within blog prose
• add an automatically generated, crawlable performance-per-dollar PNG for every indexed /compare-per-dollar/<slug> page
• expose each PNG through a visible image, sitemap image entry, and JSON-LD metadata
• render high-resolution chart graphics with heavy series lines, in-chart axis labels, and series-colored summary values

Implementation

getAllComparableCompareSlugs() remains the shared comparable-pair inventory. Its per-dollar sitemap consumer now maps every returned canonical slug to /performance-per-dollar.png, while the dynamic PNG route generates the image from the same SSR interpolated cost data as the page. This covers all current and future comparable per-dollar pages without client-side chart-export automation.

Root Causes

• Blog content is rendered inside Tailwind Typography prose, which adds visible ::before and ::after delimiters to inline <code> elements.
• The existing interactive chart export is browser-only DOM capture and cannot provide stable crawlable image URLs for Google Images.

Impact

• Inline model identifiers render as monospace text without duplicate visible backticks.
• Every indexed per-dollar comparison page has a stable chart PNG suitable for image discovery and page display.

Validation

• pnpm fmt
• pnpm typecheck
• E2E_FIXTURES=1 pnpm build
• rendered and visually inspected a representative PNG locally (2400x1350)
• no test suite run locally, per request

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
inferencemax-app	Ready	Preview, Comment	May 26, 2026 8:05pm