feat: out of order streaming for Suspense by Varixo · Pull Request #8611 · QwikDev/qwik

Varixo · 2026-05-05T16:49:39Z

No description provided.

changeset-bot · 2026-05-05T16:49:43Z

🦋 Changeset detected

Latest commit: 91119b6

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 5 packages

Name	Type
@qwik.dev/core	Patch
eslint-plugin-qwik	Patch
@qwik.dev/react	Patch
@qwik.dev/router	Patch
create-qwik	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

pkg-pr-new · 2026-05-05T16:57:53Z

Open in StackBlitz

@qwik.dev/core

npm i https://pkg.pr.new/QwikDev/qwik/@qwik.dev/core@8611

@qwik.dev/router

npm i https://pkg.pr.new/QwikDev/qwik/@qwik.dev/router@8611

eslint-plugin-qwik

npm i https://pkg.pr.new/QwikDev/qwik/eslint-plugin-qwik@8611

create-qwik

npm i https://pkg.pr.new/QwikDev/qwik/create-qwik@8611

@qwik.dev/optimizer

npm i https://pkg.pr.new/QwikDev/qwik/@qwik.dev/optimizer@8611

commit: 91119b6

github-actions · 2026-05-05T17:11:25Z

built with Refined Cloudflare Pages Action

⚡ Cloudflare Pages Deployment

Name	Status	Preview	Last Commit
qwik-docs	✅ Ready (View Log)	Visit Preview	`91119b6`

wmertens

Initial comments

wmertens · 2026-05-15T13:38:52Z


+## Out-of-order Streaming
+
+Out-of-order streaming is an optional server rendering mode for `<Suspense>`.


I think it should be the default when the experimental is enabled.

wmertens · 2026-05-15T13:39:49Z

+Out-of-order streaming is an optional server rendering mode for `<Suspense>`.
+
+Server rendering means Qwik creates HTML on the server and sends it to the browser. Streaming means
+the browser can receive that HTML in chunks instead of waiting for one complete HTML string.


...HTML string (but still within the same HTTP connection).

wmertens · 2026-05-15T13:46:13Z

