framework / 07 — updated may 2026

Qwikby builder.io · qwikdev

The resumability framework. Skips hydration entirely — pages are interactive from first paint without re-executing component code in the browser. The most architecturally novel bet in this set, with the steepest mental model.

languageTypeScript-first
runtimeNode · Cloudflare · Vercel · static
renderingSSR · SSG · resumability
coreQwik 1.x (stable)
verdict.txt — frameworks/qwik.mdhonest
$cat verdict.txt

Pick Qwik if you have a high-traffic public-facing product where time-to-interactive is a competitive feature, and your team is willing to internalize a new programming model to get it.

verdict / bull case + bear case

Why we picked it — and why we might not

Qwikis the default React framework in 2026 not because it’s the smallest or the simplest, but because it’s the one with the least friction across the widest set of problems — provided your problem is shaped like a React product on Vercel.

The bull case is straightforward. App Router, Server Components, and Server Actions collapse what used to be three layers (page, API route, client fetcher) into one mental model. The Vercel deploy story is unmatched — push to git, get a preview URL, promote on click. The ecosystem is the largest in React: every auth provider, every database client, every UI library has a first-class Qwik example, and the AI assistants understand Qwik better than they understand any other framework. For a team that’s already on React, choosing Qwik means choosing the path with the most documentation, the most third-party integrations, and the most worked examples.

The bear case is also real. The cache model is the most complex in the ecosystem; newcomers fight it before they understand it, and “wait, is this server or client?” is a permanent confusion for the first month. Bundle size meaningfully exceeds Astro and SvelteKit — fine if you’re using RSC, pure overhead if you’re not. Lock-in is medium-strength: ISR-on-demand, image optimization, and middleware all bind tighter to Vercel-style hosts than to a generic Node server. Self-hosting works, but you trade deploy ergonomics for it.

For most product teams the calculus comes out in Qwik’s favor, but the failure modes are specific and worth naming. If your app is a SPA, Vite + React Router ships less code. If your site is content-first, Astro is a better fit. If you need a pure backend, Hono or Fastify are the right answer. The honest summary: Qwik is the right default, not the right answer in every case.

scoreboard / at a glance

At a glance

One row per dimension. The value is what Qwikgives you; the note is the editorial framing — the quiet caveat that the marketing page won’t mention.

