Compatibility

Does adding GenClass break your app? This page answers that for 7 small, idiomatic apps (React 19 + Vite 8; Next.js 16 App Router (SSR); Vue 3 + Vite 8; SvelteKit 3 (Svelte 5, SSR, adapter-node); Angular 22 (SSR + hydration, zoneless); Solid 1.9 + Vite 8; Plain HTML, CDN script tag) and 15 data layers, each installed with the one line from the README and driven through the same eight scenarios in headless Chromium, 10 seeds each, in every mode. It is generated by a script from a run on 2026-10-10; nothing here is edited by hand except the notes marked Analysis, and every ✗ is listed with its details below.

Summary

• 350 of 351 (app × data layer × scenario × mode) cells are ✓: GenClass in that mode left the app as correct as it was without GenClass, on every seed. Observe mode (the default) must leave the final page and server state identical to a run without GenClass.
• Bugs introduced: 0 across 3510 mode runs. Non-passive actions on correct apps (scenarios c to h, guard + heal): 0 in 1760 runs.
• Bugs fixed by an action: 10 (10 × heal, HttpClient withXhr() (XMLHttpRequest) + signals (Angular 22 (SSR + hydration, zoneless)), scenario b, request:block). The two scenarios with a latent bug (a stale typeahead, a double submit) showed it in 250 of 290 runs without GenClass; guard left 249 and heal 240 of the same runs buggy. GenClass acts only when its model is confident, and with the shipped model that is rare: it reports far more than it fixes (see Model quality). In 4 more runs a bug of the app did not show with GenClass although GenClass took no action: GenClass changed the timing of a race in the app (listed at the end of the page).
• Observe-mode findings on correct apps: 319 in 880 runs (scenarios c to h). 270 of them report the failure a scenario injects on purpose (the HTTP 500 in d, going offline in e), which the app handles correctly; 49 are false findings (request:overload in g ×45, request:duplicate in g ×4). Findings change nothing in observe mode; they are listed per cell in What GenClass reported and did.

Versions: @genclass/runtime packed from this repository at commit d04eff3 (version string 0.1.0-beta.4, never published: the code released as 0.2.0 plus the "Model ready" log fix, which shipped together as 0.2.1), model genclass-runtime-r17 2.0.0-rc4t (the default model, WASM, balanced profile), headless Chromium 153.0.8010.12, Node v24.21.0. Framework versions are in the first table.

Frameworks

Each app is built for production and served the way it would be in production (static files, next start, the SvelteKit Node adapter, Angular's SSR server). Boots clean: the model loads, fetch is instrumented, no console errors or GenClass warnings, no request leaves the machine. Kill switch: with ?genclass=off nothing is installed (WebSocket, EventSource and timers are the browser's own, no model worker) and the app works. Devtools: the overlay mounts. CSP: the app still boots clean (model ready, no violation) under a Content-Security-Policy that adds only what the README asks for, sent with the HTML page (page) or with every response, scripts and the model worker included, as many production servers do (every response). SSR: the page is rendered on the server with GenClass installed, and importing the one line on the server returns an inert runtime (server fetch untouched, no globals added).

CSP used (bundled apps): default-src 'self'; script-src 'self' 'unsafe-inline' 'wasm-unsafe-eval'; worker-src 'self' blob:; connect-src 'self' ws: https://cdn.jsdelivr.net; style-src 'self' 'unsafe-inline'; img-src 'self' data:; font-src 'self' data:. Script-tag app: default-src 'self'; script-src 'self' 'unsafe-inline' 'wasm-unsafe-eval' https://cdn.jsdelivr.net; worker-src 'self' blob:; connect-src 'self' ws: https://cdn.jsdelivr.net; style-src 'self' 'unsafe-inline'; img-src 'self' data:; font-src 'self' data:.

Never-worse matrix

Each cell shows observe · guard · heal for one data layer and one scenario. ✓ means: on every seed, that mode left the app at least as correct as the same run without GenClass (observe: identical final DOM and server state; guard and heal: no bug introduced, and identical wherever the run without GenClass was correct; a seed runs twice without GenClass, and either run counts), with no new console errors and the model loaded. Click a ✗ for the details.

Scenarios

Every app implements the same eight screens against the same seeded mock backend. Latency is drawn from the seed per request, so every mode of a seed sees the same network.

Automatic state discovery

With the one line, GenClass looks for the app's state on its own (React, Redux, Zustand through the Redux DevTools API). Found state lets it compare a late response with newer data already on screen. Per data layer: what runtime.stores() reported at the end of each GenClass run.

Not covered means the README does not claim discovery for that kind of state: GenClass then sees the network and user input, and decisions that depend on the app's state are not made. With TanStack Query, SWR and Apollo the cache itself is not a store, but the React component state GenClass finds includes what each component reads from it (the useQuery / useSWR result: data and status), observed only. Production builds minify component names, so React stores are named after an element the component renders (compat is the page root's id).

What GenClass reported and did

