@assetsart/nylon-mesh 1.0.1

package/docs/src/components/architecture-diagram.tsx

@@ -0,0 +1,88 @@
+'use client';
+
+import { Globe, Server } from 'lucide-react';
+
+export function ArchitectureDiagram() {
+  return (
+    <div className="text-center">
+      <h2 className="text-4xl font-extrabold mb-4 bg-linear-to-br from-fd-foreground to-emerald-500 bg-clip-text text-transparent tracking-tight">
+        How It Works
+      </h2>
+      <p className="text-lg text-fd-muted-foreground max-w-xl mx-auto mb-14 leading-relaxed">
+        Nylon Mesh intercepts every HTTP request, checks its 2-tier cache, and only hits your backend when absolutely necessary.
+      </p>
+
+      <div className="flex items-center justify-center flex-col md:flex-row flex-wrap md:flex-nowrap gap-2 md:gap-0 max-w-full mx-auto px-4">
+        {/* Client */}
+        <div className="flex flex-col items-center justify-center bg-fd-card/50 border border-fd-border rounded-2xl px-6 py-6 min-w-[140px] shrink-0 backdrop-blur-sm transition-all duration-300 hover:-translate-y-1 hover:shadow-xl hover:border-blue-500/30 group">
+          <div className="p-3 bg-blue-500/10 rounded-xl mb-3 group-hover:bg-blue-500/20 transition-colors">
+            <Globe className="w-8 h-8 text-blue-400" />
+          </div>
+          <div className="font-bold text-lg text-fd-foreground mb-0.5">Client</div>
+          <div className="text-xs text-fd-muted-foreground font-medium">Browser / CDN</div>
+        </div>
+
+        {/* Arrow 1 */}
+        <div className="hidden md:flex flex-col items-center gap-1.5 px-3 shrink">
+          <div className="flex items-center gap-0 w-full justify-center">
+            <div className="w-12 h-0.5 bg-linear-to-r from-emerald-500/30 to-emerald-500" />
+            <svg viewBox="0 0 12 12" width="12" height="12"><path d="M0 0 L12 6 L0 12 Z" fill="#10b981" /></svg>
+          </div>
+          <span className="text-[0.65rem] text-emerald-500/80 font-bold uppercase tracking-wider whitespace-nowrap">Request</span>
+        </div>
+
+        {/* Mobile Arrow 1 */}
+        <div className="md:hidden flex items-center justify-center my-2">
+          <svg viewBox="0 0 12 12" width="12" height="12" className="rotate-90"><path d="M0 0 L12 6 L0 12 Z" fill="#10b981" /></svg>
+        </div>
+
+        {/* Nylon Mesh */}
+        <div className="flex flex-col items-center border border-emerald-500/30 bg-linear-to-br from-emerald-500/5 to-transparent rounded-3xl px-8 py-6 min-w-[240px] shrink-0 shadow-xl shadow-emerald-500/10 transition-all duration-300 hover:-translate-y-1 hover:shadow-emerald-500/20 hover:border-emerald-500/50 relative overflow-hidden group">
+          <div className="absolute inset-0 bg-linear-to-b from-emerald-500/5 to-transparent opacity-0 group-hover:opacity-100 transition-opacity" />
+
+          <div className="relative z-10 w-full flex flex-col items-center">
+            <div className="font-black text-xl text-transparent bg-clip-text bg-linear-to-r from-emerald-400 to-cyan-500 mb-0.5">Nylon Mesh</div>
+            <div className="text-xs text-fd-muted-foreground font-semibold uppercase tracking-wider mb-5">Pingora Core</div>
+
+            <div className="w-full flex flex-col gap-2">
+              <div className="flex items-center gap-3 bg-fd-card/80 border border-fd-border rounded-xl px-4 py-2.5 text-sm transition-colors group-hover:border-emerald-500/30 shadow-sm min-w-44">
+                <span className="bg-emerald-500/20 text-emerald-400 font-black text-[0.65rem] px-1.5 py-0.5 rounded tracking-wide">T1</span>
+                <span className="text-fd-foreground font-bold">RAM Cache</span>
+                <span className="ml-auto text-emerald-500 font-mono font-bold">~0.01ms</span>
+              </div>
+              <div className="text-[0.65rem] text-fd-muted-foreground text-center font-bold tracking-widest uppercase py-0.5">↓ miss</div>
+              <div className="flex items-center gap-3 bg-fd-card/80 border border-fd-border rounded-xl px-4 py-2.5 text-sm transition-colors group-hover:border-blue-500/30 shadow-sm min-w-44 whitespace-nowrap">
+                <span className="bg-blue-500/20 text-blue-400 font-black text-[0.65rem] px-1.5 py-0.5 rounded tracking-wide">T2</span>
+                <span className="text-fd-foreground font-bold text-xs">Redis/Dragonfly</span>
+                <span className="ml-auto pl-2 text-blue-400 font-mono font-bold">~0.5ms</span>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        {/* Arrow 2 */}
+        <div className="hidden md:flex flex-col items-center gap-1.5 px-3 shrink">
+          <div className="flex items-center gap-0 opacity-60 group-hover:opacity-100 transition-opacity w-full justify-center">
+            <div className="w-12 h-0.5 bg-[repeating-linear-gradient(90deg,#6e7681_0px,#6e7681_4px,transparent_4px,transparent_8px)]" />
+            <svg viewBox="0 0 12 12" width="12" height="12"><path d="M0 0 L12 6 L0 12 Z" fill="#6e7681" /></svg>
+          </div>
+          <span className="text-[0.65rem] text-fd-muted-foreground font-semibold uppercase tracking-wider whitespace-nowrap">Cache Miss</span>
+        </div>
+
+        {/* Mobile Arrow 2 */}
+        <div className="md:hidden flex items-center justify-center my-2 opacity-60">
+          <svg viewBox="0 0 12 12" width="12" height="12" className="rotate-90"><path d="M0 0 L12 6 L0 12 Z" fill="#6e7681" /></svg>
+        </div>
+
+        {/* Backend */}
+        <div className="flex flex-col items-center justify-center bg-fd-card/50 border border-fd-border rounded-2xl px-6 py-6 min-w-[140px] shrink-0 backdrop-blur-sm transition-all duration-300 hover:-translate-y-1 hover:shadow-xl hover:border-purple-500/30 group">
+          <div className="p-3 bg-purple-500/10 rounded-xl mb-3 group-hover:bg-purple-500/20 transition-colors">
+            <Server className="w-8 h-8 text-purple-400" />
+          </div>
+          <div className="font-bold text-lg text-fd-foreground mb-0.5">Backend</div>
+          <div className="text-xs text-fd-muted-foreground font-medium">Next.js / Nuxt</div>
+        </div>
+      </div>
+    </div>
+  );
+}