Routing
file-system · src/routes · Qwik CityQwik City is the metaframework on top of Qwik — like SolidStart on top of Solid.
Reactivity model
resumability · no hydration · serialized stateHeadline differentiator. The page resumes from the server's serialized state instead of re-running component code.
Time to interactive
near-zero · no hydration costPages are interactive when the HTML arrives. Lighthouse TTI scores are dramatic compared to React/Vue/Svelte.
Component code execution
lazy · code splits per event handlerQwik splits JavaScript at the event-handler granularity. Code only loads when the corresponding interaction fires.
Data fetching
routeLoader$ · routeAction$ · server$Server-only functions marked with $ syntax. Type-safe; the build optimizer handles the boundary.
Hosting fit
Vercel · Cloudflare · Netlify · Node · staticAdapter coverage similar to SolidStart. Cloudflare Pages adapter is well-supported.
Bundle size
tiny initial bundle · lazy-loaded chunks per handlerInitial JS payload can be effectively zero. The total JS for an interactive site is similar; it just loads on demand.
Ecosystem
smallest in this set · React libs don't translateSmaller than SolidStart's. Most React libraries don't have Qwik equivalents.
Lock-in
low · adapter-based · no proprietary cacheHighly portable. The interesting parts of Qwik are runtime semantics, not deploy-platform features.
Framework age
4 years · Qwik 1.0 (May 2023)Younger than the rest of this set. Production deployments exist (notably Builder.io's own products).
pricing / three scenarios

Pricing at three scales

Three receipts at three traffic shapes. Numbers are illustrative — list-tier prices from May 2026, rounded to the dollar. Nothing here is invented; actual bills will vary with usage shape.

hobby.txt — 1k pageviews · personal sitemonthly
line itemdetailcost
HostingCloudflare Pages — freefree
DatabaseTurso free tierfree
TOTAL · monthlyfree/mo
>Same Cloudflare Pages economics as the rest of the bandwidth-light frameworks — Qwik's smaller initial bundle is just gravy.
side-project.txt — 10k pageviews · steady traffic · paying customersmonthly
line itemdetailcost
HostingCloudflare Pages — freefree
DatabaseTurso Scaler$9
BandwidthCF Pages — unlimited freefree
TOTAL · monthly$9/mo
>Cheaper than Next.js by a wide margin and on par with SvelteKit / Astro / Remix / SolidStart at this scale. The bandwidth savings from resumability help on bandwidth-metered hosts.
scale.txt — 100k pageviews · production · multi-regionmonthly
line itemdetailcost
HostingCloudflare Pages · global edgefree
BandwidthCF Pages — unlimited freefree
DatabaseTurso Production · 8 replicas$29
WorkersCF Workers paid$5
TOTAL · monthly$34/mo
>The same scale receipt as the other small-runtime frameworks. Where Qwik shines at scale isn't the dollar bill — it's the user-perceived performance, which compounds into conversion rate / retention.
features / deep dives

Feature by feature

Six rows. The body describes how the feature works in 2026; the honest tradeoff is the part the docs won’t tell you. Skim the bold lines if you’re in a hurry.

01

Resumability

the architectural bet

Traditional frameworks send HTML, then JS, then the browser hydrates by re-running component code. Qwik serializes component state and event handlers into the HTML, and the browser “resumes” — picks up where the server left off without re-executing components. Time-to-interactive becomes near-zero.

Honest tradeoff

The performance win is genuine and dramatic for public-facing pages. The cost is conceptual: you have to reason about what state serializes, what doesn't, and how the optimizer splits your code.

02

$ syntax

the optimizer's escape hatch

Qwik uses $ suffixes to mark code-split boundaries: onClick$, component$, useTask$. The optimizer creates separate JS chunks for each. Code only loads when the corresponding boundary fires.

Honest tradeoff

The $ convention is unique to Qwik. Once internalized, it becomes second nature; for the first week, it feels arbitrary.

03

routeLoader$ / routeAction$

data and mutations, server-side

routeLoader$ declares a server-side data loader for a route — runs on SSR, returns typed data. routeAction$ declares a form-action handler. Type-safe; the optimizer handles the network boundary.

Honest tradeoff

Same shape as SvelteKit's load() / actions. Cleaner than Remix for some patterns; smaller ecosystem of recipes when you hit edge cases.

04

Qwik City

the metaframework layer

Qwik City sits on top of Qwik the way Next.js sits on top of React. File-system routing, layouts, server endpoints, error boundaries. Adapter-based deploy.

Honest tradeoff

Qwik City makes the framework feel like a peer of Next.js / SvelteKit on the metaframework axis. The downside: it's the smallest in this set in terms of community recipes and tutorials.

05

Optimizer

the build that makes resumability work

The Qwik optimizer compiles components into chunks split at $ boundaries. The output is the magic — a website that ships <1KB of JS up front, with handlers loaded lazily. Build times are reasonable; output is genuinely small.

Honest tradeoff

Optimizer output is impressive. The downside: the optimization is the framework, so when something breaks, the error trace crosses optimizer boundaries and is harder to debug than a 'normal' bundler error.

06

JSX (close to React)

but not React

JSX syntax familiar to React devs. useSignal() / useStore() for reactivity (similar to Solid's signals but with a different mental model). Hooks have $ suffixes when they cross optimizer boundaries.

Honest tradeoff

JSX cuts onboarding time. The hooks (with $) and the resumability mental model are the conceptual lift; the syntax isn't.

fit / use or skip

Use it for, skip it for

use / qwik

Use Qwik for…

  • User-perceived performance is a competitive feature — high-traffic content sites, e-commerce listings, or any product where milliseconds-to-interactive correlates with conversion.
  • You want the smallest possible initial JS payload — Qwik beats every other framework in this set on time-to-interactive.
  • The architectural novelty (resumability) is something your team would enjoy learning, not just a feature checkbox.
  • You're shipping public web surfaces (marketing, content, listings) where every kilobyte matters at scale.
  • Your team is small enough to absorb a new mental model and curious enough to want to.
skip / qwik

Skip Qwik for…

  • Your team prioritizes ecosystem reach — Qwik's library set is smaller than every other framework in this comparison.
  • AI-assisted development is core to your workflow — Claude/Copilot have weaker Qwik fluency than for any major framework here.
  • Your product is internal (admin, dashboard, intranet) where time-to-interactive has zero competitive weight.
  • Your team would rather not learn a new programming model — the $ syntax and resumability concepts have a real learning curve.
  • You're hiring at scale from a job market that's React/Vue dominant — Qwik talent is rare.
gotchas / observed

Gotchas worth knowing

Six pitfalls visible in public docs and community discussion. None will stop you shipping; all of them will cost you an afternoon if you don’t know about them.

  • Qwik / $ suffixes

    Forgetting $ on event handlers means full hydration

    <button onClick={handler}> works but doesn’t code-split. <button onClick$={handler}> creates a separate chunk loaded on click. The wrong one silently produces a larger bundle without an error.

  • Qwik / closures

    Captured variables in component$ must be serializable

    A handler closing over a non-serializable value (new Date(), a class instance, a function from a third-party lib) will fail at serialization with a runtime error. The optimizer can’t serialize what it doesn’t recognize. Stick to plain values or use noSerialize() for opt-out.

  • Qwik / SSR

    Browser-only code in component$ crashes SSR

    Calling window or document at component setup crashes SSR. Use useVisibleTask$ for browser-only side effects — runs after the component is visible, in the browser only.

  • Qwik / state

    useStore() requires deep tracking

    useStore() tracks deep updates by default. If you mutate a deeply-nested property, all consumers re-evaluate. For shallow updates, use useStore(, { deep: false }) to opt out. Performance regressions on large stores often trace to deep tracking.

  • Qwik / forms

    routeAction$ doesn't auto-revalidate routeLoader$ data

    Same gotcha as SolidStart and SvelteKit. After a routeAction$ runs, you must call `nav()` or use the action's revalidator to refresh routeLoader$ data on the same page.

  • Qwik / docs

    Tutorials lag the framework

    Qwik moved fast through 1.0 → 1.x; some tutorials reference deprecated patterns or pre-Qwik-City conventions. When following older guides, double-check against the current docs site (qwik.dev) before copying patterns.

how it compares / different bets

How it compares

Three short framings. No clear-winner declarations — these are different bets, and the right pick is mostly a question of what you’re optimizing for. Linked comparison pages have the side-by-side detail.

Qwik ━▶ React/Next.jsdifferent bets

Next.js bets on the largest possible ecosystem and React's gravity. Qwik bets on a fundamentally different runtime architecture (resumability) where time-to-interactive is solved at the framework level. The performance gap on cold loads is dramatic; the ecosystem gap is also dramatic.

Pick Next.js for the safe, well-documented, AI-fluent default. Pick Qwik when user-perceived performance is a hard requirement and your team will absorb the architectural novelty.

Qwik ━▶ SolidStartdifferent bets

Both ship small bundles and use signals-style reactivity. Qwik resumes (no hydration); SolidStart hydrates with Solid's tiny runtime. SolidStart has the more familiar mental model for React devs; Qwik has the more architecturally novel one.

Pick SolidStart when JSX-familiar fine-grained reactivity is the goal. Pick Qwik when the resumability win on cold loads is worth the extra learning curve.

Qwik ━▶ Astrodifferent bets

Astro ships zero JS by default for static content. Qwik ships near-zero JS but supports full app interactivity through resumability. Astro is content-first; Qwik is app-first with content-site-grade performance.

Pick Astro for blog/docs/marketing. Pick Qwik when you need full app interactivity but can't accept the JS payload of React/Vue/Svelte equivalents.