DEV Community

The Practical Developer
The Practical Developer

Posted on Originally published at practicaldevblog.blogspot.com

Qwik Explained: Instant Apps Through Resumability

Introduction

Modern frameworks ship JavaScript, then spend time on page load "hydrating": re-running components in the browser to make server-rendered HTML interactive. That hydration cost is why many sites feel slow to become responsive even when they look loaded. Qwik, released in 2022, attacks the problem at its root with resumability: the server renders HTML and serialises the app's state, and the browser resumes where the server left off — without re-running component code or downloading the framework upfront. The result is near-instant interactivity, even for large apps.

Resumability, lazy loading, and dollar-sign syntax

Qwik's ideas build on each other:

  • Resumability, not hydration — server-rendered HTML carries serialised state and tiny event listeners; the browser does not re-execute components to attach interactivity, it resumes them.
  • Lazy loading by default — event handlers and component code download only when needed: clicking a button fetches that button's handler, not the whole app. Qwik's optimizer splits code automatically at the $ boundary.
  • Dollar-sign syntax — functions marked with $, like onClick$, tell the optimizer where code can be split and lazily loaded.
  • No hydration tax — initial JavaScript can be near zero regardless of app size, because code arrives on demand, not upfront.

A component shows the shape — familiar JSX, with $ marking the lazy boundary:

import { component$, useSignal } from "@builder.io/qwik";
export const Counter = component$(() => {
  const count = useSignal(0);
  return (
    <button onClick$={() => count.value++}>
      Clicks: {count.value}
    </button>
  );
});
Enter fullscreen mode Exit fullscreen mode

The button renders on the server; its click handler downloads only when clicked. Scale that across an app and startup time stops growing with app size — Qwik's central claim, and the reason it wins startup benchmarks.

The honest trade

Qwik's trade is youth and ecosystem: a small community, fewer libraries, and a mental model (resumability, $ boundaries, serialisable state) that takes learning. Its tooling and job market trail React and Next.js by a wide margin. The rule of thumb: Qwik when startup performance is the top priority — marketing sites, e-commerce, content apps at scale; a mainstream framework when ecosystem and hiring matter more.

Takeaway

Qwik is instant apps through resumability: server-rendered HTML with serialised state, code split at $ boundaries and loaded on demand, no hydration re-run. It trades ecosystem maturity for startup time that does not grow with app size — and for user-facing sites, that is a superpower.

Originally published at https://practicaldevblog.blogspot.com/2026/10/qwik-explained-instant-apps-through.html

Top comments (0)