Files
peardata-website/index.html
T
2026-07-30 20:08:50 -04:00

1002 lines
51 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="en" data-theme="dark">
<head>
<!-- Theme: FOUC-safe bootstrap (localStorage peardata.site.theme) -->
<script>
(function () {
try {
var t = localStorage.getItem('peardata.site.theme');
if (t !== 'light' && t !== 'dark') t = 'dark';
document.documentElement.setAttribute('data-theme', t);
var meta = document.querySelector('meta[name="theme-color"]');
if (meta) meta.setAttribute('content', t === 'light' ? '#f3f5f8' : '#0a0c10');
} catch (e) {
document.documentElement.setAttribute('data-theme', 'dark');
}
})();
</script>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>PearData · P2P fleet monitoring without open ports</title>
<meta name="description" content="PearData is peer-to-peer real-time host monitoring on HyperDHT. Live charts, fleet, alerts, logs, dashboards, and on-device QVAC AI. No open ports. No central control plane." />
<meta name="keywords" content="PearData, monitoring, observability, HyperDHT, P2P, fleet metrics, QVAC, HoneyPeer" />
<meta name="author" content="HoneyPeer, LLC" />
<meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1" />
<meta name="googlebot" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1" />
<meta name="theme-color" content="#2dd4bf" />
<meta name="color-scheme" content="dark light" />
<meta name="application-name" content="PearData" />
<meta name="apple-mobile-web-app-title" content="PearData" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="msapplication-TileColor" content="#2dd4bf" />
<meta name="msapplication-config" content="/assets/favicons/browserconfig.xml" />
<meta name="format-detection" content="telephone=no" />
<link rel="canonical" href="https://peardata.rest/" />
<link rel="alternate" hreflang="en" href="https://peardata.rest/" />
<link rel="alternate" hreflang="x-default" href="https://peardata.rest/" />
<!-- Open Graph -->
<meta property="og:type" content="website" />
<meta property="og:site_name" content="PearData" />
<meta property="og:locale" content="en_US" />
<meta property="og:url" content="https://peardata.rest/" />
<meta property="og:title" content="PearData · P2P fleet monitoring without open ports" />
<meta property="og:description" content="PearData is peer-to-peer real-time host monitoring on HyperDHT. Live charts, fleet, alerts, logs, dashboards, and on-device QVAC AI. No open ports. No central control plane." />
<meta property="og:image" content="https://peardata.rest/assets/brand/og-image.png" />
<meta property="og:image:secure_url" content="https://peardata.rest/assets/brand/og-image.png" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:alt" content="PearData: decentralized P2P monitoring on HyperDHT" />
<!-- Twitter / X -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="PearData · P2P fleet monitoring without open ports" />
<meta name="twitter:description" content="PearData is peer-to-peer real-time host monitoring on HyperDHT. Live charts, fleet, alerts, logs, dashboards, and on-device QVAC AI. No open ports. No central control plane." />
<meta name="twitter:image" content="https://peardata.rest/assets/brand/twitter-card.png" />
<meta name="twitter:image:alt" content="PearData: decentralized P2P monitoring" />
<!-- Icons & PWA -->
<link rel="icon" href="/assets/favicons/favicon.ico" sizes="any" />
<link rel="icon" type="image/png" sizes="32x32" href="/assets/favicons/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/assets/favicons/favicon-16x16.png" />
<link rel="icon" type="image/png" sizes="48x48" href="/assets/favicons/favicon-48x48.png" />
<link rel="apple-touch-icon" sizes="180x180" href="/assets/favicons/apple-touch-icon.png" />
<link rel="manifest" href="/assets/favicons/site.webmanifest" />
<link rel="mask-icon" href="/assets/logo/peardata-wordmark.svg" color="#2dd4bf" />
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@graph": [
{
"@type": "Organization",
"@id": "https://peardata.rest/#organization",
"name": "HoneyPeer, LLC",
"url": "https://peardata.rest",
"email": "[email protected]",
"address": {
"@type": "PostalAddress",
"addressRegion": "GA",
"addressLocality": "DeKalb County",
"addressCountry": "US"
},
"logo": {
"@type": "ImageObject",
"url": "https://peardata.rest/assets/logo/peardata-icon-512.png"
},
"sameAs": [
"https://git.ssh.surf/snxraven/peardata",
"https://join.discord-linux.com"
]
},
{
"@type": "WebSite",
"@id": "https://peardata.rest/#website",
"url": "https://peardata.rest",
"name": "PearData",
"description": "PearData is peer-to-peer host monitoring on HyperDHT. Never open ports, expose metrics agents, or wrestle with remote access again. Noise-encrypted RPC, desktop client, and on-device QVAC AI.",
"publisher": {
"@id": "https://peardata.rest/#organization"
},
"inLanguage": "en-US"
},
{
"@type": "SoftwareApplication",
"@id": "https://peardata.rest/#software",
"name": "PearData",
"applicationCategory": "DeveloperApplication",
"operatingSystem": "Linux, macOS, Windows",
"description": "PearData is peer-to-peer host monitoring on HyperDHT. Never open ports, expose metrics agents, or wrestle with remote access again. Noise-encrypted RPC, desktop client, and on-device QVAC AI.",
"url": "https://peardata.rest",
"downloadUrl": "https://peardata.rest/download",
"softwareVersion": "2.0",
"license": "https://www.gnu.org/licenses/agpl-3.0.html",
"offers": {
"@type": "Offer",
"price": "0",
"priceCurrency": "USD"
},
"author": {
"@id": "https://peardata.rest/#organization"
},
"image": "https://peardata.rest/assets/brand/og-image.png"
},
{
"@type": "WebPage",
"@id": "https://peardata.rest/#webpage",
"url": "https://peardata.rest/",
"name": "PearData \u00b7 Decentralized P2P monitoring",
"description": "PearData is peer-to-peer host monitoring on HyperDHT. Never open ports, expose metrics agents, or wrestle with remote access again. Noise-encrypted RPC, desktop client, and on-device QVAC AI.",
"isPartOf": {
"@id": "https://peardata.rest/#website"
},
"about": {
"@id": "https://peardata.rest/#software"
},
"primaryImageOfPage": {
"@type": "ImageObject",
"url": "https://peardata.rest/assets/brand/og-image.png",
"width": 1200,
"height": 630
},
"inLanguage": "en-US"
}
]
}
</script>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500&family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="/src/styles/global.css" />
<link rel="stylesheet" href="/src/styles/home.css" />
<link rel="stylesheet" href="/src/styles/app-chrome.css" />
<link rel="stylesheet" href="/src/styles/theme-light.css" />
</head>
<body>
<div class="bg-mesh" aria-hidden="true"></div>
<div class="bg-grid" aria-hidden="true"></div>
<div data-nav data-prefix=""></div>
<main>
<!-- HERO -->
<section class="hero">
<div class="container-wide hero-inner">
<div class="reveal">
<div class="hero-badge">
<span class="dot"></span>
Live charts · QVAC · AGPL-3.0
</div>
<h1>
Fleet monitoring that<br />
<span class="gradient-text">never needs a port</span>
</h1>
<p class="lead">
PearData is peer-to-peer <strong>real-time host monitoring</strong> on HyperDHT.
Dial an agent by public key, then stream live metrics, alerts, logs, and processes over Noise-encrypted RPC.<br /><br />
<strong>No open ports. No VPN. No SaaS middleman.</strong>
</p>
<div class="hero-actions">
<a class="btn btn-primary btn-lg" href="/download">Install &amp; download</a>
<a class="btn btn-secondary btn-lg" href="#product-tour">See live demos</a>
<a class="btn btn-ghost btn-lg" href="/docs/quickstart">Quick start</a>
</div>
<div class="hero-meta">
<div class="hero-meta-item">
<strong>Multi-peer fleet</strong>
<span>Many agents, one client</span>
</div>
<div class="hero-meta-item">
<strong>Live charts</strong>
<span>1s metrics wall</span>
</div>
<div class="hero-meta-item">
<strong>QVAC AI</strong>
<span>On-device SRE copilot</span>
</div>
<div class="hero-meta-item">
<strong>6 platforms</strong>
<span>Agent + desktop</span>
</div>
</div>
<div class="pitch-points">
<div class="pitch-point">
<strong>Identity is a keypair</strong>
<span>Share a 64-hex public key. Nothing listens on a public metrics port.</span>
</div>
<div class="pitch-point">
<strong>Ops that feel local</strong>
<span>Overview, Charts, Dashboard, Alerts, Logs, Processes, and QVAC in one desktop UI.</span>
</div>
<div class="pitch-point">
<strong>Progress you can trust</strong>
<span>P2P desktop for operators plus agent-style REST for scripts and Grafana.</span>
</div>
</div>
</div>
<div class="hero-visual reveal" data-hero-mock>
<div class="hero-glow" aria-hidden="true"></div>
<div class="pd-shell" aria-hidden="true">
<div class="pd-shell-titlebar">
<div class="pd-shell-titlebar-left">
<div class="pd-shell-traffic"><i></i><i></i><i></i></div>
<div class="pd-shell-brand">
<div class="pd-shell-brand-mark"><img src="/assets/logo/peardata-icon-64.png" alt="" width="20" height="20" /></div>
<div class="pd-shell-brand-text">PearData <span>P2P observability</span></div>
</div>
</div>
<div class="pd-shell-titlebar-right">
<span class="pd-chip">laptop</span>
<span class="pd-badge">admin</span>
<span class="pd-chip live">live</span>
</div>
</div>
<aside class="pd-shell-side">
<div class="pd-nav-group">Monitor</div>
<div class="pd-nav-link is-active" data-nav="overview"><span class="ico"></span><span class="nav-label">Overview</span></div>
<div class="pd-nav-link" data-nav="charts"><span class="ico"></span><span class="nav-label">Charts</span></div>
<div class="pd-nav-link" data-nav="dashboard"><span class="ico"></span><span class="nav-label">Dashboard</span></div>
<div class="pd-nav-link" data-nav="processes"><span class="ico"></span><span class="nav-label">Processes</span></div>
<div class="pd-nav-link" data-nav="alerts"><span class="ico"></span><span class="nav-label">Alerts</span></div>
<div class="pd-nav-link" data-nav="qvac"><span class="ico"></span><span class="nav-label">QVAC</span></div>
<div class="pd-nav-link" data-nav="logs"><span class="ico"></span><span class="nav-label">Logs</span></div>
<div class="pd-nav-group">Fleet</div>
<div class="pd-nav-link" data-nav="fleet"><span class="ico"></span><span class="nav-label">Fleet</span></div>
<div class="pd-nav-link" data-nav="connect"><span class="ico"></span><span class="nav-label">Connect</span></div>
<div class="pd-nav-group">App</div>
<div class="pd-nav-link" data-nav="settings"><span class="ico"></span><span class="nav-label">Settings</span></div>
<div class="pd-shell-side-foot">Overview</div>
</aside>
<div class="pd-shell-main">
<header class="pd-page-header">
<div>
<p class="pd-kicker">Live</p>
<h2 class="pd-title">Overview</h2>
<p class="pd-sub">Active agent at a glance</p>
</div>
</header>
<div class="pd-kpis">
<div class="pd-kpi"><span class="pd-kpi-label">CPU</span><span class="pd-kpi-value" data-live-cpu>18%</span></div>
<div class="pd-kpi"><span class="pd-kpi-label">RAM</span><span class="pd-kpi-value" data-live-mem>42%</span></div>
<div class="pd-kpi"><span class="pd-kpi-label">Load</span><span class="pd-kpi-value">0.75</span></div>
<div class="pd-kpi"><span class="pd-kpi-label">Health</span><span class="pd-kpi-value is-ok">ok</span></div>
</div>
<div class="pd-panels">
<div class="pd-card">
<h4>Host load</h4>
<div class="pd-meter-row"><span>CPU</span><strong data-live-cpu>18%</strong></div>
<div class="pd-meter"><i data-live-cpu-bar style="width:18%"></i></div>
<div class="pd-meter-row"><span>Memory</span><strong data-live-mem>42%</strong></div>
<div class="pd-meter"><i data-live-mem-bar style="width:42%"></i></div>
</div>
<div class="pd-card">
<h4>Agent</h4>
<div class="pd-metric"><span>Peer</span><strong>laptop</strong></div>
<div class="pd-metric"><span>Sample</span><strong>1s push</strong></div>
<div class="pd-metric"><span>REST</span><strong>127.0.0.1:18888</strong></div>
</div>
</div>
</div>
</div>
<ul class="hero-status-bar" aria-label="Product highlights">
<li class="hero-status-item"><span class="chip-dot" aria-hidden="true"></span> Agent live</li>
<li class="hero-status-item"><span class="status-ico" aria-hidden="true">🔐</span> Noise · E2E</li>
<li class="hero-status-item"><span class="status-ico" aria-hidden="true"></span> 1s metrics</li>
</ul>
</div>
</div>
</section>
<!-- TECH STRIP -->
<div class="tech-strip">
<div class="container tech-strip-inner">
<div class="tech-item"><span></span> HyperDHT</div>
<div class="tech-item"><span></span> protomux-rpc</div>
<div class="tech-item"><span></span> compact-encoding</div>
<div class="tech-item"><span></span> HyperDB</div>
<div class="tech-item"><span></span> QVAC</div>
<div class="tech-item"><span></span> Pear / Electron</div>
<div class="tech-item"><span></span> Bare runtime</div>
</div>
</div>
<!-- PRODUCT DEMOS: PearData desktop shell -->
<section class="product-demo-section" id="product-tour" data-product-demo data-active-demo="overview">
<div class="container-wide">
<div class="product-demo-head reveal">
<div class="section-label" style="justify-content: center;">Product tour</div>
<h2>The real desktop shell</h2>
<p class="lead" style="margin: 0.75rem auto 0; max-width: 36rem; text-align: center;">
Titlebar chips, Monitor / Fleet nav, and live views — same layout as the PearData app.
</p>
</div>
<div class="demo-tabs reveal" role="tablist" aria-label="Product demos">
<button type="button" class="demo-tab is-active" role="tab" aria-selected="true" data-demo-tab="overview">Overview</button>
<button type="button" class="demo-tab" role="tab" aria-selected="false" data-demo-tab="charts">Charts</button>
<button type="button" class="demo-tab" role="tab" aria-selected="false" data-demo-tab="alerts">Alerts</button>
<button type="button" class="demo-tab" role="tab" aria-selected="false" data-demo-tab="qvac">QVAC</button>
</div>
<div class="demo-stage reveal demo-panel is-active" data-demo-panel="overview" role="tabpanel">
<div class="demo-stage-visual">
<div class="pd-shell" aria-hidden="true">
<div class="pd-shell-titlebar">
<div class="pd-shell-titlebar-left">
<div class="pd-shell-traffic"><i></i><i></i><i></i></div>
<div class="pd-shell-brand">
<div class="pd-shell-brand-mark"><img src="/assets/logo/peardata-icon-64.png" alt="" width="20" height="20" /></div>
<div class="pd-shell-brand-text">PearData <span>P2P observability</span></div>
</div>
</div>
<div class="pd-shell-titlebar-right">
<span class="pd-chip">laptop</span>
<span class="pd-badge">admin</span>
<span class="pd-chip live">live</span>
</div>
</div>
<aside class="pd-shell-side">
<div class="pd-nav-group">Monitor</div>
<div class="pd-nav-link is-active" data-nav="overview"><span class="ico"></span><span class="nav-label">Overview</span></div>
<div class="pd-nav-link" data-nav="charts"><span class="ico"></span><span class="nav-label">Charts</span></div>
<div class="pd-nav-link" data-nav="dashboard"><span class="ico"></span><span class="nav-label">Dashboard</span></div>
<div class="pd-nav-link" data-nav="processes"><span class="ico"></span><span class="nav-label">Processes</span></div>
<div class="pd-nav-link" data-nav="alerts"><span class="ico"></span><span class="nav-label">Alerts</span></div>
<div class="pd-nav-link" data-nav="qvac"><span class="ico"></span><span class="nav-label">QVAC</span></div>
<div class="pd-nav-link" data-nav="logs"><span class="ico"></span><span class="nav-label">Logs</span></div>
<div class="pd-nav-group">Fleet</div>
<div class="pd-nav-link" data-nav="fleet"><span class="ico"></span><span class="nav-label">Fleet</span></div>
<div class="pd-nav-link" data-nav="connect"><span class="ico"></span><span class="nav-label">Connect</span></div>
<div class="pd-nav-group">App</div>
<div class="pd-nav-link" data-nav="settings"><span class="ico"></span><span class="nav-label">Settings</span></div>
<div class="pd-shell-side-foot">Overview · live</div>
</aside>
<div class="pd-shell-main">
<header class="pd-page-header">
<div>
<p class="pd-kicker">Live</p>
<h2 class="pd-title">Overview</h2>
<p class="pd-sub">Active agent at a glance</p>
</div>
<button type="button" class="pd-ghost-btn" tabindex="-1">Refresh</button>
</header>
<div class="pd-kpis">
<div class="pd-kpi"><span class="pd-kpi-label">CPU</span><span class="pd-kpi-value" data-kpi="cpu">18%</span></div>
<div class="pd-kpi"><span class="pd-kpi-label">RAM</span><span class="pd-kpi-value" data-kpi="ram">42%</span></div>
<div class="pd-kpi"><span class="pd-kpi-label">Load</span><span class="pd-kpi-value" data-kpi="load">0.75</span></div>
<div class="pd-kpi"><span class="pd-kpi-label">Health</span><span class="pd-kpi-value is-ok" data-kpi="health">ok</span></div>
</div>
<div class="pd-panels">
<div class="pd-card">
<h4>Host load</h4>
<div class="pd-meter-row"><span>CPU</span><strong data-kpi="cpu">18%</strong></div>
<div class="pd-meter"><i data-bar="cpu" style="width:18%"></i></div>
<div class="pd-meter-row"><span>Memory</span><strong data-kpi="ram">42%</strong></div>
<div class="pd-meter"><i data-bar="ram" style="width:42%"></i></div>
</div>
<div class="pd-card">
<h4>Agent</h4>
<div class="pd-metric"><span>Hostname</span><strong>laptop</strong></div>
<div class="pd-metric"><span>Cores</span><strong>8</strong></div>
<div class="pd-metric"><span>REST</span><strong>:18888</strong></div>
<div class="pd-metric"><span>Role</span><strong>admin</strong></div>
</div>
</div>
</div>
</div>
</div>
<div class="demo-stage-copy">
<h3>Overview KPIs</h3>
<p>CPU, RAM, load, and health update from 1s metric pushes after you dial an agent.</p>
<ul>
<li>Active peer + role in the titlebar</li>
<li>History seed on connect</li>
<li>Fleet strip for multi-agent setups</li>
</ul>
</div>
</div>
<div class="demo-stage reveal demo-panel" data-demo-panel="charts" role="tabpanel" hidden>
<div class="demo-stage-visual">
<div class="pd-shell" aria-hidden="true">
<div class="pd-shell-titlebar">
<div class="pd-shell-titlebar-left">
<div class="pd-shell-traffic"><i></i><i></i><i></i></div>
<div class="pd-shell-brand">
<div class="pd-shell-brand-mark"><img src="/assets/logo/peardata-icon-64.png" alt="" width="20" height="20" /></div>
<div class="pd-shell-brand-text">PearData <span>P2P observability</span></div>
</div>
</div>
<div class="pd-shell-titlebar-right">
<span class="pd-chip">laptop</span>
<span class="pd-badge">admin</span>
<span class="pd-chip live">live</span>
</div>
</div>
<aside class="pd-shell-side">
<div class="pd-nav-group">Monitor</div>
<div class="pd-nav-link" data-nav="overview"><span class="ico"></span><span class="nav-label">Overview</span></div>
<div class="pd-nav-link is-active" data-nav="charts"><span class="ico"></span><span class="nav-label">Charts</span></div>
<div class="pd-nav-link" data-nav="dashboard"><span class="ico"></span><span class="nav-label">Dashboard</span></div>
<div class="pd-nav-link" data-nav="processes"><span class="ico"></span><span class="nav-label">Processes</span></div>
<div class="pd-nav-link" data-nav="alerts"><span class="ico"></span><span class="nav-label">Alerts</span></div>
<div class="pd-nav-link" data-nav="qvac"><span class="ico"></span><span class="nav-label">QVAC</span></div>
<div class="pd-nav-link" data-nav="logs"><span class="ico"></span><span class="nav-label">Logs</span></div>
<div class="pd-nav-group">Fleet</div>
<div class="pd-nav-link" data-nav="fleet"><span class="ico"></span><span class="nav-label">Fleet</span></div>
<div class="pd-nav-link" data-nav="connect"><span class="ico"></span><span class="nav-label">Connect</span></div>
<div class="pd-nav-group">App</div>
<div class="pd-nav-link" data-nav="settings"><span class="ico"></span><span class="nav-label">Settings</span></div>
<div class="pd-shell-side-foot">Charts · 5m window</div>
</aside>
<div class="pd-shell-main">
<header class="pd-page-header">
<div>
<p class="pd-kicker">Explore</p>
<h2 class="pd-title">Charts</h2>
<p class="pd-sub">Metrics wall · shared time window</p>
</div>
</header>
<div class="pd-timebar">
<span class="pd-tf">1m</span>
<span class="pd-tf is-active">5m</span>
<span class="pd-tf">15m</span>
<span class="pd-tf">1h</span>
<span class="pd-tf is-active">▶ live</span>
</div>
<div class="pd-chart-grid">
<div class="pd-chart-card">
<header><strong>system.cpu</strong><span>user %</span></header>
<svg viewBox="0 0 100 40" preserveAspectRatio="none"><polyline data-spark fill="none" stroke="#34d399" stroke-width="1.8" stroke-linejoin="round" points="0,28 10,22 20,26 30,14 40,18 50,12 60,16 70,10 80,18 90,8 100,14"/></svg>
</div>
<div class="pd-chart-card">
<header><strong>system.ram</strong><span>MiB</span></header>
<svg viewBox="0 0 100 40" preserveAspectRatio="none"><polyline data-spark fill="none" stroke="#2dd4bf" stroke-width="1.8" stroke-linejoin="round" points="0,20 10,22 20,18 30,24 40,20 50,26 60,22 70,28 80,24 90,22 100,20"/></svg>
</div>
<div class="pd-chart-card">
<header><strong>system.net</strong><span>kb/s</span></header>
<svg viewBox="0 0 100 40" preserveAspectRatio="none"><polyline data-spark fill="none" stroke="#38bdf8" stroke-width="1.8" stroke-linejoin="round" points="0,30 10,24 20,28 30,16 40,20 50,14 60,18 70,10 80,16 90,12 100,18"/></svg>
</div>
<div class="pd-chart-card">
<header><strong>system.load</strong><span>load1</span></header>
<svg viewBox="0 0 100 40" preserveAspectRatio="none"><polyline data-spark fill="none" stroke="#fbbf24" stroke-width="1.8" stroke-linejoin="round" points="0,26 10,24 20,22 30,20 40,22 50,18 60,20 70,16 80,18 90,14 100,16"/></svg>
</div>
</div>
</div>
</div>
</div>
<div class="demo-stage-copy">
<h3>Metrics wall</h3>
<p>Every chart the agent emits, shared time presets, pins, and correlations.</p>
<ul>
<li>Presets 1m6h · play/pause</li>
<li>QVAC can pin / focus charts</li>
<li>Custom Dashboard boards under Charts</li>
</ul>
</div>
</div>
<div class="demo-stage reveal demo-panel" data-demo-panel="alerts" role="tabpanel" hidden>
<div class="demo-stage-visual">
<div class="pd-shell" aria-hidden="true">
<div class="pd-shell-titlebar">
<div class="pd-shell-titlebar-left">
<div class="pd-shell-traffic"><i></i><i></i><i></i></div>
<div class="pd-shell-brand">
<div class="pd-shell-brand-mark"><img src="/assets/logo/peardata-icon-64.png" alt="" width="20" height="20" /></div>
<div class="pd-shell-brand-text">PearData <span>P2P observability</span></div>
</div>
</div>
<div class="pd-shell-titlebar-right">
<span class="pd-chip">laptop</span>
<span class="pd-badge">admin</span>
<span class="pd-chip live">live</span>
</div>
</div>
<aside class="pd-shell-side">
<div class="pd-nav-group">Monitor</div>
<div class="pd-nav-link" data-nav="overview"><span class="ico"></span><span class="nav-label">Overview</span></div>
<div class="pd-nav-link" data-nav="charts"><span class="ico"></span><span class="nav-label">Charts</span></div>
<div class="pd-nav-link" data-nav="dashboard"><span class="ico"></span><span class="nav-label">Dashboard</span></div>
<div class="pd-nav-link" data-nav="processes"><span class="ico"></span><span class="nav-label">Processes</span></div>
<div class="pd-nav-link is-active" data-nav="alerts"><span class="ico"></span><span class="nav-label">Alerts</span></div>
<div class="pd-nav-link" data-nav="qvac"><span class="ico"></span><span class="nav-label">QVAC</span></div>
<div class="pd-nav-link" data-nav="logs"><span class="ico"></span><span class="nav-label">Logs</span></div>
<div class="pd-nav-group">Fleet</div>
<div class="pd-nav-link" data-nav="fleet"><span class="ico"></span><span class="nav-label">Fleet</span></div>
<div class="pd-nav-link" data-nav="connect"><span class="ico"></span><span class="nav-label">Connect</span></div>
<div class="pd-nav-group">App</div>
<div class="pd-nav-link" data-nav="settings"><span class="ico"></span><span class="nav-label">Settings</span></div>
<div class="pd-shell-side-foot">Alerts · signals</div>
</aside>
<div class="pd-shell-main">
<header class="pd-page-header">
<div>
<p class="pd-kicker">Signals</p>
<h2 class="pd-title">Alerts</h2>
<p class="pd-sub">Open thresholds and recent events</p>
</div>
<button type="button" class="pd-ghost-btn" tabindex="-1">Refresh</button>
</header>
<p class="pd-section-title">Open alerts</p>
<ul class="pd-alert-list">
<li data-alert-row><span class="pd-sev warn">warning</span> CPU user high <span class="muted">system.cpu</span> <span class="pd-linkish">Show</span></li>
<li data-alert-row><span class="pd-sev crit">critical</span> mem avail low <span class="muted">mem.available</span> <span class="pd-linkish">Correlate</span></li>
</ul>
<p class="pd-section-title">Recent events</p>
<ul class="pd-alert-list">
<li data-alert-row><span class="pd-sev ok">cleared</span> load1_high <span class="muted">system.load</span></li>
<li data-alert-row><span class="pd-sev warn">warning</span> cpu_iowait_high <span class="muted">system.cpu</span></li>
</ul>
</div>
</div>
</div>
<div class="demo-stage-copy">
<h3>Open + recent</h3>
<p>Open thresholds from <code>listAlerts</code> and event history from <code>listAnomalies</code>.</p>
<ul>
<li>Refresh on peer activate</li>
<li>Show / Correlate → Charts</li>
<li>Operator silence/ack with confirm modal</li>
</ul>
</div>
</div>
<div class="demo-stage reveal demo-panel" data-demo-panel="qvac" role="tabpanel" hidden>
<div class="demo-stage-visual">
<div class="pd-shell" aria-hidden="true">
<div class="pd-shell-titlebar">
<div class="pd-shell-titlebar-left">
<div class="pd-shell-traffic"><i></i><i></i><i></i></div>
<div class="pd-shell-brand">
<div class="pd-shell-brand-mark"><img src="/assets/logo/peardata-icon-64.png" alt="" width="20" height="20" /></div>
<div class="pd-shell-brand-text">PearData <span>P2P observability</span></div>
</div>
</div>
<div class="pd-shell-titlebar-right">
<span class="pd-chip">laptop</span>
<span class="pd-badge">admin</span>
<span class="pd-chip live">live</span>
</div>
</div>
<aside class="pd-shell-side">
<div class="pd-nav-group">Monitor</div>
<div class="pd-nav-link" data-nav="overview"><span class="ico"></span><span class="nav-label">Overview</span></div>
<div class="pd-nav-link" data-nav="charts"><span class="ico"></span><span class="nav-label">Charts</span></div>
<div class="pd-nav-link" data-nav="dashboard"><span class="ico"></span><span class="nav-label">Dashboard</span></div>
<div class="pd-nav-link" data-nav="processes"><span class="ico"></span><span class="nav-label">Processes</span></div>
<div class="pd-nav-link" data-nav="alerts"><span class="ico"></span><span class="nav-label">Alerts</span></div>
<div class="pd-nav-link is-active" data-nav="qvac"><span class="ico"></span><span class="nav-label">QVAC</span></div>
<div class="pd-nav-link" data-nav="logs"><span class="ico"></span><span class="nav-label">Logs</span></div>
<div class="pd-nav-group">Fleet</div>
<div class="pd-nav-link" data-nav="fleet"><span class="ico"></span><span class="nav-label">Fleet</span></div>
<div class="pd-nav-link" data-nav="connect"><span class="ico"></span><span class="nav-label">Connect</span></div>
<div class="pd-nav-group">App</div>
<div class="pd-nav-link" data-nav="settings"><span class="ico"></span><span class="nav-label">Settings</span></div>
<div class="pd-shell-side-foot">QVAC · local AI</div>
</aside>
<div class="pd-shell-main">
<header class="pd-page-header">
<div>
<p class="pd-kicker">Local AI</p>
<h2 class="pd-title">QVAC</h2>
<p class="pd-sub">On-device SRE copilot · tools → agent RPC</p>
</div>
<span class="pd-chip live" data-qvac-status>Ready</span>
</header>
<div class="pd-qvac">
<div class="pd-qvac-swarm">
<div class="pd-qvac-swarm-head">
<strong>Multi-agent swarm</strong>
<span>in this turn</span>
</div>
<div class="pd-qvac-agents">
<div class="pd-qvac-agent is-run" data-qvac-agent>
<header>Host investigator <span class="st">run</span></header>
<p>KPIs · findings · health</p>
</div>
<div class="pd-qvac-agent" data-qvac-agent>
<header>Alerts specialist <span class="st">queued</span></header>
<p>anomalies · thresholds</p>
</div>
</div>
</div>
<div class="pd-qvac-msg">
<div class="who">Assistant</div>
Health <strong>ok</strong>. CPU 18%, RAM 42%. No critical open alerts.
Top process: <code style="font-family:var(--pd-mono);font-size:12px">node</code>.
<div class="pd-qvac-chips">
<span class="pd-tool-chip">agent:host</span>
<span class="pd-tool-chip">investigate_host</span>
<span class="pd-tool-chip">list_alerts</span>
</div>
</div>
<div class="pd-qvac-composer">
<input value="Ask about host health, metrics, anomalies…" readonly tabindex="-1" />
<button type="button" class="pd-send" tabindex="-1">Send</button>
</div>
</div>
</div>
</div>
</div>
<div class="demo-stage-copy">
<h3>On-device copilot</h3>
<p>Multi-agent swarm lives inside the chat turn, then collapses. Stop unlocks the composer immediately.</p>
<ul>
<li>Tools call live agent RPCs</li>
<li>Auto-navigate off / ask / on</li>
<li>Tools-only without a model</li>
</ul>
</div>
</div>
</div>
</section>
<!-- FEATURES -->
<section class="section" id="features">
<div class="container">
<div class="reveal">
<div class="section-label">Features</div>
<h2>Full fleet visibility.<br />Zero ports to open.</h2>
<p class="lead mt-4">
Live charts, custom dashboards, alerts, logs, processes, and on-device QVAC —
over Noise-encrypted HyperDHT. Optional agent REST for scripts and Grafana.
No SaaS tenancy. No public metrics API.
</p>
</div>
<div class="features-grid">
<article class="card reveal">
<div class="card-icon"></div>
<h3>No ports. No VPN.</h3>
<p>Agent identity is a HyperDHT keypair. Share the public key. Clients holepunch. Nothing listens for metrics on a public port.</p>
</article>
<article class="card reveal">
<div class="card-icon">🔐</div>
<h3>Noise encryption</h3>
<p>Every control connection is end-to-end encrypted. Roles: viewer, operator, admin. pd1 invites and audit logging for multi-operator fleets.</p>
</article>
<article class="card reveal">
<div class="card-icon">📈</div>
<h3>Live observability</h3>
<p>1s metric push, full charts wall, custom Dashboard boards, alerts, journal/anomaly logs, and process table when enabled.</p>
</article>
<article class="card reveal">
<div class="card-icon"></div>
<h3>QVAC local AI</h3>
<p>On-device SRE copilot with tool calling, multi-agent investigations, stop mid-run, and tools-only fallback without a model.</p>
</article>
<article class="card reveal">
<div class="card-icon">🖥️</div>
<h3>Desktop client</h3>
<p>Electron or Pear. Multi-agent fleet, auto-restore peers, in-app confirms, Data Manager for retention and prune.</p>
</article>
<article class="card reveal">
<div class="card-icon">📦</div>
<h3>Standalone binaries</h3>
<p>Bare Linux agent + Electron clients for linux, darwin, and win32 (x64/arm64). Rolling releases from CI.</p>
</article>
</div>
<div class="stats-row reveal">
<div class="stat"><strong>6</strong><span>64-bit client targets</span></div>
<div class="stat"><strong>1s</strong><span>Metric push cadence</span></div>
<div class="stat"><strong>3</strong><span>ACL roles</span></div>
<div class="stat"><strong>0</strong><span>Ports to open</span></div>
</div>
</div>
</section>
<!-- ARCHITECTURE + HOW IT WORKS -->
<section class="section arch-section" id="architecture">
<div class="container">
<div class="reveal text-center" style="max-width: 640px; margin: 0 auto;">
<div class="section-label" style="justify-content: center;">How it works</div>
<h2>Keys, peers, metrics.<br />Still zero open ports.</h2>
<p class="lead" style="margin: 1rem auto 0;">
Agents collect and answer RPC. Desktops dial by public key over HyperDHT.
Optional localhost REST for scripts. No inbound firewall for remote ops.
</p>
</div>
<div class="how-flow reveal" data-how-flow>
<article class="how-step is-active" data-how-step>
<div class="how-step-num">1</div>
<h3>Run the agent</h3>
<p>Install via one-liner or binary on Linux. Identity is a HyperDHT keypair: <code>SERVER_PUBLIC_KEY</code> and seed in <code>/opt/peardata/.env</code>.</p>
</article>
<article class="how-step" data-how-step>
<div class="how-step-num">2</div>
<h3>Launch the client</h3>
<p>Electron desktop (or Pear). Paste a public key, key + seed, or a <code>pd1.</code> invite. Multi-agent fleet lives in the sidebar.</p>
</article>
<article class="how-step" data-how-step>
<div class="how-step-num">3</div>
<h3>Observe</h3>
<p>Charts, alerts, logs, processes, dashboards. Ask QVAC. Long retention via Data Manager on the agent.</p>
</article>
</div>
<div class="arch-diagram reveal">
<div class="arch-node">
<div class="node-icon"></div>
<h3>Desktop client</h3>
<p>Electron / Pear · fleet · charts · QVAC</p>
</div>
<div class="arch-arrow">
<svg viewBox="0 0 48 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M2 12h40M34 4l10 8-10 8"/></svg>
RPC
</div>
<div class="arch-node">
<div class="node-icon"></div>
<h3>peardata agent</h3>
<p>HyperDHT · collect · store · anomalies</p>
</div>
<div class="arch-arrow">
<svg viewBox="0 0 48 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M2 12h40M34 4l10 8-10 8"/></svg>
/proc
</div>
<div class="arch-node">
<div class="node-icon">📊</div>
<h3>Host metrics</h3>
<p>cpu · ram · net · io · optional containers</p>
</div>
</div>
<div class="arch-details reveal">
<div class="arch-detail">
<h4>Control + metrics plane</h4>
<p>Handshake, catalog, <code>queryData</code>, subscribe metrics/anomalies, alerts, operator jobs, Data Manager. Live <code>push:metrics</code> and <code>push:anomaly</code>. Protocol version negotiated on connect.</p>
</div>
<div class="arch-detail">
<h4>Local REST (optional)</h4>
<p>Agent-style <code>/api/v1|v2|v3</code> on <code>127.0.0.1:18888</code> for scripts, Prometheus, Grafana. Disable with <code>PEARDATA_REST=0</code>.</p>
</div>
</div>
<div class="text-center mt-6 reveal">
<a class="btn btn-secondary" href="/learn/">How PearData works →</a>
<a class="btn btn-ghost" href="/docs/architecture">Architecture reference →</a>
</div>
</div>
</section>
<!-- DEEP FEATURES -->
<section class="section">
<div class="container">
<div class="feature-row reveal">
<div class="feature-copy">
<div class="section-label">Fleet</div>
<h2>Multi-agent. Multi-host.<br />One client.</h2>
<p class="lead">Connect to many agents at once. Switch active peer without losing chart context. Saved peers restore on launch. Roles and invites live on the agent.</p>
<ul class="feature-list">
<li>Peer disk cache under <code>~/.config/peardata</code></li>
<li>Connection health badge: live/offline, role, active peer</li>
<li>pd1 invites, revoke, allowlist for multi-operator setups</li>
<li>Fleet tab: roster, activate, reconnect, forget with in-app confirms</li>
</ul>
</div>
<div class="feature-visual" data-lightbox="/assets/screenshots/screenshot-2.png">
<img
src="/assets/screenshots/screenshot-2.png"
alt="PearData Fleet tab — multi-agent roster and peer health"
style="border-radius:12px;width:100%;height:auto"
loading="lazy"
decoding="async"
/>
</div>
</div>
<div class="feature-row reverse reveal">
<div class="feature-copy">
<div class="section-label">Investigate</div>
<h2>Investigate like an SRE.</h2>
<p class="lead">Charts wall with correlations, custom dashboards, alerts with Show/Correlate, logs, and QVAC tools that pin charts or build boards. <a href="#product-tour">See the demo</a>.</p>
<ul class="feature-list">
<li>Metric Correlations (volume, ks2, anomaly-rate, value)</li>
<li>Custom Dashboard boards (user + agent editable)</li>
<li>Processes table and optional container metric cards</li>
<li>In-app confirms for prune, forget peers, operator alert actions</li>
</ul>
</div>
<div class="feature-visual" data-lightbox="/assets/screenshots/screenshot-0.png">
<img
src="/assets/screenshots/screenshot-0.png"
alt="PearData Charts tab — pinned live metrics wall"
style="border-radius:12px;width:100%;height:auto"
loading="lazy"
decoding="async"
/>
</div>
</div>
<div class="feature-row reveal">
<div class="feature-copy">
<div class="section-label">QVAC</div>
<h2>Ask your fleet.<br />Models stay local.</h2>
<p class="lead">
On-device SRE copilot with tool calling into the live agent.
Multi-agent swarm for broad investigations; single-agent for simple questions. Stop anytime.
</p>
<ul class="feature-list">
<li>Tools: investigate_host, charts, dashboards, alerts, logs</li>
<li>Auto-navigate: off · ask · on</li>
<li>Tools-only mode without a model download</li>
<li>Swarm UI lives in the chat transcript, not a sticky overlay</li>
</ul>
</div>
<div class="feature-visual" data-lightbox="/assets/screenshots/screenshot-3.png">
<img
src="/assets/screenshots/screenshot-3.png"
alt="PearData QVAC tab — on-device AI with tool chips"
style="border-radius:12px;width:100%;height:auto"
loading="lazy"
decoding="async"
/>
</div>
</div>
</div>
</section>
<section class="section" id="screenshots" style="background: var(--bg-secondary); border-top: 1px solid var(--border);">
<div class="container-wide">
<div class="reveal text-center">
<div class="section-label" style="justify-content: center;">Product</div>
<h2>See the desktop in action</h2>
<p class="lead" style="margin: 0.75rem auto 0; max-width: 36rem;">
Charts wall, processes, multi-host fleet, and on-device QVAC.
Gallery follows site theme (dark / light). Click any shot to enlarge.
</p>
</div>
<div class="shots-grid reveal" style="margin-top: 2rem;">
<figure
class="shot"
data-lightbox="/assets/screenshots/screenshot-0.png"
role="button"
tabindex="0"
aria-label="Enlarge Charts tab screenshot"
>
<img
src="/assets/screenshots/screenshot-0.png"
alt="PearData Charts tab — live pinned metrics wall"
width="2032"
height="1162"
loading="lazy"
decoding="async"
/>
<figcaption class="shot-caption">Charts · pinned live metrics</figcaption>
</figure>
<figure
class="shot"
data-lightbox="/assets/screenshots/screenshot-1.png"
role="button"
tabindex="0"
aria-label="Enlarge Processes tab screenshot"
>
<img
src="/assets/screenshots/screenshot-1.png"
alt="PearData Processes tab — host process table"
width="2032"
height="1162"
loading="lazy"
decoding="async"
/>
<figcaption class="shot-caption">Processes</figcaption>
</figure>
<figure
class="shot"
data-lightbox="/assets/screenshots/screenshot-2.png"
role="button"
tabindex="0"
aria-label="Enlarge Fleet tab screenshot"
>
<img
src="/assets/screenshots/screenshot-2.png"
alt="PearData Fleet tab — multi-agent roster"
width="2032"
height="1162"
loading="lazy"
decoding="async"
/>
<figcaption class="shot-caption">Fleet</figcaption>
</figure>
<figure
class="shot"
data-lightbox="/assets/screenshots/screenshot-3.png"
role="button"
tabindex="0"
aria-label="Enlarge QVAC tab screenshot"
>
<img
src="/assets/screenshots/screenshot-3.png"
alt="PearData QVAC tab — on-device AI with tool chips"
width="2032"
height="1162"
loading="lazy"
decoding="async"
/>
<figcaption class="shot-caption">QVAC · local AI</figcaption>
</figure>
</div>
</div>
</section>
<section class="section" id="quickstart">
<div class="container" style="max-width:720px">
<div class="reveal text-center">
<div class="section-label" style="justify-content: center;">Quick start</div>
<h2>Agent + desktop in minutes</h2>
</div>
<div class="install-snippet reveal" style="margin-top:1.5rem">
<pre><code>curl -fsSL https://install.peardata.rest | bash</code></pre>
</div>
<ol class="reveal" style="margin-top:1.5rem;line-height:1.7;color:var(--text-secondary)">
<li>Install the <strong>agent</strong> on Linux (<code>--server</code>) or the <strong>desktop client</strong> (<code>--client</code>).</li>
<li>Copy <code>SERVER_PUBLIC_KEY</code> from <code>/opt/peardata/.env</code>.</li>
<li>Connect from the client (key = viewer, key + seed = admin, or a <code>pd1.</code> invite).</li>
<li>Open Overview / Charts. Optional: QVAC setup for local AI.</li>
</ol>
<div class="text-center reveal" style="margin-top:1.5rem">
<a class="btn btn-primary" href="/download">Download options →</a>
<a class="btn btn-ghost" href="/docs/quickstart">Full quick start →</a>
</div>
</div>
</section>
<!-- CTA -->
<section class="cta-band">
<div class="container">
<div class="cta-card reveal">
<div class="badge mb-4">Open source · AGPL-3.0</div>
<h2>Fleet monitoring without open ports.</h2>
<p class="lead">
Live host metrics over HyperDHT — keys and peers, not public listen ports.
Grab rolling binaries for six platforms, or build from source.
</p>
<div class="cta-actions">
<a class="btn btn-primary btn-lg" href="download.html">Download PearData</a>
<a class="btn btn-secondary btn-lg" href="docs/index.html">Browse docs</a>
</div>
</div>
</div>
</section>
</main>
<div data-footer data-prefix=""></div>
<script type="module" src="/src/js/site.js"></script>
<script type="module" src="/src/js/home-demos.js"></script>
</body>
</html>