+      ...opts,
+      streaming: {
+        ...opts.streaming,
+        outOfOrder: { strategy: 'suspense' },


do we plan other strategies? Why not a simple boolean and if we want to tweak things later we can optionally accept an object?

wmertens · 2026-05-15T13:47:48Z

+
+### Fallbacks
+
+The fallback is real UI. Choose markup that is useful while the user waits:


Is the fallback always added to the stream? Worth explaining either way.

wmertens · 2026-05-15T13:48:52Z

+waiting. If your fallback has buttons or other event handlers, they can also resume while the
+fallback is visible, after the root page state has loaded in the browser.
+
+When the real content arrives, Qwik removes the fallback and inserts the resolved content. The


Qwik hides the fallback, right? Not removes?

wmertens · 2026-05-15T13:49:40Z

+while the server is still rendering.
+
+For static site generation, the HTML file is created ahead of time. The user receives the finished
+file later, so there is no live server stream to reveal a fallback first.


Ah and during SSG, OoOS should be disabled of course.

wmertens · 2026-05-15T15:03:19Z

-      let lastIdx = this.$forwardRefs$.length - 1;
-      while (lastIdx >= 0 && this.$forwardRefs$[lastIdx] === -1) {
-        lastIdx--;
+  private getForwardRefsPayload(): Array<number | string | number[]> | null {


If I'm reading this right, if there is a slow promise first and a faster one later, ooos could send only the faster one and the slow will never be sent?

wmertens

I'm worried about forwardRefs, can you write a test with Suspense and a Promise that only resolves after the first chunk, followed by a Promise that resolves before the first chunk?

wmertens · 2026-05-15T15:05:59Z

+export const getSegmentVNodeId = (segmentId: string, localIndex: number): number => {
+  const segmentIndex = parseInt(segmentId, 10) - 1;
+  const diagonal = segmentIndex + localIndex;
+  return -((diagonal * (diagonal + 1)) / 2 + localIndex + 1);


I don't understand how this works, can you add a comment?

Varixo added 11 commits May 5, 2026 13:41

feat: out of order streaming

ebfb5e1

feat: add Promise as a possible component return type

943d793

fix(core): scope serialized state to container instance

91a9289

fix(ssr): queue out-of-order suspense segment renders

421c5d1

fix: cross state interactivity

b512b3b

feat(qwik): stream suspense content before root state

b3a20f0

feat: move inline script to shared file

c0c4985

fix(qwik): refresh suspense segment effects after state merge

f32108a

test: scope OOOS suspense releases per request

410bbf9

chore(ooos): cleanup

e76d5f9

fix: merge OOOS segment effects into root state

5122c1d

Varixo self-assigned this May 5, 2026

Varixo requested review from a team as code owners May 5, 2026 16:49

Varixo added the V2 label May 5, 2026

Varixo added this to Qwik Development May 5, 2026

github-project-automation Bot moved this to Backlog in Qwik Development May 5, 2026

maiieul moved this from Backlog to Waiting For Review in Qwik Development May 5, 2026

Varixo added 3 commits May 6, 2026 14:55

fix: OOOS across multiple containers

1504de9

feat(ooos): cleanup

37c050a

refactor(ooos): major ooos refactor

9f2bbe4

Varixo force-pushed the v2-out-of-order-streaming branch from e63fe47 to 915e9ba Compare May 7, 2026 14:06

test(ooos): fix webkit e2e tests

303b6d1

Varixo force-pushed the v2-out-of-order-streaming branch from 915e9ba to 303b6d1 Compare May 7, 2026 14:10

Varixo added 2 commits May 7, 2026 21:17

refactor(core): simplify OOOS suspense segment processing

553b37c

test(ooos): add more unit tests

5f61db2

Varixo force-pushed the v2-out-of-order-streaming branch from a9b29e0 to d72b9f7 Compare May 9, 2026 12:14

Varixo added 5 commits May 9, 2026 15:16

fix(vite): define experimental flags per environment

3694b32

fix(core): preserve experimental flag member reads in minified builds

db3af51

fix(docs): keep REPL preview font during streamed output

010cfa9

fix(docs): change REPL out-of-order streaming param

07780b4

fix(core): restore synchronous component return types

d3080e7

Varixo marked this pull request as draft May 9, 2026 17:07

maiieul moved this from Waiting For Review to In progress in Qwik Development May 9, 2026

Varixo added 2 commits May 9, 2026 20:13

refactor(ooos): small refactor after self review

ce41945

refactor: add outoforderstreaming options check

2daee26

Varixo marked this pull request as ready for review May 9, 2026 20:20

maiieul moved this from In progress to Waiting For Review in Qwik Development May 9, 2026

fix(docs): isolate REPL SSR stream responses

053ee8f

Varixo marked this pull request as draft May 10, 2026 06:07

maiieul moved this from Waiting For Review to In progress in Qwik Development May 10, 2026

Varixo added 2 commits May 10, 2026 15:45

refactor(ooos): refactor deferred slot for suspense

6c034a6

refactor(ooos): separate segment container

8f02710

Varixo marked this pull request as ready for review May 10, 2026 14:41

maiieul moved this from In progress to Waiting For Review in Qwik Development May 10, 2026

Varixo added 3 commits May 13, 2026 17:00

Merge branch 'build/v2' into v2-out-of-order-streaming

07a2f5e

Merge branch 'build/v2' into v2-out-of-order-streaming

2347a82

docs: move suspense into experimental section

91119b6

Varixo force-pushed the v2-out-of-order-streaming branch from ac0875f to 91119b6 Compare May 13, 2026 20:14

wmertens reviewed May 15, 2026

View reviewed changes

wmertens requested changes May 15, 2026

View reviewed changes

thejackshelton marked this pull request as draft May 19, 2026 05:59

maiieul moved this from Waiting For Review to In progress in Qwik Development May 19, 2026

wmertens force-pushed the v2-out-of-order-streaming branch from 97ec911 to 91119b6 Compare May 19, 2026 06:10

Varixo force-pushed the v2-out-of-order-streaming branch from 8e52f54 to 91119b6 Compare May 20, 2026 20:48


		## Out-of-order Streaming

		Out-of-order streaming is an optional server rendering mode for `<Suspense>`.


		### Fallbacks

		The fallback is real UI. Choose markup that is useful while the user waits:

Conversation

Varixo commented May 5, 2026

Uh oh!

changeset-bot Bot commented May 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

pkg-pr-new Bot commented May 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented May 5, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

built with Refined Cloudflare Pages Action

⚡ Cloudflare Pages Deployment

Uh oh!

wmertens left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

wmertens left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

changeset-bot Bot commented May 5, 2026 •

edited

Loading

pkg-pr-new Bot commented May 5, 2026 •

edited

Loading

github-actions Bot commented May 5, 2026 •

edited

Loading