Fresh is Deno's web framework. Zero JavaScript shipped to the client by default. Interactive parts are "islands" that hydrate independently. Fresh 2 adds Preact Signals, better plugins, and faster builds.
Quick Start
deno run -A https://fresh.deno.dev my-app
cd my-app && deno task start
Zero JS by Default
Every Fresh page is server-rendered HTML. No JavaScript bundle. This page component ships 0 bytes of JS:
// routes/index.tsx
export default function Home() {
return (
<div>
<h1>Hello Fresh</h1>
<p>This page has zero client-side JavaScript.</p>
</div>
)
}
Islands (Interactive Components)
Only components in /islands/ get hydrated on the client:
// islands/Counter.tsx
import { useSignal } from "@preact/signals"
export default function Counter() {
const count = useSignal(0)
return (
<div>
<p>Count: {count}</p>
<button onClick={() => count.value++}>+1</button>
</div>
)
}
// routes/index.tsx
import Counter from "../islands/Counter.tsx"
export default function Home() {
return (
<div>
<h1>Static content (0 JS)</h1>
<Counter /> {/* Only this hydrates */}
</div>
)
}
Data Loading with Handlers
// routes/posts/[id].tsx
import { Handlers, PageProps } from "$fresh/server.ts"
export const handler: Handlers = {
async GET(_req, ctx) {
const post = await fetchPost(ctx.params.id)
if (!post) return ctx.renderNotFound()
return ctx.render(post)
}
}
export default function PostPage({ data }: PageProps) {
return <article><h1>{data.title}</h1><p>{data.body}</p></article>
}
Fresh vs Next.js vs Remix
| Feature | Fresh | Next.js | Remix |
|---|---|---|---|
| Runtime | Deno | Node | Node |
| Default JS | 0 bytes | Bundle | Bundle |
| Hydration | Islands | Full/Partial | Full |
| State | Preact Signals | React | React |
The Bottom Line
Fresh is perfect for content-heavy sites that need minimal interactivity. Zero JS default + island architecture = fastest possible page loads.
Need to automate data collection or build custom scrapers? Check out my Apify actors for ready-made tools, or email spinov001@gmail.com for custom solutions.
Top comments (0)