package/docs/src/components/benchmark.tsx

@@ -0,0 +1,129 @@
+'use client';
+
+import { useEffect, useRef, useState } from 'react';
+
+export function Benchmark() {
+  const [vanillaReqSec, setVanillaReqSec] = useState(0);
+  const [vanillaLatency, setVanillaLatency] = useState('0.00');
+  const [vanillaTransfer, setVanillaTransfer] = useState(0);
+  const [meshReqSec, setMeshReqSec] = useState(0);
+  const [meshLatency, setMeshLatency] = useState('0.00');
+  const [meshTransfer, setMeshTransfer] = useState(0);
+  const [multiplier, setMultiplier] = useState('0.0');
+  const animationId = useRef<number | null>(null);
+
+  useEffect(() => {
+    const vTargetReq = 5181, vTargetLat = 23.20, vTargetTrans = 15;
+    const mTargetReq = 100321, mTargetLat = 1.19, mTargetTrans = 292;
+    const targetMultiplier = mTargetReq / vTargetReq;
+    const duration = 2000;
+    let startTime: number | null = null;
+
+    const animate = (timestamp: number) => {
+      if (!startTime) startTime = timestamp;
+      const elapsed = timestamp - Math.max(startTime, 0);
+
+      if (elapsed < duration) {
+        const p = 1 - Math.pow(1 - elapsed / duration, 4);
+        setVanillaReqSec(Math.floor(p * vTargetReq));
+        setVanillaLatency((p * vTargetLat).toFixed(2));
+        setVanillaTransfer(Math.floor(p * vTargetTrans));
+        setMeshReqSec(Math.floor(p * mTargetReq));
+        setMeshLatency((p * mTargetLat).toFixed(2));
+        setMeshTransfer(Math.floor(p * mTargetTrans));
+        setMultiplier((p * targetMultiplier).toFixed(1));
+      } else {
+        const t = timestamp / 1000;
+        const vr = Math.floor(vTargetReq + Math.sin(t * 2) * 150 + Math.cos(t * 3.5) * 80);
+        setVanillaReqSec(vr);
+        setVanillaLatency(Math.max(10, vTargetLat + Math.sin(t * 3) * 0.8 + Math.cos(t * 1.8) * 0.5).toFixed(2));
+        setVanillaTransfer(Math.floor(vTargetTrans + Math.sin(t * 2.5) * 1 + Math.cos(t * 4) * 0.5));
+        const mr = Math.floor(mTargetReq + Math.sin(t * 2) * 800 + Math.cos(t * 3.5) * 500);
+        setMeshReqSec(mr);
+        setMeshLatency(Math.max(0.8, mTargetLat + Math.sin(t * 3) * 0.08 + Math.cos(t * 1.8) * 0.05).toFixed(2));
+        setMeshTransfer(Math.floor(mTargetTrans + Math.sin(t * 2.5) * 6 + Math.cos(t * 4) * 4));
+        setMultiplier((mr / Math.max(vr, 1)).toFixed(1));
+      }
+      animationId.current = requestAnimationFrame(animate);
+    };
+
+    animationId.current = requestAnimationFrame(animate);
+    return () => { if (animationId.current) cancelAnimationFrame(animationId.current); };
+  }, []);
+
+  return (
+    <div className="relative text-center py-8 px-6 pb-16 overflow-hidden">
+      <h2 className="text-4xl font-extrabold mb-4 bg-linear-to-br from-fd-foreground to-emerald-500 bg-clip-text text-transparent tracking-tight animate-[slideUp_0.6s_ease-out]">
+        Blazing Fast on Edge
+      </h2>
+      <p className="text-lg text-fd-muted-foreground mb-10 leading-relaxed animate-[slideUp_0.6s_ease-out_0.1s_both]">
+        Tested with <code className="bg-emerald-500/10 text-emerald-500 px-1.5 py-0.5 rounded font-semibold text-sm">oha</code> — 120 concurrent connections on <strong>Apple M1 Pro</strong> serving a default <code className="bg-emerald-500/10 text-emerald-500 px-1.5 py-0.5 rounded font-semibold text-sm">Next.js 16</code> app.
+      </p>
+
+      {/* Multiplier */}
+      <div className="flex items-baseline justify-center gap-1.5 mb-10 animate-[slideUp_0.6s_ease-out_0.2s_both]">
+        <span className="text-7xl font-black bg-linear-to-br from-emerald-500 via-green-500 to-cyan-400 bg-clip-text text-transparent leading-none tracking-tighter drop-shadow-[0_0_20px_rgba(16,185,129,0.3)]">
+          {multiplier}×
+        </span>
+        <span className="text-xl font-semibold text-fd-muted-foreground">faster</span>
+      </div>
+
+      {/* Cards */}
+      <div className="flex flex-col lg:flex-row items-stretch justify-center gap-6 lg:gap-8 mb-12 relative animate-[slideUp_0.6s_ease-out_0.3s_both] w-full max-w-5xl mx-auto">
+        {/* Mesh Card */}
+        <div className="flex-1 w-full rounded-2xl p-8 relative overflow-hidden bg-linear-to-br from-fd-card to-emerald-500/5 border border-emerald-500/25 shadow-lg shadow-emerald-500/10 transition-all duration-300 hover:-translate-y-1 hover:shadow-xl hover:shadow-emerald-500/20">
+          <div className="flex items-center justify-between mb-8">
+            <h3 className="text-xl font-bold text-fd-foreground m-0">With Nylon Mesh</h3>
+            <span className="text-xs font-bold tracking-wide px-2.5 py-1 rounded-full bg-emerald-500/15 text-emerald-500 border border-emerald-500/25">⚡ Cached</span>
+          </div>
+          <div className="grid grid-cols-2 gap-y-8 gap-x-4">
+            <div className="flex flex-col items-start col-span-2">
+              <span className="text-5xl font-bold bg-linear-to-r from-emerald-500 to-green-500 bg-clip-text text-transparent drop-shadow-[0_0_12px_rgba(16,185,129,0.3)] tabular-nums">{meshReqSec.toLocaleString()}</span>
+              <span className="text-xs uppercase tracking-wider font-semibold text-fd-muted-foreground mt-2">Requests / Second</span>
+            </div>
+            <div className="flex flex-col items-start">
+              <span className="text-2xl font-bold text-emerald-500 tabular-nums">{meshLatency}<small className="text-sm font-semibold text-emerald-500/50 ml-0.5">ms</small></span>
+              <span className="text-xs uppercase tracking-wider font-semibold text-fd-muted-foreground mt-1.5">Avg Latency</span>
+            </div>
+            <div className="flex flex-col items-start">
+              <span className="text-2xl font-bold text-emerald-500 tabular-nums">{meshTransfer}<small className="text-sm font-semibold text-emerald-500/50 ml-0.5">MB/s</small></span>
+              <span className="text-xs uppercase tracking-wider font-semibold text-fd-muted-foreground mt-1.5">Throughput</span>
+            </div>
+          </div>
+        </div>
+
+        {/* VS Badge (Desktop) */}
+        <div className="hidden lg:flex absolute left-1/2 top-[calc(50%+1rem)] -translate-x-1/2 -translate-y-1/2 items-center justify-center z-2">
+          <div className="w-12 h-12 rounded-full bg-fd-card border border-fd-border flex items-center justify-center font-extrabold italic text-fd-muted-foreground text-sm shadow-xl">VS</div>
+        </div>
+
+        {/* VS Badge (Mobile) */}
+        <div className="flex lg:hidden items-center justify-center my-2 z-2">
+          <div className="w-10 h-10 rounded-full bg-fd-card border border-fd-border flex items-center justify-center font-extrabold italic text-fd-muted-foreground text-sm shadow-lg">VS</div>
+        </div>
+
+        {/* Vanilla Card */}
+        <div className="flex-1 w-full rounded-2xl p-8 bg-fd-card/60 border border-fd-border opacity-85 transition-all duration-300 hover:-translate-y-1 hover:opacity-100">
+          <div className="flex items-center justify-between mb-8">
+            <h3 className="text-xl font-bold text-fd-foreground m-0">Vanilla Next.js</h3>
+            <span className="text-xs font-bold tracking-wide px-2.5 py-1 rounded-full bg-fd-muted-foreground/10 text-fd-muted-foreground border border-fd-muted-foreground/20">No Cache</span>
+          </div>
+          <div className="grid grid-cols-2 gap-y-8 gap-x-4">
+            <div className="flex flex-col items-start col-span-2">
+              <span className="text-5xl font-bold text-fd-muted-foreground tabular-nums">{vanillaReqSec.toLocaleString()}</span>
+              <span className="text-xs uppercase tracking-wider font-semibold text-fd-muted-foreground mt-2">Requests / Second</span>
+            </div>
+            <div className="flex flex-col items-start">
+              <span className="text-2xl font-bold text-fd-muted-foreground tabular-nums">{vanillaLatency}<small className="text-sm font-semibold text-fd-muted-foreground/70 ml-0.5">ms</small></span>
+              <span className="text-xs uppercase tracking-wider font-semibold text-fd-muted-foreground mt-1.5">Avg Latency</span>
+            </div>
+            <div className="flex flex-col items-start">
+              <span className="text-2xl font-bold text-fd-muted-foreground tabular-nums">{vanillaTransfer}<small className="text-sm font-semibold text-fd-muted-foreground/70 ml-0.5">MB/s</small></span>
+              <span className="text-xs uppercase tracking-wider font-semibold text-fd-muted-foreground mt-1.5">Throughput</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}

package/docs/src/components/configuration.tsx

@@ -0,0 +1,107 @@
+'use client';
+
+import { CopyButton } from '@/components/copy-button';
+
+export function Configuration() {
+  const yamlContent = `listen: "0.0.0.0:3000"
+
+upstreams:
+  - "127.0.0.1:3001"
+
+# DragonflyDB is highly recommended over Redis for Tier 2
+# redis_url: "redis://localhost:6379"
+
+cache:
+  tier1_capacity: 10000
+  tier1_ttl_seconds: 3
+  tier2_ttl_seconds: 60
+  status: [200, 404]
+  content_types:
+    - "text/html"
+
+bypass:
+  paths:
+    - "/_next/"
+    - "/api/"
+  extensions:
+    - ".ico"
+    - ".png"`;
+
+  return (
+    <div className="text-center max-w-4xl mx-auto px-4 mt-16 mb-0">
+      <h2 className="text-4xl font-extrabold mb-4 bg-linear-to-br from-fd-foreground to-emerald-500 bg-clip-text text-transparent tracking-tight">
+        Drop-in Configuration
+      </h2>
+      <p className="text-lg text-fd-muted-foreground max-w-xl mx-auto mb-10 leading-relaxed">
+        Everything is controlled through a single, declarative <code className="text-emerald-500 bg-emerald-500/10 px-1.5 py-0.5 rounded font-mono text-sm">yaml</code> file. No complex setups or hidden logic.
+      </p>
+
+      <div className="relative text-left">
+        {/* Glow behind terminal */}
+        <div className="absolute -inset-1 bg-linear-to-r from-emerald-500 to-cyan-500 rounded-3xl blur-xl opacity-20" />
+
+        {/* Terminal Window */}
+        <div className="relative rounded-2xl border border-white/10 bg-[#0d1117] shadow-2xl overflow-hidden ring-1 ring-white/5">
+          {/* Mac window controls */}
+          <div className="flex items-center justify-between px-4 py-3 border-b border-white/5 bg-[#161b22]">
+            <div className="flex gap-2 w-16">
+              <div className="w-3 h-3 rounded-full bg-red-500/80 border border-black/10"></div>
+              <div className="w-3 h-3 rounded-full bg-yellow-500/80 border border-black/10"></div>
+              <div className="w-3 h-3 rounded-full bg-green-500/80 border border-black/10"></div>
+            </div>
+            <div className="text-xs font-mono text-gray-400 font-medium">nylon-mesh.yaml</div>
+            <div className="w-16 flex justify-end">
+              <CopyButton text={yamlContent} />
+            </div>
+          </div>
+
+          {/* Code Body */}
+          <div className="p-6 md:p-8 overflow-x-auto">
+            <pre className="text-sm md:text-base font-mono leading-loose">
+              <code>
+                <span className="text-pink-400">listen</span><span className="text-gray-300">: </span><span className="text-green-400">"0.0.0.0:3000"</span>
+                {`\n\n`}
+                <span className="text-pink-400">upstreams</span><span className="text-gray-300">:</span>
+                {`\n`}
+                {`  - `}<span className="text-green-400">"127.0.0.1:3001"</span>
+                {`\n\n`}
+                <span className="text-gray-500"># DragonflyDB is highly recommended over Redis for Tier 2</span>
+                {`\n`}
+                <span className="text-gray-500"># redis_url: "redis://localhost:6379"</span>
+                {`\n\n`}
+                <span className="text-pink-400">cache</span><span className="text-gray-300">:</span>
+                {`\n`}
+                {`  `}<span className="text-blue-400">tier1_capacity</span><span className="text-gray-300">: </span><span className="text-yellow-400">10000</span>
+                {`\n`}
+                {`  `}<span className="text-blue-400">tier1_ttl_seconds</span><span className="text-gray-300">: </span><span className="text-yellow-400">3</span>
+                {`\n`}
+                {`  `}<span className="text-blue-400">tier2_ttl_seconds</span><span className="text-gray-300">: </span><span className="text-yellow-400">60</span>
+                {`\n`}
+                {`  `}<span className="text-blue-400">status</span><span className="text-gray-300">: [</span><span className="text-yellow-400">200</span><span className="text-gray-300">, </span><span className="text-yellow-400">404</span><span className="text-gray-300">]</span>
+                {`\n`}
+                {`  `}<span className="text-blue-400">content_types</span><span className="text-gray-300">:</span>
+                {`\n`}
+                {`    - `}<span className="text-green-400">"text/html"</span>
+                {`\n\n`}
+                <span className="text-pink-400">bypass</span><span className="text-gray-300">:</span>
+                {`\n`}
+                {`  `}<span className="text-blue-400">paths</span><span className="text-gray-300">:</span>
+                {`\n`}
+                {`    - `}<span className="text-green-400">"/_next/"</span>
+                {`\n`}
+                {`    - `}<span className="text-green-400">"/api/"</span>
+                {`\n`}
+                {`  `}<span className="text-blue-400">extensions</span><span className="text-gray-300">:</span>
+                {`\n`}
+                {`    - `}<span className="text-green-400">".ico"</span>
+                {`\n`}
+                {`    - `}<span className="text-green-400">".png"</span>
+                {`\n`}
+              </code>
+            </pre>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}

package/docs/src/components/copy-button.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+import { useState } from 'react';
+import { Copy, Check } from 'lucide-react';
+
+export function CopyButton({ text }: { text: string }) {
+  const [copied, setCopied] = useState(false);
+
+  const handleCopy = async () => {
+    try {
+      await navigator.clipboard.writeText(text);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2000);
+    } catch (err) {
+      console.error('Failed to copy text: ', err);
+    }
+  };
+
+  return (
+    <button
+      onClick={handleCopy}
+      className="text-fd-muted-foreground hover:text-fd-foreground transition-colors group-hover:text-emerald-500 cursor-pointer"
+      aria-label="Copy to clipboard"
+      title="Copy to clipboard"
+    >
+      {copied ? <Check className="w-4 h-4 text-emerald-500" /> : <Copy className="w-4 h-4" />}
+    </button>
+  );
+}

package/docs/src/components/footer.tsx

@@ -0,0 +1,37 @@
+import Link from 'next/link';
+
+export function Footer() {
+  return (
+    <footer className="border-t border-fd-border/50 bg-fd-background py-12 lg:py-16 mt-auto">
+      <div className="max-w-6xl mx-auto px-4 flex flex-col md:flex-row items-center md:items-start justify-between gap-12">
+        <div className="flex flex-col items-center md:items-start max-w-sm">
+          <div className="font-bold text-2xl tracking-tight mb-3 bg-linear-to-r from-emerald-400 to-cyan-500 bg-clip-text text-transparent">Nylon Mesh</div>
+          <p className="text-sm text-fd-muted-foreground text-center md:text-left mb-6 leading-relaxed">
+            A high-performance edge proxy built on Cloudflare Pingora. Cache everything, scale instantly.
+          </p>
+          <div className="text-xs text-fd-muted-foreground/60 font-medium">
+            © {new Date().getFullYear()} Nylon Mesh.
+          </div>
+        </div>
+
+        <div className="flex gap-16 sm:gap-24 text-sm text-center md:text-left">
+          <div className="flex flex-col gap-4">
+            <h3 className="font-semibold text-fd-foreground">Resources</h3>
+            <div className="flex flex-col gap-3">
+              <Link href="/docs" className="text-fd-muted-foreground hover:text-emerald-400 transition-colors">Documentation</Link>
+              <Link href="/docs/guide/deployment" className="text-fd-muted-foreground hover:text-emerald-400 transition-colors">Deployment</Link>
+              <Link href="https://github.com/AssetsArt/nylon-mesh" target="_blank" rel="noopener noreferrer" className="text-fd-muted-foreground hover:text-emerald-400 transition-colors">GitHub</Link>
+            </div>
+          </div>
+
+          <div className="flex flex-col gap-4">
+            <h3 className="font-semibold text-fd-foreground">Community</h3>
+            <div className="flex flex-col gap-3">
+              <a href="https://github.com/AssetsArt/nylon-mesh/issues" target="_blank" rel="noopener noreferrer" className="text-fd-muted-foreground hover:text-emerald-400 transition-colors">Issues</a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </footer>
+  );
+}

package/docs/src/components/framework-logos.tsx

@@ -0,0 +1,35 @@
+'use client';
+
+const frameworks = [
+  { name: 'Next.js', svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128"><circle cx="64" cy="64" r="64"/><path fill="url(#a)" d="M106.317 112.014 49.167 38.4H38.4v51.179h8.614v-40.24l52.54 67.884a64.216 64.216 0 0 0 6.763-5.209z"/><path fill="url(#b)" d="M81.778 38.4h8.533v51.2h-8.533z"/><defs><linearGradient id="a" x1="109" x2="144.5" y1="116.5" y2="160.5" gradientTransform="scale(.71111)" gradientUnits="userSpaceOnUse"><stop stop-color="#fff"/><stop offset="1" stop-color="#fff" stop-opacity="0"/></linearGradient><linearGradient id="b" x1="121" x2="120.799" y1="54" y2="106.875" gradientTransform="scale(.71111)" gradientUnits="userSpaceOnUse"><stop stop-color="#fff"/><stop offset="1" stop-color="#fff" stop-opacity="0"/></linearGradient></defs></svg>` },
+  { name: 'Nuxt', svg: `<svg viewBox="0 0 128 128" xmlns="http://www.w3.org/2000/svg"><path d="M39.267 108.97l-.284-.567c-.567-1.135-.567-2.27-.283-3.689H8.059L53.454 24.14l19.009 34.33 6.241-4.54L59.695 19.6c-.283-.567-2.553-3.971-6.241-3.971-1.703 0-4.256.567-6.242 4.255L1.25 101.31c-.284.852-2.27 4.54-.568 7.66 1.135 1.703 2.838 3.405 6.81 3.405h38.585c-3.972 0-5.958-1.702-6.81-3.404z" fill="#00c58e"/><path d="M126.65 101.59L89.767 35.201c-.567-.567-2.553-4.256-6.242-4.256-1.702 0-4.255.851-6.241 4.256l-4.823 7.944v15.321l11.065-19.009 36.599 65.254h-13.902a6.525 6.525 0 01-.568 3.972l-.284.284c-1.702 3.12-5.958 3.404-6.525 3.404h21.562c.851 0 4.823-.283 6.809-3.404.851-1.419 1.419-3.972-.567-7.377z" fill="#108775"/><path d="M106.51 108.97v-.284l.284-.567c.283-1.135.567-2.27.283-3.405l-1.134-3.404-28.938-50.501-4.256-7.66h-.284l-4.256 7.66-28.938 50.5-1.134 3.405a6.81 6.81 0 00.567 4.256c1.135 1.702 2.837 3.405 6.809 3.405h53.906c.851 0 5.107-.284 7.093-3.405zM72.464 58.469l26.386 46.245H46.079z" fill="#2f495e"/></svg>` },
+  { name: 'React', svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128"><g fill="#61DAFB"><circle cx="64" cy="64" r="11.4"/><path d="M107.3 45.2c-2.2-.8-4.5-1.6-6.9-2.3.6-2.4 1.1-4.8 1.5-7.1 2.1-13.2-.2-22.5-6.6-26.1-1.9-1.1-4-1.6-6.4-1.6-7 0-15.9 5.2-24.9 13.9-9-8.7-17.9-13.9-24.9-13.9-2.4 0-4.5.5-6.4 1.6-6.4 3.7-8.7 13-6.6 26.1.4 2.3.9 4.7 1.5 7.1-2.4.7-4.7 1.4-6.9 2.3C8.2 50 1.4 56.6 1.4 64s6.9 14 19.3 18.8c2.2.8 4.5 1.6 6.9 2.3-.6 2.4-1.1 4.8-1.5 7.1-2.1 13.2.2 22.5 6.6 26.1 1.9 1.1 4 1.6 6.4 1.6 7.1 0 16-5.2 24.9-13.9 9 8.7 17.9 13.9 24.9 13.9 2.4 0 4.5-.5 6.4-1.6 6.4-3.7 8.7-13 6.6-26.1-.4-2.3-.9-4.7-1.5-7.1 2.4-.7 4.7-1.4 6.9-2.3 12.5-4.8 19.3-11.4 19.3-18.8s-6.8-14-19.3-18.8zM92.5 14.7c4.1 2.4 5.5 9.8 3.8 20.3-.3 2.1-.8 4.3-1.4 6.6-5.2-1.2-10.7-2-16.5-2.5-3.4-4.8-6.9-9.1-10.4-13 7.4-7.3 14.9-12.3 21-12.3 1.3 0 2.5.3 3.5.9zM81.3 74c-1.8 3.2-3.9 6.4-6.1 9.6-3.7.3-7.4.4-11.2.4-3.9 0-7.6-.1-11.2-.4-2.2-3.2-4.2-6.4-6-9.6-1.9-3.3-3.7-6.7-5.3-10 1.6-3.3 3.4-6.7 5.3-10 1.8-3.2 3.9-6.4 6.1-9.6 3.7-.3 7.4-.4 11.2-.4 3.9 0 7.6.1 11.2.4 2.2 3.2 4.2 6.4 6 9.6 1.9 3.3 3.7 6.7 5.3 10-1.7 3.3-3.4 6.6-5.3 10zm8.3-3.3c1.5 3.5 2.7 6.9 3.8 10.3-3.4.8-7 1.4-10.8 1.9 1.2-1.9 2.5-3.9 3.6-6 1.2-2.1 2.3-4.2 3.4-6.2zM64 97.8c-2.4-2.6-4.7-5.4-6.9-8.3 2.3.1 4.6.2 6.9.2 2.3 0 4.6-.1 6.9-.2-2.2 2.9-4.5 5.7-6.9 8.3zm-18.6-15c-3.8-.5-7.4-1.1-10.8-1.9 1.1-3.3 2.3-6.8 3.8-10.3 1.1 2 2.2 4.1 3.4 6.1 1.2 2.2 2.4 4.1 3.6 6.1zm-7-25.5c-1.5-3.5-2.7-6.9-3.8-10.3 3.4-.8 7-1.4 10.8-1.9-1.2 1.9-2.5 3.9-3.6 6-1.2 2.1-2.3 4.2-3.4 6.2zM64 30.2c2.4 2.6 4.7 5.4 6.9 8.3-2.3-.1-4.6-.2-6.9-.2-2.3 0-4.6.1-6.9.2 2.2-2.9 4.5-5.7 6.9-8.3zm22.2 21l-3.6-6c3.8.5 7.4 1.1 10.8 1.9-1.1 3.3-2.3 6.8-3.8 10.3-1.1-2.1-2.2-4.2-3.4-6.2zM31.7 35c-1.7-10.5-.3-17.9 3.8-20.3 1-.6 2.2-.9 3.5-.9 6 0 13.5 4.9 21 12.3-3.5 3.8-7 8.2-10.4 13-5.8.5-11.3 1.4-16.5 2.5-.6-2.3-1-4.5-1.4-6.6zM7 64c0-4.7 5.7-9.7 15.7-13.4 2-.8 4.2-1.5 6.4-2.1 1.6 5 3.6 10.3 6 15.6-2.4 5.3-4.5 10.5-6 15.5C15.3 75.6 7 69.6 7 64zm28.5 49.3c-4.1-2.4-5.5-9.8-3.8-20.3.3-2.1.8-4.3 1.4-6.6 5.2 1.2 10.7 2 16.5 2.5 3.4 4.8 6.9 9.1 10.4 13-7.4 7.3-14.9 12.3-21 12.3-1.3 0-2.5-.3-3.5-.9zM96.3 93c1.7 10.5.3 17.9-3.8 20.3-1 .6-2.2.9-3.5.9-6 0-13.5-4.9-21-12.3 3.5-3.8 7-8.2 10.4-13 5.8-.5 11.3-1.4 16.5-2.5.6 2.3 1 4.5 1.4 6.6zm9-15.6c-2 .8-4.2 1.5-6.4 2.1-1.6-5-3.6-10.3-6-15.6 2.4-5.3 4.5-10.5 6-15.5 13.8 4 22.1 10 22.1 15.6 0 4.7-5.8 9.7-15.7 13.4z"/></g></svg>` },
+  { name: 'Angular', svg: `<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 128 128"><linearGradient id="ng-a" x1="14.704" x2="110.985" y1="46.27" y2="92.024" gradientTransform="matrix(1 0 0 -1 0 130)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#e40035"/><stop offset=".24" stop-color="#f60a48"/><stop offset=".352" stop-color="#f20755"/><stop offset=".494" stop-color="#dc087d"/><stop offset=".745" stop-color="#9717e7"/><stop offset="1" stop-color="#6c00f5"/></linearGradient><path fill="url(#ng-a)" d="m124.5 21.3-4.4 68.6L78.3 0l46.2 21.3zm-29 88.7L64 128l-31.5-18 6.4-15.5h50.3l6.3 15.5zM64 34.1l16.5 40.2h-33L64 34.1zM7.9 89.9 3.5 21.3 49.7 0 7.9 89.9z"/><linearGradient id="ng-b" x1="28.733" x2="91.742" y1="117.071" y2="45.195" gradientTransform="matrix(1 0 0 -1 0 130)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ff31d9"/><stop offset="1" stop-color="#ff5be1" stop-opacity="0"/></linearGradient><path fill="url(#ng-b)" d="m124.5 21.3-4.4 68.6L78.3 0l46.2 21.3zm-29 88.7L64 128l-31.5-18 6.4-15.5h50.3l6.3 15.5zM64 34.1l16.5 40.2h-33L64 34.1zM7.9 89.9 3.5 21.3 49.7 0 7.9 89.9z"/></svg>` },
+  { name: 'Vue', svg: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128"><path d="M0 8.934l49.854.158 14.167 24.47 14.432-24.47L128 8.935l-63.834 110.14zm126.98.637l-24.36.02-38.476 66.053L25.691 9.592.942 9.572l63.211 107.89zm-25.149-.008l-22.745.168-15.053 24.647L49.216 9.73l-22.794-.168 37.731 64.476zm-75.834-.17l23.002.009m-23.002-.01l23.002.01" fill="none"/><path d="M25.997 9.393l23.002.009L64.035 34.36 79.018 9.404 102 9.398 64.15 75.053z" fill="#35495e"/><path d="M.91 9.569l25.067-.172 38.15 65.659L101.98 9.401l25.11.026-62.966 108.06z" fill="#41b883"/></svg>` },
+];
+
+export function FrameworkLogos() {
+  return (
+    <div className="text-center">
+      <p className="text-sm font-black uppercase tracking-[0.2em] text-fd-muted-foreground mb-10 select-none">
+        Works with your favorite framework
+      </p>
+      <div className="flex items-center justify-center gap-10 flex-wrap">
+        {frameworks.map((fw) => (
+          <div
+            key={fw.name}
+            className="flex flex-col items-center gap-2.5 cursor-default transition-all duration-300 hover:-translate-y-1 group"
+          >
+            <div
+              className="w-11 h-11 transition-all duration-300 group-hover:drop-shadow-[0_0_12px_rgba(16,185,129,0.4)] [&>svg]:w-full [&>svg]:h-full"
+              dangerouslySetInnerHTML={{ __html: fw.svg }}
+            />
+            <span className="text-xs font-semibold text-fd-muted-foreground transition-colors duration-300 group-hover:text-fd-foreground">
+              {fw.name}
+            </span>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}

package/docs/src/lib/cn.ts

@@ -0,0 +1 @@
+export { twMerge as cn } from 'tailwind-merge';

package/docs/src/lib/layout.shared.tsx

@@ -0,0 +1,23 @@
+import type { BaseLayoutProps } from 'fumadocs-ui/layouts/shared';
+
+export const gitConfig = {
+  user: 'AssetsArt',
+  repo: 'nylon-mesh',
+  branch: 'main',
+};
+
+export function baseOptions(): BaseLayoutProps {
+  return {
+    nav: {
+      title: 'Nylon Mesh',
+    },
+    links: [
+      {
+        text: 'Docs',
+        url: '/docs',
+        active: 'nested-url',
+      },
+    ],
+    githubUrl: `https://github.com/${gitConfig.user}/${gitConfig.repo}`,
+  };
+}

package/docs/src/lib/source.ts

@@ -0,0 +1,27 @@
+import { docs } from 'fumadocs-mdx:collections/server';
+import { type InferPageType, loader } from 'fumadocs-core/source';
+import { lucideIconsPlugin } from 'fumadocs-core/source/lucide-icons';
+
+// See https://fumadocs.dev/docs/headless/source-api for more info
+export const source = loader({
+  baseUrl: '/docs',
+  source: docs.toFumadocsSource(),
+  plugins: [lucideIconsPlugin()],
+});
+
+export function getPageImage(page: InferPageType<typeof source>) {
+  const segments = [...page.slugs, 'image.png'];
+
+  return {
+    segments,
+    url: `/og/docs/${segments.join('/')}`,
+  };
+}
+
+export async function getLLMText(page: InferPageType<typeof source>) {
+  const processed = await page.data.getText('processed');
+
+  return `# ${page.data.title}
+
+${processed}`;
+}

package/docs/src/mdx-components.tsx

@@ -0,0 +1,9 @@
+import defaultMdxComponents from 'fumadocs-ui/mdx';
+import type { MDXComponents } from 'mdx/types';
+
+export function getMDXComponents(components?: MDXComponents): MDXComponents {
+  return {
+    ...defaultMdxComponents,
+    ...components,
+  };
+}

package/docs/tsconfig.json

@@ -0,0 +1,46 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "target": "ESNext",
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "react-jsx",
+    "incremental": true,
+    "paths": {
+      "@/*": [
+        "./src/*"
+      ],
+      "fumadocs-mdx:collections/*": [
+        ".source/*"
+      ]
+    },
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ]
+  },
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    ".next/types/**/*.ts",
+    ".next/dev/types/**/*.ts"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}

package/nylon-mesh.yaml

@@ -0,0 +1,41 @@
+# threads: 10
+# liveness_path: "/_health/live"
+# readiness_path: "/_health/ready"
+# grace_period_seconds: 0
+# graceful_shutdown_timeout_seconds: 0
+listen: "0.0.0.0:3000"
+# tls:
+#   listen: "0.0.0.0:443"
+#   certs:
+#     - host: "default"
+#       cert_path: "cert.pem"
+#       key_path: "key.pem"
+upstreams:
+  - "127.0.0.1:3001"
+  # - address: "127.0.0.1:3002"
+    # weight: 5
+load_balancer_algo: "round_robin"
+redis_url: "redis://localhost:6379"
+cache:
+  tier1_capacity: 10000
+  tier1_ttl_seconds: 3
+  tier2_ttl_seconds: 60
+  status: [200, 404]
+  content_types:
+    - "text/html"
+bypass:
+  paths:
+    - "/_next/"
+    - "/api/"
+  extensions:
+    - ".ico"
+    - ".png"
+# cache_control:
+#   - value: "public, max-age=31536000, immutable"
+#     paths:
+#       - "/_next/static/"
+#     extensions:
+#       - ".ico"
+#       - ".png"
+#       - ".jpg"
+

package/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "@assetsart/nylon-mesh",
+  "version": "1.0.1",
+  "description": "Nylon Mesh - Cache Everything. Scale Instantly.",
+  "main": "index.js",
+  "bin": {
+    "nylon-mesh": "bin/nylon-mesh.js"
+  },
+  "scripts": {
+    "build": "cargo build --release",
+    "docs:dev": "cd docs && bun run dev",
+    "docs:build": "cd docs && bun run build",
+    "release": "bun run scripts/release.mjs",
+    "publish:npm": "bun run scripts/publish.mjs"
+  },
+  "keywords": [
+    "proxy",
+    "nylon",
+    "pingora"
+  ],
+  "author": "",
+  "license": "MIT"
+}

package/scripts/publish.mjs

@@ -0,0 +1,18 @@
+import { execSync } from 'child_process';
+import { readFileSync } from 'fs';
+import { join } from 'path';
+
+try {
+  const pkgPath = join(process.cwd(), 'package.json');
+  const pkg = JSON.parse(readFileSync(pkgPath, 'utf8'));
+
+  console.log(`🚀 Publishing ${pkg.name} v${pkg.version} to npm...`);
+
+  // Run npm publish with public access for scoped packages
+  execSync('npm publish --access public', { stdio: 'inherit' });
+
+  console.log(`\n✅ Successfully published v${pkg.version} to npm!`);
+} catch (err) {
+  console.error('\n❌ Failed to publish to npm:', err.message);
+  process.exit(1);
+}