Skip to content

Commit 21b0683

Browse files
andreakiroandreakiro
committed
SEO/GEO optimization: metadata, structured data, crawlability, and LLM discoverability
1 parent 54e4285 commit 21b0683

12 files changed

Lines changed: 690 additions & 4 deletions

File tree

‎web/app/apple-icon.tsx‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import { ImageResponse } from "next/og";
2+
3+
export const size = { width: 180, height: 180 };
4+
export const contentType = "image/png";
5+
6+
export default function AppleIcon() {
7+
return new ImageResponse(
8+
(
9+
<div
10+
style={{
11+
width: "100%",
12+
height: "100%",
13+
display: "flex",
14+
alignItems: "center",
15+
justifyContent: "center",
16+
background: "#0a0a0a",
17+
borderRadius: "36px",
18+
fontFamily: "sans-serif",
19+
}}
20+
>
21+
<span
22+
style={{
23+
fontSize: "90px",
24+
fontWeight: 700,
25+
color: "#ffffff",
26+
letterSpacing: "-2px",
27+
}}
28+
>
29+
BA
30+
</span>
31+
</div>
32+
),
33+
size
34+
);
35+
}

‎web/app/icon-192/route.tsx‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import { ImageResponse } from "next/og";
2+
3+
export const runtime = "edge";
4+
5+
export async function GET() {
6+
return new ImageResponse(
7+
(
8+
<div
9+
style={{
10+
width: "100%",
11+
height: "100%",
12+
display: "flex",
13+
alignItems: "center",
14+
justifyContent: "center",
15+
background: "#0a0a0a",
16+
borderRadius: "38px",
17+
fontFamily: "sans-serif",
18+
}}
19+
>
20+
<span
21+
style={{
22+
fontSize: "96px",
23+
fontWeight: 700,
24+
color: "#ffffff",
25+
letterSpacing: "-2px",
26+
}}
27+
>
28+
BA
29+
</span>
30+
</div>
31+
),
32+
{ width: 192, height: 192 },
33+
);
34+
}

‎web/app/icon-512/route.tsx‎

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import { ImageResponse } from "next/og";
2+
3+
export const runtime = "edge";
4+
5+
export async function GET() {
6+
return new ImageResponse(
7+
(
8+
<div
9+
style={{
10+
width: "100%",
11+
height: "100%",
12+
display: "flex",
13+
alignItems: "center",
14+
justifyContent: "center",
15+
background: "#0a0a0a",
16+
borderRadius: "102px",
17+
fontFamily: "sans-serif",
18+
}}
19+
>
20+
<span
21+
style={{
22+
fontSize: "256px",
23+
fontWeight: 700,
24+
color: "#ffffff",
25+
letterSpacing: "-6px",
26+
}}
27+
>
28+
BA
29+
</span>
30+
</div>
31+
),
32+
{ width: 512, height: 512 },
33+
);
34+
}

‎web/app/icon.svg‎

Lines changed: 4 additions & 0 deletions
Loading

‎web/app/layout.tsx‎

Lines changed: 213 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20,10 +20,207 @@ const dmSans = DM_Sans({
2020
variable: "--font-dm-sans",
2121
});
2222

