From bb33d0eb9ee0ac987c54856ae7fb9ab8e57c9c27 Mon Sep 17 00:00:00 2001 From: Ajit Pratap Singh Date: Thu, 15 Oct 2026 01:26:55 +0530 Subject: [PATCH 1/2] feat(website/home): proof strip, dialect cards, reproducible perf, Use it everywhere - Rename "Trusted by Developers" to "Built for production" (ProofStrip): exactly four cards (stars or race-clean fallback, tests, parse-stage latency, dialects) in a 2x2 / 4x1 grid, plus an integration strip of text and neutral glyphs linking to the MCP guide, /vscode/ and editor docs. - Dialect cards: one neutral glyph, one accent colour, dialect string and only sourced metrics (QA corpus pass N/N for Snowflake/ClickHouse); unsourced percentages and status badges removed. Cards link to /docs/sql-compatibility/#supported-dialects. - Performance: all figures parse stage from metrics.ts, single neutral value colour, solid brand bars, and a Reproduce snippet with copy. - Merge McpSection and VscodeSection into UseEverywhere. - Rename the feature grid heading to avoid a duplicate h2. Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01RkzVu3JY9Y6BRWfjesWts9 --- website/src/app/page.tsx | 10 +- website/src/components/home/AnimatedBars.tsx | 8 +- .../src/components/home/DialectShowcase.tsx | 97 ++++++----- website/src/components/home/FeatureGrid.tsx | 2 +- website/src/components/home/McpSection.tsx | 59 ------- .../components/home/PerformanceSection.tsx | 42 ++--- website/src/components/home/ProofStrip.tsx | 156 ++++++++++++++++++ .../src/components/home/ReproduceSnippet.tsx | 56 +++++++ website/src/components/home/TrustSection.tsx | 146 ---------------- website/src/components/home/UseEverywhere.tsx | 106 ++++++++++++ website/src/components/home/VscodeSection.tsx | 109 ------------ website/src/data/metrics.ts | 2 + 12 files changed, 395 insertions(+), 398 deletions(-) delete mode 100644 website/src/components/home/McpSection.tsx create mode 100644 website/src/components/home/ProofStrip.tsx create mode 100644 website/src/components/home/ReproduceSnippet.tsx delete mode 100644 website/src/components/home/TrustSection.tsx create mode 100644 website/src/components/home/UseEverywhere.tsx delete mode 100644 website/src/components/home/VscodeSection.tsx diff --git a/website/src/app/page.tsx b/website/src/app/page.tsx index fad1b8ff..b3621baa 100644 --- a/website/src/app/page.tsx +++ b/website/src/app/page.tsx @@ -1,11 +1,10 @@ import { Hero } from '@/components/home/Hero'; -import { TrustSection } from '@/components/home/TrustSection'; +import { ProofStrip } from '@/components/home/ProofStrip'; import { PerformanceSection } from '@/components/home/PerformanceSection'; import { FeatureGrid } from '@/components/home/FeatureGrid'; import { DialectShowcase } from '@/components/home/DialectShowcase'; import { CodeExamples } from '@/components/home/CodeExamples'; -import { McpSection } from '@/components/home/McpSection'; -import { VscodeSection } from '@/components/home/VscodeSection'; +import { UseEverywhere } from '@/components/home/UseEverywhere'; import { CtaBanner } from '@/components/home/CtaBanner'; import { getStars } from '@/lib/github'; import { JsonLd } from '@/components/JsonLd'; @@ -75,13 +74,12 @@ export default async function Home() { <> - + - - + ); diff --git a/website/src/components/home/AnimatedBars.tsx b/website/src/components/home/AnimatedBars.tsx index fe19045d..a5781ba6 100644 --- a/website/src/components/home/AnimatedBars.tsx +++ b/website/src/components/home/AnimatedBars.tsx @@ -37,7 +37,7 @@ export function AnimatedBars({ benchmarks, maxOps }: { benchmarks: Benchmark[]; }, []); return ( -
+
`${b.name} ${b.label}`).join(', ')}`}> {benchmarks.map((b, i) => { const widthPercent = (b.ops / maxOps) * 100; return ( @@ -47,11 +47,7 @@ export function AnimatedBars({ benchmarks, maxOps }: { benchmarks: Benchmark[];
= { - 'Excellent': 'bg-ok/10 text-ok border-ok/20', - 'Very Good': 'bg-accent/10 text-accent border-accent/20', - 'Good': 'bg-accent-warm/10 text-accent-warm border-accent-warm/20', - 'In Progress': 'bg-fg-subtle/10 text-fg-subtle border-border', -}; - -function complianceColor(pct: number): string { - if (pct >= 95) return 'text-ok'; - if (pct >= 85) return 'text-accent'; - if (pct >= 80) return 'text-accent-warm'; - return 'text-fg-subtle'; +/** Neutral database glyph shared by every dialect (no vendor marks). */ +function DatabaseGlyph() { + return ( + + ); } export function DialectShowcase() { @@ -45,36 +42,34 @@ export function DialectShowcase() { {PROJECT.dialectCount} SQL Dialects, One Parser

- From PostgreSQL to ClickHouse — parse them all + From PostgreSQL to ClickHouse, selected with a single dialect string

-
+ {/* 8 cards: 2 columns on phones, 4 from md, so every row is full. */} +
    {DIALECTS.map((dialect, i) => ( - - -
    - {dialect.abbr} -
    -

    - {dialect.name} -

    -

    - {dialect.compliance}% -

    - {dialect.detail && ( -

    {dialect.detail}

    - )} - + + - {dialect.status} - -
    -
    + + + +

    {dialect.name}

    + "{dialect.key}" + + {dialect.qa + ? `QA corpus pass ${dialect.qa.pass}/${dialect.qa.total} (${QA_CORPUS.release})` + : 'Coverage notes'} + + + + + ))} -
+
); diff --git a/website/src/components/home/FeatureGrid.tsx b/website/src/components/home/FeatureGrid.tsx index f7ae32c7..16461e33 100644 --- a/website/src/components/home/FeatureGrid.tsx +++ b/website/src/components/home/FeatureGrid.tsx @@ -49,7 +49,7 @@ export function FeatureGrid() {

- Built for Production + Everything you need to work with SQL in Go

diff --git a/website/src/components/home/McpSection.tsx b/website/src/components/home/McpSection.tsx deleted file mode 100644 index 0a357cf1..00000000 --- a/website/src/components/home/McpSection.tsx +++ /dev/null @@ -1,59 +0,0 @@ -import Link from 'next/link'; -import { FadeIn } from '@/components/ui/FadeIn'; -import { TerminalMockup } from '@/components/ui/TerminalMockup'; -import { PROJECT } from '@/data/metrics'; - -const tools = [ - 'parse_sql', - 'format_sql', - 'validate_sql', - 'lint_sql', - 'analyze_sql', - 'detect_injection', - 'list_dialects', -]; - -export function McpSection() { - return ( -
-
- -

- AI-Ready SQL Tools -

-

- Connect {PROJECT.mcpToolCount} SQL tools to Claude, Cursor, or any MCP client — no installation, no API key. -

-
- - - - -
- {tools.map((tool) => ( - - {tool} - - ))} -
-
- -
- - Learn more → - -
-
-
-
- ); -} diff --git a/website/src/components/home/PerformanceSection.tsx b/website/src/components/home/PerformanceSection.tsx index 72a86d8e..566ee249 100644 --- a/website/src/components/home/PerformanceSection.tsx +++ b/website/src/components/home/PerformanceSection.tsx @@ -1,25 +1,27 @@ import { GlassCard } from '@/components/ui/GlassCard'; import { FadeIn } from '@/components/ui/FadeIn'; import { AnimatedCounter } from '@/components/ui/AnimatedCounter'; -import { BENCH_ENV, HEADLINE_OPS_PER_SEC, PARSE_BENCHMARKS, PROJECT, formatOps, opsPerSec } from '@/data/metrics'; +import { BENCH_ENV, HEADLINE_OPS_PER_SEC, PARSE_BENCHMARKS, formatOps, opsPerSec } from '@/data/metrics'; import { AnimatedBars } from './AnimatedBars'; +import { ReproduceSnippet } from './ReproduceSnippet'; interface Stat { - /** Animated numeric value; omit when `text` is shown instead. */ - value?: number; - /** Static text for figures that are ranges or estimates. */ - text?: string; + /** Animated numeric value. */ + value: number; suffix?: string; - label: string; - color: string; prefix?: string; + label: string; } +const [simpleSelect] = PARSE_BENCHMARKS; +const complexQuery = PARSE_BENCHMARKS.find((b) => b.name === 'Complex Query') ?? PARSE_BENCHMARKS[PARSE_BENCHMARKS.length - 1]; + +/* Every figure is parse stage only (pre-tokenized input -> AST); hardware and Go version are in the caption. */ const stats: Stat[] = [ - { value: HEADLINE_OPS_PER_SEC, suffix: '', label: `parses/sec (simple SELECT, parse stage, ${BENCH_ENV.hardware})`, color: 'text-accent-warm', prefix: '~' }, - { value: PARSE_BENCHMARKS[0].nsPerOp, suffix: 'ns', label: 'parse latency (simple SELECT, parse stage)', color: 'text-accent' }, - { text: PROJECT.sql99, label: 'SQL-99 compliance (estimated)', color: 'text-brand' }, - { value: PROJECT.dialectCount, suffix: '', label: 'Dialects', color: 'text-accent' }, + { value: HEADLINE_OPS_PER_SEC, prefix: '~', label: 'parses/sec, simple SELECT (parse stage)' }, + { value: simpleSelect.nsPerOp, suffix: 'ns', label: 'latency, simple SELECT (parse stage)' }, + { value: opsPerSec(complexQuery.nsPerOp), prefix: '~', label: 'parses/sec, complex query (parse stage)' }, + { value: complexQuery.nsPerOp, suffix: 'ns', label: 'latency, complex query (parse stage)' }, ]; const benchmarks = PARSE_BENCHMARKS.map((b) => ({ @@ -44,17 +46,13 @@ export function PerformanceSection() { {/* Stat cards */}
{stats.map((stat, i) => ( - - + +
{stat.prefix && ( - {stat.prefix} - )} - {stat.value !== undefined ? ( - - ) : ( - {stat.text} + {stat.prefix} )} +

{stat.label}

@@ -68,8 +66,12 @@ export function PerformanceSection() {

Parse stage only (not tokenize or end-to-end), {BENCH_ENV.hardware}, {BENCH_ENV.goVersion}. - Source: BenchmarkPerformanceBaseline, median of 10 runs. + Source: {BENCH_ENV.source}.

+
+

Reproduce

+ +
diff --git a/website/src/components/home/ProofStrip.tsx b/website/src/components/home/ProofStrip.tsx new file mode 100644 index 00000000..01d5a1ac --- /dev/null +++ b/website/src/components/home/ProofStrip.tsx @@ -0,0 +1,156 @@ +import Link from 'next/link'; +import { FadeIn } from '@/components/ui/FadeIn'; +import { formatStars } from '@/lib/github'; +import { BENCH_ENV, PARSE_BENCHMARKS, PROJECT, formatCount } from '@/data/metrics'; + +/* ── Inline SVG glyphs (20x20, neutral: they inherit the text colour) ──── */ + +const glyph = { + star: , + check: , + bolt: , + shield: , + globe: ( + <> + + + + ), + plug: , + editor: ( + <> + + + + ), +} as const; + +function Glyph({ name, className = 'text-fg-muted' }: { name: keyof typeof glyph; className?: string }) { + return ( + + ); +} + +/* ── Metric cards (every figure comes from @/data/metrics or the live API) ─ */ + +interface Metric { + id: string; + icon: keyof typeof glyph; + value: string; + label: string; +} + +const simpleSelect = PARSE_BENCHMARKS[0]; + +const latencyCard: Metric = { + id: 'latency', + icon: 'bolt', + value: `~${(simpleSelect.nsPerOp / 1000).toFixed(2)} µs`, + label: `to parse a simple SELECT (${BENCH_ENV.stage}, ${BENCH_ENV.hardware}, ${BENCH_ENV.goVersion})`, +}; + +const testsCard: Metric = { + id: 'tests', + icon: 'check', + value: formatCount(PROJECT.testFunctions), + label: 'Go test functions, race-detector clean in CI', +}; + +const dialectsCard: Metric = { + id: 'dialects', + icon: 'globe', + value: String(PROJECT.dialectCount), + label: 'SQL dialects, one parser', +}; + +/** Shown in place of the stars card when the live count is unavailable, so the grid stays 4-up. */ +const raceCard: Metric = { + id: 'race', + icon: 'shield', + value: 'Zero', + label: 'race-detector failures in CI', +}; + +function buildMetrics(stars: number | null): Metric[] { + const first: Metric = + stars !== null + ? { id: 'stars', icon: 'star', value: formatStars(stars), label: 'GitHub stars' } + : raceCard; + return [first, testsCard, latencyCard, dialectsCard]; +} + +/* ── Integrations (plain names plus neutral glyphs: no third-party logos) ─ */ + +interface Integration { + name: string; + detail: string; + href: string; + icon: keyof typeof glyph; +} + +const integrations: Integration[] = [ + { name: 'Claude', detail: 'MCP server', href: '/docs/mcp-guide/', icon: 'plug' }, + { name: 'Cursor', detail: 'MCP server', href: '/docs/mcp-guide/', icon: 'plug' }, + { name: 'VS Code', detail: 'Extension', href: '/vscode/', icon: 'editor' }, + { name: 'Neovim', detail: 'Language server', href: '/docs/editors/neovim/', icon: 'editor' }, + { name: 'JetBrains', detail: 'Language server', href: '/docs/editors/jetbrains/', icon: 'editor' }, +]; + +/* ── Component ─────────────────────────────────────────────────────────── */ + +export function ProofStrip({ stars }: { stars: number | null }) { + const metrics = buildMetrics(stars); + + return ( +
+
+ +

+ Built for production +

+
+ + {/* Exactly four cards: 2x2 on small screens, 4x1 from lg, so no orphan at any breakpoint. */} +
    + {metrics.map((m, i) => ( +
  • + +
    + + {m.value} + {m.label} +
    +
    +
  • + ))} +
+ + {/* Integration strip */} + +

+ Works with +

+
    + {integrations.map((item) => ( +
  • + + + {item.name} + {item.detail} + +
  • + ))} +
+
+
+
+ ); +} diff --git a/website/src/components/home/ReproduceSnippet.tsx b/website/src/components/home/ReproduceSnippet.tsx new file mode 100644 index 00000000..0a882949 --- /dev/null +++ b/website/src/components/home/ReproduceSnippet.tsx @@ -0,0 +1,56 @@ +'use client'; + +import { useEffect, useRef, useState } from 'react'; + +type CopyState = 'idle' | 'copied' | 'failed'; + +/** A shell command with an always-visible copy button (keyboard and touch friendly). */ +export function ReproduceSnippet({ command }: { command: string }) { + const [state, setState] = useState('idle'); + const timer = useRef | null>(null); + + useEffect(() => () => { + if (timer.current) clearTimeout(timer.current); + }, []); + + const flash = (next: CopyState) => { + setState(next); + if (timer.current) clearTimeout(timer.current); + timer.current = setTimeout(() => setState('idle'), 2000); + }; + + const copy = () => { + if (!navigator.clipboard) { + flash('failed'); + return; + } + navigator.clipboard.writeText(command).then( + () => flash('copied'), + () => flash('failed'), + ); + }; + + const label = state === 'copied' ? 'Copied' : state === 'failed' ? 'Copy failed' : 'Copy'; + + return ( +
+
+        
+          
+          {command}
+        
+      
+ + + {state === 'copied' ? 'Command copied to clipboard' : state === 'failed' ? 'Copy failed, select the command and copy it manually' : ''} + +
+ ); +} diff --git a/website/src/components/home/TrustSection.tsx b/website/src/components/home/TrustSection.tsx deleted file mode 100644 index 74b063f3..00000000 --- a/website/src/components/home/TrustSection.tsx +++ /dev/null @@ -1,146 +0,0 @@ -import { FadeIn } from '@/components/ui/FadeIn'; -import { formatStars } from '@/lib/github'; -import { HEADLINE_CAPTION, HEADLINE_OPS_PER_SEC, PROJECT, formatCount } from '@/data/metrics'; - -/* ── Inline SVG icons (Heroicons-style, 20x20) ────────────────────────── */ - -function StarIcon() { - return ( - - ); -} - -function CheckIcon() { - return ( - - ); -} - -function BoltIcon() { - return ( - - ); -} - -function LockIcon() { - return ( - - ); -} - -function PackageIcon() { - return ( - - ); -} - -/* ── Metric data ───────────────────────────────────────────────────────── */ - -const metrics = [ - { - id: 'stars', - icon: , - value: null, // real count passed in as a prop - label: 'GitHub Stars', - }, - { - id: 'tests', - icon: , - value: formatCount(PROJECT.testFunctions), - label: 'Go test functions', - }, - { - id: 'perf', - icon: , - value: `~${(HEADLINE_OPS_PER_SEC / 1_000_000).toFixed(1)}M`, - label: `parses/sec (${HEADLINE_CAPTION})`, - }, - { - id: 'race', - icon: , - value: 'Zero', - label: 'race-detector failures in CI', - }, - { - id: 'go', - icon: , - value: PROJECT.minGo, - label: 'Minimum Version', - }, -] as const; - -/* ── Integration data ──────────────────────────────────────────────────── */ - -const integrations = [ - { name: 'Claude', detail: 'MCP Server' }, - { name: 'VS Code', detail: 'Extension' }, - { name: 'Cursor', detail: 'MCP Server' }, -] as const; - -/* ── Component ─────────────────────────────────────────────────────────── */ - -export function TrustSection({ stars }: { stars: number | null }) { - // Hide the stars card entirely when the real count is unavailable. - const visible = metrics.filter((m) => m.id !== 'stars' || stars !== null); - - return ( -
-
- {/* Heading */} - -

- Trusted by Developers -

-
- - {/* Metric cards */} -
- {visible.map((m, i) => ( - -
- {m.icon} - - {m.id === 'stars' && stars !== null ? formatStars(stars) : m.value} - - {m.label} -
-
- ))} -
- - {/* Integrations */} - -

- Integrates with -

-
- -
- {integrations.map((item, i) => ( - -
- - {item.name} - - - {item.detail} - -
-
- ))} -
-
-
- ); -} diff --git a/website/src/components/home/UseEverywhere.tsx b/website/src/components/home/UseEverywhere.tsx new file mode 100644 index 00000000..8e1a5b1d --- /dev/null +++ b/website/src/components/home/UseEverywhere.tsx @@ -0,0 +1,106 @@ +import Link from 'next/link'; +import { FadeIn } from '@/components/ui/FadeIn'; +import { TerminalMockup } from '@/components/ui/TerminalMockup'; +import { Button } from '@/components/ui/Button'; +import { PROJECT } from '@/data/metrics'; + +const MCP_TOOLS = [ + 'parse_sql', + 'format_sql', + 'validate_sql', + 'lint_sql', + 'analyze_sql', + 'detect_injection', + 'list_dialects', +]; + +const EDITORS = [ + { name: 'Neovim', href: '/docs/editors/neovim/' }, + { name: 'JetBrains', href: '/docs/editors/jetbrains/' }, + { name: 'Any LSP editor', href: '/docs/lsp-guide/' }, +]; + +/** "Use it everywhere": the MCP server for AI assistants and the language server for editors. */ +export function UseEverywhere() { + return ( +
+
+ +

+ Use it everywhere +

+

+ The same parser powers your Go code, your AI assistant and your editor. +

+
+ +
+ {/* AI assistants (MCP) */} + +
+

AI assistants

+

+ Connect {PROJECT.mcpToolCount} SQL tools to Claude, Cursor or any MCP client. No installation, no API key. +

+ +
    + {MCP_TOOLS.map((tool) => ( +
  • + {tool} +
  • + ))} +
+ + MCP guide + +
+
+ + {/* Editors (LSP) */} + +
+

Editors

+

+ Real-time validation, formatting and linting as you type, across all {PROJECT.dialectCount} dialects, + through the built-in language server (gosqlx lsp). +

+
+ + +
+
    + {EDITORS.map((e) => ( +
  • + + {e.name} setup + +
  • + ))} +
+
+
+
+
+
+ ); +} diff --git a/website/src/components/home/VscodeSection.tsx b/website/src/components/home/VscodeSection.tsx deleted file mode 100644 index 47f11850..00000000 --- a/website/src/components/home/VscodeSection.tsx +++ /dev/null @@ -1,109 +0,0 @@ -import { FadeIn } from '@/components/ui/FadeIn'; -import { GlassCard } from '@/components/ui/GlassCard'; -import { Button } from '@/components/ui/Button'; - -export function VscodeSection() { - return ( -
-
-
- {/* Left: Copy */} -
- -

- IDE Integration -

-

- Real-time SQL validation, formatting, and linting in VS Code. Catch errors as you type with full multi-dialect support. -

- -
-
- - {/* Right: VS Code Mockup */} -
- - - {/* Title bar */} -
-
-
-
- query.sql — GoSQLX -
- {/* Editor content */} -
-
- 1 - - SELECT - u.id, u.name, u.email - -
-
- 2 - - FROM - users - u - -
-
- 3 - - JOIN - orders - o - ON - o.user_id = u.id - -
-
- 4 - - WHERE - u.active = - true - -
-
- 5 - - ORDER BY - u.name - ASC - ; - -
-
- {/* Status bar */} -
-
- - - - - Valid SQL - - | - PostgreSQL -
- 0 issues -
- - -
-
-
-
- ); -} diff --git a/website/src/data/metrics.ts b/website/src/data/metrics.ts index f7d8c611..951abb0d 100644 --- a/website/src/data/metrics.ts +++ b/website/src/data/metrics.ts @@ -48,6 +48,8 @@ export const BENCH_ENV = { goVersion: 'Go 1.27', stage: 'parse stage', source: 'BenchmarkPerformanceBaseline, median of 10 runs, re-measured 2026-10-13', + /** Command that reproduces PARSE_BENCHMARKS from a repo checkout (summarise the 10 runs with benchstat). */ + command: "go test -run='^$' -bench=BenchmarkPerformanceBaseline -benchmem -count=10 ./pkg/sql/parser/", } as const; export interface ParseBenchmark { From 8913c9c2de4d80e2656fbf885848cbc89b3479a8 Mon Sep 17 00:00:00 2001 From: Ajit Pratap Singh Date: Thu, 15 Oct 2026 01:32:27 +0530 Subject: [PATCH 2/2] fix(website/home): keep perf stat figures inside cards on narrow viewports Use compact display values (3.14M, 858K), stay at 2 columns until lg and scale the font down on small screens. Verified no overflow from 320px to 1280px. Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01RkzVu3JY9Y6BRWfjesWts9 --- .../components/home/PerformanceSection.tsx | 26 +++++++------------ 1 file changed, 10 insertions(+), 16 deletions(-) diff --git a/website/src/components/home/PerformanceSection.tsx b/website/src/components/home/PerformanceSection.tsx index 566ee249..20908eaa 100644 --- a/website/src/components/home/PerformanceSection.tsx +++ b/website/src/components/home/PerformanceSection.tsx @@ -1,15 +1,12 @@ import { GlassCard } from '@/components/ui/GlassCard'; import { FadeIn } from '@/components/ui/FadeIn'; -import { AnimatedCounter } from '@/components/ui/AnimatedCounter'; import { BENCH_ENV, HEADLINE_OPS_PER_SEC, PARSE_BENCHMARKS, formatOps, opsPerSec } from '@/data/metrics'; import { AnimatedBars } from './AnimatedBars'; import { ReproduceSnippet } from './ReproduceSnippet'; interface Stat { - /** Animated numeric value. */ - value: number; - suffix?: string; - prefix?: string; + /** Compact display string, short enough to fit a narrow card. */ + display: string; label: string; } @@ -18,10 +15,10 @@ const complexQuery = PARSE_BENCHMARKS.find((b) => b.name === 'Complex Query') ?? /* Every figure is parse stage only (pre-tokenized input -> AST); hardware and Go version are in the caption. */ const stats: Stat[] = [ - { value: HEADLINE_OPS_PER_SEC, prefix: '~', label: 'parses/sec, simple SELECT (parse stage)' }, - { value: simpleSelect.nsPerOp, suffix: 'ns', label: 'latency, simple SELECT (parse stage)' }, - { value: opsPerSec(complexQuery.nsPerOp), prefix: '~', label: 'parses/sec, complex query (parse stage)' }, - { value: complexQuery.nsPerOp, suffix: 'ns', label: 'latency, complex query (parse stage)' }, + { display: `~${formatOps(HEADLINE_OPS_PER_SEC)}`, label: 'parses/sec, simple SELECT (parse stage)' }, + { display: `${simpleSelect.nsPerOp.toLocaleString('en-US')}ns`, label: 'latency, simple SELECT (parse stage)' }, + { display: `~${formatOps(opsPerSec(complexQuery.nsPerOp))}`, label: 'parses/sec, complex query (parse stage)' }, + { display: `${complexQuery.nsPerOp.toLocaleString('en-US')}ns`, label: 'latency, complex query (parse stage)' }, ]; const benchmarks = PARSE_BENCHMARKS.map((b) => ({ @@ -44,15 +41,12 @@ export function PerformanceSection() { {/* Stat cards */} -
+
{stats.map((stat, i) => ( - -
- {stat.prefix && ( - {stat.prefix} - )} - + +
+ {stat.display}

{stat.label}