Per cell: user-visible bugs without GenClass (off, out of the seeds run) and in each mode, then observe detections / guard actions / heal actions summed over seeds. A bug is what a user would see (stale results, a duplicate on the server, a lost note); oracles read only the page and the mock server's state, never GenClass. Fixed: buggy without GenClass, correct in the mode (same seed). Introduced: correct without GenClass, buggy in the mode. In guard and heal GenClass may hold a response for a moment while its model decides (observe never does); on a seed that was already buggy this can change which stale answer ends up on screen without fixing it (listed at the end of the page).

Determinism control

Every seed also ran twice without GenClass. 1170 of 1170 pairs (100%) ended identical (final DOM and server state), so a difference between a mode and off is almost always a real difference.

Details for every ✗

discovery-react-vite-zustand

React 19 + Vite 8 / Zustand 5 (devtools middleware): the Zustand stores (devtools connect) was found in 0 of 240 runs. Stores seen: compat (react), compat_2 (react), tick (react).

Analysis (written after the run): Zustand turns its devtools middleware off in production builds (it connects only when enabled ?? import.meta.env.MODE !== "production"), so a production build never calls the Redux DevTools API that GenClass listens on, and its stores are not found. The same app with devtools(..., { enabled: true }) (the enabled: true row) is found in every run. Nothing changes for the app either way (every scenario cell is ✓); GenClass then sees the network only. The README now says so; alternatively wrap the store with genclass from @genclass/runtime/zustand.

next-app-swr-d-observe

Next.js 16 App Router (SSR) / SWR 2 / scenario d (optimistic update, confirmation, rollback on failure) / observe: 10 runs, 0 incomplete, 0 model not ready, 0 bugs introduced, 1 not identical to the runs without GenClass, 0 with new console errors.

• seed 7: differs from off: DOM todo: off ["Write tests: open","Ship release: open","Fix flaky CI: done"] vs ["Write tests: done","Ship release: open","Fix flaky CI: done"]; actions: none

Analysis (written after the run): A race in the app, not an action: SWR's rollbackOnError with two overlapping optimistic mutations (toggle 1 succeeds, toggle 2 fails 120 ms later) sometimes leaves toggle 1 unchecked on screen although the server has it checked. On seed 7 that happened in both runs without GenClass (and in 1 of 2 in an earlier full run the same day), and in none of the 3 runs with GenClass (observe, guard, heal; 6 of 6 across both full runs). GenClass took no action in any of them (one transient failure detection, passive decisions only); most likely its own main-thread work (observing the requests, deciding about the HTTP 500 in the background) shifts the timing of SWR's rollback against its revalidation (not traced further). So observe mode is not byte-identical to no GenClass on a racy app: it can change which side of an app's own race wins, here towards the correct outcome. No other observe cell differed in this run.

Method

• Apps. One small app per framework under compat/apps/, written idiomatically for each data layer (no GenClass API anywhere: only the one line). They install @genclass/runtime from a tarball packed from this repository (npm pack), so the matrix tests the code as it would be published.
• Backend. One seeded mock server for every app (compat/harness/backend.mjs): REST, a GraphQL endpoint, a WebSocket and EventSource streams on the app's own origin. It injects latency and failures per scenario; nothing in it knows about GenClass.
• A trial. A fresh browser context loads the page (?genclass=off for the run without GenClass; otherwise the mode through window.GENCLASS_CONFIG, telemetry off), waits until the model is ready, drives the scenario with real (trusted) keyboard and mouse input, waits until nothing is in flight and the page has been quiet for 0.9 s, then reads the page and the server's state.
• Pairing. Every mode run is compared with the run without GenClass on the same seed. 10 seeds per cell, plus a second run without GenClass per seed as a determinism control.
• Isolation. Every request to another host is blocked and counted; the model files and ONNX Runtime are served from a local copy of the files the runtime would fetch from jsDelivr, and the script-tag app gets the packed tarball in place of the CDN.
• Not tuned. The runtime and the model are not changed or tuned for these apps, and the apps are not used for training.
• Limits. Small apps, one machine, headless Chromium only (no Firefox or Safari), WASM inference (no GPU), production builds only. Each cell has few seeds; read single differences as signals to investigate, not rates.

Reproduce

On Linux with Node ≥ 22.22.3 (Angular 22's minimum) and about 4 GB free:

git clone https://github.com/genclass-dev/GenClass-lib && cd GenClass-lib
npm ci && (cd compat && npm install && npx playwright install --with-deps chromium)
node packages/runtime/bin/genclass-runtime.mjs fetch-model .cache-model/runtime-model-0.2.0 --variant q8 --ort wasm
COMPAT_MODEL_DIR=$PWD/.cache-model/runtime-model-0.2.0 npm --prefix compat run compat -- --seeds 10

This rebuilds the runtime, packs it, installs it into every app, builds and serves each app, runs every trial and writes compat/results/<date>.json and this page. --apps, --layers, --scenarios, --modes and --workers narrow a run. This page was generated from 2026-10-10.json (5850 trials, 0 did not complete; 16 parallel browsers).