@alyvro/turbo ⚡

Smart, intent-based prefetching for Next.js. Boost your navigation speed without spamming your server with unnecessary requests.

🤔 Why?

Standard Next.js <Link> prefetches routes as soon as they enter the viewport. While this makes navigation fast, it can destroy your bandwidth and server resources on pages with many links (like lists or grids).

@alyvro/turbo solves this by prefetching only when the user shows intent:

1. Mouse Hover: Prefetches after a short delay (e.g., 50ms) to ensure the user actually wants to click.
2. Touch Start: Prefetches immediately on touch (mobile optimization).

🚀 Features

• 🎯 Intent-Based: Only loads what's needed.
• ⚡ Instant Navigation: Zero latency on click.
• 📉 Low Bandwidth: Saves user data and server costs.
• 📱 Mobile Optimized: Smart handling for touch devices.
• 🔌 Drop-in Replacement: Works exactly like next/link.

📦 Installation

pnpm add @alyvro/turbo
# or
npm install @alyvro/turbo

💻 Usage

Simply replace Link with TurboLink. It accepts all standard Next.js link props.

import { TurboLink } from "@alyvro/turbo";

export default function NavBar() {
  return (
    <nav>
      {/* Standard usage (50ms hover delay) */}
      <TurboLink href="/dashboard">Dashboard</TurboLink>

      {/* Custom delay for strictly saving bandwidth */}
      <TurboLink href="/settings" delay={200}>
        Settings
      </TurboLink>
    </nav>
  );
}

| Prop | Type | Default | Description | | | -------- | ------- | -------- | -------------------------------------------------- | --- | | href | string | Required | The path or URL to navigate to. | | | delay | number | 50 | Time in ms to wait before prefetching on hover. | | | prefetch | boolean | false | Whether to prefetch immediately (not recommended). | |

🛡 License

MIT © Alyvro