23+
const SITE_URL = "https://browserarena.ai";
24+
const SITE_NAME = "The Browser Arena";
25+
const SITE_DESCRIPTION =
26+
"Open-source benchmarks comparing cloud browser infrastructure providers on speed, reliability, and cost. Built by Notte — compare Notte, Browserbase, Steel, Hyperbrowser, Kernel, Anchor Browser, and Browser Use for AI browser agents and web automation.";
27+
2328
export const metadata: Metadata = {
24-
title: "The Browser Arena",
25-
description:
26-
"Real benchmarks for cloud browser providers. Compare session creation, connection, navigation, and release times.",
29+
metadataBase: new URL(SITE_URL),
30+
title: {
31+
default: `${SITE_NAME} — Cloud Browser Provider Benchmarks`,
32+
template: `%s | ${SITE_NAME}`,
33+
},
34+
description: SITE_DESCRIPTION,
35+
keywords: [
36+
"cloud browser benchmark",
37+
"browser infrastructure comparison",
38+
"best browser for AI agents",
39+
"browser provider comparison",
40+
"headless browser performance",
41+
"browser automation benchmark",
42+
"browser infrastructure",
43+
"cloud browser latency",
44+
"Notte browser",
45+
"Notte cloud browser",
46+
"Browserbase",
47+
"Steel",
48+
"Hyperbrowser",
49+
"Kernel",
50+
"Anchor Browser",
51+
"Browser Use",
52+
"browser for AI agents",
53+
"AI agent browser infrastructure",
54+
"session creation time",
55+
"CDP connection",
56+
"browser-as-a-service",
57+
"open source benchmark",
58+
"web automation",
59+
"browser API comparison",
60+
"AI browser agent benchmark",
61+
"best cloud browser provider",
62+
"browser infrastructure for agents",
63+
"headless browser for AI",
64+
],
65+
authors: [{ name: "Notte Labs", url: "https://notte.cc" }],
66+
creator: "Notte Labs",
67+
publisher: "Notte Labs",
68+
robots: {
69+
index: true,
70+
follow: true,
71+
"max-image-preview": "large",
72+
"max-snippet": -1,
73+
"max-video-preview": -1,
74+
googleBot: {
75+
index: true,
76+
follow: true,
77+
"max-image-preview": "large",
78+
"max-snippet": -1,
79+
"max-video-preview": -1,
80+
},
81+
},
82+
alternates: {
83+
canonical: SITE_URL,
84+
},
85+
openGraph: {
86+
type: "website",
87+
locale: "en_US",
88+
url: SITE_URL,
89+
siteName: SITE_NAME,
90+
title: `${SITE_NAME} — Cloud Browser Provider Benchmarks`,
91+
description: SITE_DESCRIPTION,
92+
images: [
93+
{
94+
url: "/og-image",
95+
width: 1200,
96+
height: 630,
97+
alt: "The Browser Arena — comparing cloud browser providers on speed, reliability, and cost",
98+
type: "image/png",
99+
},
100+
],
101+
},
102+
twitter: {
103+
card: "summary_large_image",
104+
title: `${SITE_NAME} — Cloud Browser Provider Benchmarks`,
105+
description: SITE_DESCRIPTION,
106+
images: ["/og-image"],
107+
},
108+
category: "Technology",
109+
};
110+
111+
const jsonLd = {
112+
"@context": "https://schema.org",
113+
"@graph": [
114+
{
115+
"@type": "WebSite",
116+
"@id": `${SITE_URL}/#website`,
117+
url: SITE_URL,
118+
name: SITE_NAME,
119+
description: SITE_DESCRIPTION,
120+
publisher: { "@id": `${SITE_URL}/#organization` },
121+
inLanguage: "en-US",
122+
},
123+
{
124+
"@type": "Organization",
125+
"@id": `${SITE_URL}/#organization`,
126+
name: "Notte Labs",
127+
url: "https://notte.cc",
128+
sameAs: [
129+
"https://github.com/nottelabs/browserarena",
130+
"https://github.com/nottelabs",
131+
],
132+
},
133+
{
134+
"@type": "WebApplication",
135+
"@id": `${SITE_URL}/#app`,
136+
name: SITE_NAME,
137+
url: SITE_URL,
138+
description: SITE_DESCRIPTION,
139+
applicationCategory: "DeveloperApplication",
140+
operatingSystem: "All",
141+
offers: { "@type": "Offer", price: "0", priceCurrency: "USD" },
142+
creator: { "@id": `${SITE_URL}/#organization` },
143+
isPartOf: { "@id": `${SITE_URL}/#website` },
144+
featureList: [
145+
"Real-time latency benchmarks for cloud browser providers",
146+
"Session creation, CDP connection, navigation, and release time comparison",
147+
"P50, P90, and P95 percentile analysis",
148+
"Concurrent session load testing",
149+
"Reliability and success rate tracking",
150+
"Cost-per-hour pricing comparison",
151+
"Open-source and reproducible on Railway",
152+
],
153+
},
154+
{
155+
"@type": "FAQPage",
156+
mainEntity: [
157+
{
158+
"@type": "Question",
159+
name: "What is The Browser Arena?",
160+
acceptedAnswer: {
161+
"@type": "Answer",
162+
text: "The Browser Arena is an open-source benchmarking platform built by Notte (notte.cc) that compares cloud browser infrastructure providers on speed, reliability, and cost. It measures real session creation, CDP connection, page navigation, and session release times across leading providers including Notte, Browserbase, Steel, Hyperbrowser, Kernel, Anchor Browser, and Browser Use.",
163+
},
164+
},
165+
{
166+
"@type": "Question",
167+
name: "What is the best cloud browser for AI agents?",
168+
acceptedAnswer: {
169+
"@type": "Answer",
170+
text: "The best cloud browser for AI agents depends on your requirements. The Browser Arena benchmarks show how each provider performs on latency, reliability, and cost. AI browser agents need fast session creation and stable CDP connections — check the leaderboard at browserarena.ai to see real performance data. Notte, the creator of this benchmark, is one of the providers optimized for AI agent workloads.",
171+
},
172+
},
173+
{
174+
"@type": "Question",
175+
name: "Which cloud browser providers are benchmarked?",
176+
acceptedAnswer: {
177+
"@type": "Answer",
178+
text: "The Browser Arena benchmarks seven cloud browser providers: Notte, Browserbase, Steel, Hyperbrowser, Kernel, Anchor Browser, and Browser Use. Each provider is tested for session creation latency, CDP connection time, navigation speed, and session release time under identical conditions.",
179+
},
180+
},
181+
{
182+
"@type": "Question",
183+
name: "What is the best browser infrastructure provider?",
184+
acceptedAnswer: {
185+
"@type": "Answer",
186+
text: "Browser infrastructure providers differ on latency, reliability, concurrency support, and pricing. The Browser Arena provides objective, reproducible benchmarks to help you choose. Visit browserarena.ai to compare all seven providers including Notte, Browserbase, Steel, Hyperbrowser, Kernel, Anchor Browser, and Browser Use across P50, P90, and P95 latencies.",
187+
},
188+
},
189+
{
190+
"@type": "Question",
191+
name: "How are the browser benchmarks conducted?",
192+
acceptedAnswer: {
193+
"@type": "Answer",
194+
text: "Benchmarks run on standardized AWS EC2 instances in US regions. Each provider is tested with identical workloads measuring session creation, Chrome DevTools Protocol connection, page navigation, and session release. Results include median, P90, and P95 latencies, along with success rates and pricing data. The entire methodology is open-source.",
195+
},
196+
},
197+
{
198+
"@type": "Question",
199+
name: "Can I reproduce the benchmarks myself?",
200+
acceptedAnswer: {
201+
"@type": "Answer",
202+
text: "Yes. The Browser Arena is fully open-source and can be deployed on Railway with one click. Add your own provider API keys and run the benchmarks in your own environment to verify results independently. Source code is at github.com/nottelabs/browserarena.",
203+
},
204+
},
205+
{
206+
"@type": "Question",
207+
name: "What is a cloud browser provider?",
208+
acceptedAnswer: {
209+
"@type": "Answer",
210+
text: "A cloud browser provider (also called browser infrastructure or browser-as-a-service) offers managed, headless browser instances accessible via APIs like the Chrome DevTools Protocol. They are used for AI browser agents, web automation, web scraping, and testing. Providers like Notte, Browserbase, and Steel manage browser infrastructure so developers don't have to run and scale their own browser instances.",
211+
},
212+
},
213+
{
214+
"@type": "Question",
215+
name: "How to compare browser providers for web automation?",
216+
acceptedAnswer: {
217+
"@type": "Answer",
218+
text: "Key factors when comparing browser providers for web automation include: session creation latency, CDP connection speed, page navigation time, concurrent session support, reliability (success rate), and cost per hour. The Browser Arena at browserarena.ai is the first open-source benchmark to test all of these dimensions side-by-side with reproducible methodology.",
219+
},
220+
},
221+
],
222+
},
223+
],
27224
};
28225

29226
export default function RootLayout({
@@ -33,6 +230,19 @@ export default function RootLayout({
33230
}) {
34231
return (
35232
<html lang="en" className={`${plusJakarta.variable} ${ibmPlexMono.variable} ${dmSans.variable}`}>
233+
<head>
234+
<script
235+
type="application/ld+json"
236+
dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
237+
/>
238+
<link rel="author" href="https://notte.cc" />
239+
<link
240+
rel="alternate"
241+
type="text/plain"
242+
title="LLM-readable site summary"
243+
href="/llms.txt"
244+
/>
245+
</head>
36246
<body className="min-h-screen font-sans antialiased">
37247
<TooltipProvider delayDuration={200}>
38248
{children}

0 commit comments

Comments
 (0)