refactor(zero-solid): reconcile changes to data due to query changes #4559

grgbkr · 2025-06-30T23:30:41Z

Starting from this PR contribution: #4474

Prior to this change the zero-solid integration created a new store whenever a query changed.
This caused everything depending on the store to be disposed and recreated, instead of receiving granular updates.
This PR ensures that every createQuery call only creates a store the first time and passes on the setter to the view, and the view is responsible for reconciling data when there's large changes.

Add a ZeroProvider and useZero so that the zero instance can be accessed through context, ZeroProvider can take a signal for a ZeroOptions or a Zero instance.
useZero return a signal of Zero instance since the signal to ZeroProvider can change the ZeroOptions or Zero instance.
Un-deprecate useQuery since it now requires context. Deprecates createQuery instead. useX is a good convention to communicate that this should be called inside a component and not outside.
Added createUseZero to prevent redundant annotations, and so the api mirror's React's apis much more closely.

Next steps:

Use solid's reconcile utility to achieve granular updates for they initial hydration of a changed query. This will require adding synthetic ids to rows.
Update docs

vercel · 2025-06-30T23:30:46Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
replicache-docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jul 1, 2025 8:33pm
zbugs	✅ Ready (Inspect)	Visit Preview		Jul 1, 2025 8:33pm

github-actions · 2025-06-30T23:31:44Z

Bencher Report

Branch	grgbkr/solid-reconcile
Testbed	Linux

Click to view all benchmark results

Benchmark	Throughput	Benchmark Result operations / second (ops/s) x 1e3 (Result Δ%)	Lower Boundary operations / second (ops/s) x 1e3 (Limit %)
src/client/custom.bench.ts > big schema	📈 view plot 🚷 view threshold	338.03 ops/s x 1e3 (-4.78%) Baseline: 355.02 ops/s x 1e3	327.67 ops/s x 1e3 (96.93%)
src/client/zero.bench.ts > basics > All 1000 rows x 10 columns (numbers)	📈 view plot 🚷 view threshold	1.62 ops/s x 1e3 (+1.94%) Baseline: 1.59 ops/s x 1e3	1.55 ops/s x 1e3 (95.53%)
src/client/zero.bench.ts > pk compare > pk = N	📈 view plot 🚷 view threshold	29.92 ops/s x 1e3 (-1.38%) Baseline: 30.34 ops/s x 1e3	29.54 ops/s x 1e3 (98.70%)
src/client/zero.bench.ts > with filter > Lower rows 500 x 10 columns (numbers)	📈 view plot 🚷 view threshold	2.53 ops/s x 1e3 (+0.95%) Baseline: 2.51 ops/s x 1e3	2.44 ops/s x 1e3 (96.39%)

🐰 View full continuous benchmarking report in Bencher

grgbkr · 2025-07-01T03:13:29Z

FYI @devagrawal09

devagrawal09 · 2025-07-01T03:59:37Z

Thanks for creating this PR. What's the plan for adding ids?
We don't need every row inside the view tree to be identifiable, we only need objects inside the same array to be identifiable among its siblings. it's okay for nested stuff to have the same ids.

Also is it possible that when a new query is constructed, the data returned from zero has the same references? We might not need ids if the data is always kept in memory by zero and reused across queries, because reconcile understands references and is able to key them automatically.

arv · 2025-07-01T08:17:47Z

same references

We can definitely do same references. That might be simpler and more performant

github-actions · 2025-07-01T08:36:16Z

Bencher Report

Branch	grgbkr/solid-reconcile
Testbed	Linux

Click to view all benchmark results

Benchmark	File Size	Benchmark Result kilobytes (KB) (Result Δ%)	Upper Boundary kilobytes (KB) (Limit %)
zero-package.tgz	📈 view plot 🚷 view threshold	1,209.32 KB (+0.01%) Baseline: 1,209.18 KB	1,233.36 KB (98.05%)
zero.js	📈 view plot 🚷 view threshold	199.60 KB (0.00%) Baseline: 199.60 KB	203.59 KB (98.04%)
zero.js.br	📈 view plot 🚷 view threshold	55.91 KB (0.00%) Baseline: 55.91 KB	57.03 KB (98.04%)

🐰 View full continuous benchmarking report in Bencher

arv · 2025-07-01T09:22:45Z

packages/zero-solid/package.json

    "@rocicorp/eslint-config": "^0.7.0",
    "@rocicorp/prettier-config": "^0.3.0",
    "@solidjs/testing-library": "^0.8.10",
+    "jsdom": "^26.1.0",


Why? We are running the tests in a real browser, no?

arv · 2025-07-01T09:28:58Z

packages/zero-solid/src/solid-view.ts


-const complete = {type: 'complete'} as const;
-const unknown = {type: 'unknown'} as const;
+export const COMPLETE: QueryResultDetails = {type: 'complete'} as const;


Maybe we should freeze these to prevent more surprises

done. this actually modifies solid's behavior as it checks for frozen objects and copies them, but i think its best not to rely on it.

arv · 2025-07-01T09:29:37Z

packages/zero-solid/src/solid-view.ts

-    [this.#state, this.#setState] = createStore<State>([
+
+    this.#setState = setState;
+    const s = [


arv · 2025-07-01T09:32:49Z

packages/zql/src/query/query-impl.ts

remove commented out logs

packages/zero-solid/vitest.config.ts

arv · 2025-07-01T09:36:58Z

packages/zero-solid/src/solid-view.test.ts

+  const [state, setState] = createStore<State>([
+    {
+      '': undefined,
+    },
+    {type: 'unknown'},
+  ]);
+  const data = () => state[0][''];


Maybe const {data, state, setState} = createTestStore()

arv · 2025-07-01T09:50:26Z

packages/zero-solid/src/use-zero.ts

+  MD extends CustomMutatorDefs<S> | undefined = undefined,
+>(props: {
+  children: JSX.Element;
+  zeroSignal: () => ZeroOptions<S, MD> | {zero: Zero<S, MD>};


I find this type a bit strange. I want the props to be called zero and options.

Is this how the React one is done?

I fixed this to more closely match the React API. So its either:

<ZeroProvider zero={zero}>...</ZeroProvider>

or

<ZeroProvider server="https://foo.com" userID="u1" schema={schema}>...</ZeroProvider>

packages/zero-solid/src/use-zero.ts

arv · 2025-07-01T09:52:05Z

packages/zero-solid/src/use-zero.test.tsx

+  });
+  // eslint-disable-next-line @typescript-eslint/naming-convention
+  const MockZeroProvider = (props: {children: JSX.Element}) => (
+    <ZeroProvider zeroSignal={zeroOptions}>{props.children}</ZeroProvider>


Suggested change

<ZeroProvider zeroSignal={zeroOptions}>{props.children}</ZeroProvider>

<ZeroProvider options={zeroOptions}>{props.children}</ZeroProvider>

I hope

i made this match the React version, so it would be something like:

<ZeroProvider server="https://foo.com" userID="u1" schema={schema}>

arv · 2025-07-01T09:53:08Z

packages/zero-solid/src/use-zero.test.tsx

+  });
+  // eslint-disable-next-line @typescript-eslint/naming-convention
+  const MockZeroProvider = (props: {children: JSX.Element}) => (
+    <ZeroProvider zeroSignal={zeroSignal}>{props.children}</ZeroProvider>


Suggested change

<ZeroProvider zeroSignal={zeroSignal}>{props.children}</ZeroProvider>

<ZeroProvider zero={zeroSignal}>{props.children}</ZeroProvider>

grgbkr · 2025-07-01T19:09:20Z

packages/zero-solid/src/use-zero.ts

+
+  return ZeroContext.Provider({
+    value: zero,
+    get children() {


so it seems this getter for children was the secret sauce... but why?

Why does the following not work

return ZeroContext.Provider({ value: zero, children: props.children });

Should value also be a getter? There is still something fundamental about solidjs that i dont grok.

Ah you can't use JSX here

In that case the getter is correct.
value would also need to be a getter.

In solid when you access something from the props like props.value inside a reactive scope, it needs to behave similar to accessing a signal value() so that it can be tracked as a dependency. So the JSX transform changes <A b={c()} /> to A({ get b() { return c{} } }).

This makes sure that every property passed through the component tree can be tracked independently.

children needs to be a getter to get the state tracking.

In the case of value, zero is already a signal so there is no need to use a getter.

devagrawal09 · 2025-07-01T19:17:35Z

packages/zero-solid/src/use-zero.ts

+  return ZeroContext.Provider({
+    value: zero,
+    get children() {
+      return props.children;
+    },
+  });


Suggested change

return ZeroContext.Provider({

value: zero,

get children() {

return props.children;

},

});

return <ZeroContext.Provider value={zero()}>

{props.children}

</ZeroContext.Provider>

You should be able to do just this

https://docs.solidjs.com/concepts/context#context

We need to avoid using JSX here as esbuild doesn't seem able to build a library that uses both React JSX and Solid JSX (at least we couldn't figure it out).

grgbkr · 2025-07-01T20:31:29Z

Thanks for creating this PR. What's the plan for adding ids? We don't need every row inside the view tree to be identifiable, we only need objects inside the same array to be identifiable among its siblings. it's okay for nested stuff to have the same ids.

Also is it possible that when a new query is constructed, the data returned from zero has the same references? We might not need ids if the data is always kept in memory by zero and reused across queries, because reconcile understands references and is able to key them automatically.

We do return the same references for rows that haven't changed. Let me do some testing and see if i can reconcile based on references working.

…ata on query change and transaction commit

…cate `useQuery`

…omputed and enhance reconcile options

arv · 2025-07-02T07:48:40Z

We do return the same references for rows that haven't changed. Let me do some testing and see if i can reconcile based on references working.

We should also be able to "merge" the rows that changed if the primary keys didn't change. This can be dealt with in applyChange.

arv

LGTM

arv · 2025-07-02T07:59:58Z

packages/zero-solid/src/use-query.test.tsx

+    });
+    createEffect(() => {
+      const details = resultDetails();
+      details.type;


I guess it does set up the tracking?

yeah necessary to set up the tracking

arv · 2025-07-02T08:13:09Z

packages/zero-solid/src/use-zero.test.tsx

Very nice and extensive tests!

arv · 2025-07-02T08:14:19Z

packages/zero-solid/src/use-zero.ts

+  return zero ?? (() => undefined);
+}
+
+export function createUseZero<


This could use some JSDoc.

grgbkr · 2025-07-03T23:05:54Z

Thanks for creating this PR. What's the plan for adding ids? We don't need every row inside the view tree to be identifiable, we only need objects inside the same array to be identifiable among its siblings. it's okay for nested stuff to have the same ids.
Also is it possible that when a new query is constructed, the data returned from zero has the same references? We might not need ids if the data is always kept in memory by zero and reused across queries, because reconcile understands references and is able to key them automatically.

We do return the same references for rows that haven't changed. Let me do some testing and see if i can reconcile based on references working.

@devagrawal09 @arv
The reference based approach isn't going to work due to some other work I'm doing to modify rows in place to achieve sub-row level precise reactivity. I got the idSymbol w synthetic id working. #4575

… changes (#4575) This is a follow up to: #4559 To effectively use solidjs's `reconcile` utility it was necessary to add a consistent identity key to every row in the view.

arv · 2025-07-08T23:47:18Z

@devagrawal09 Should we file a bug/pr on Solid to allow the key to be a symbol?

grgbkr requested a review from arv June 30, 2025 23:30

vercel bot deployed to Preview – replicache-docs July 1, 2025 00:31 View deployment

vercel bot had a problem deploying to Preview – zbugs July 1, 2025 00:31 Failure

grgbkr mentioned this pull request Jul 1, 2025

refactor(zero-solid): SolidView reconciles large changes to data #4474

Closed

vercel bot deployed to Preview – replicache-docs July 1, 2025 08:34 View deployment

vercel bot deployed to Preview – zbugs July 1, 2025 08:35 View deployment

vercel bot deployed to Preview – replicache-docs July 1, 2025 09:22 View deployment

vercel bot deployed to Preview – zbugs July 1, 2025 09:23 View deployment

vercel bot deployed to Preview – replicache-docs July 1, 2025 09:32 View deployment

vercel bot deployed to Preview – zbugs July 1, 2025 09:33 View deployment

arv reviewed Jul 1, 2025

View reviewed changes

grgbkr commented Jul 1, 2025

View reviewed changes

devagrawal09 reviewed Jul 1, 2025

View reviewed changes

grgbkr force-pushed the grgbkr/solid-reconcile branch from 3c5e68f to 3489205 Compare July 1, 2025 19:37

vercel bot deployed to Preview – replicache-docs July 1, 2025 19:37 View deployment

vercel bot deployed to Preview – zbugs July 1, 2025 19:38 View deployment

vercel bot deployed to Preview – replicache-docs July 1, 2025 20:29 View deployment

vercel bot deployed to Preview – zbugs July 1, 2025 20:30 View deployment

devagrawal09 added 5 commits July 1, 2025 13:32

refactor(zero-solid): update createQuery and SolidView to reconcile d…

24cb9be

…ata on query change and transaction commit

feat(zero-solid): replacing createZero with ZeroProvider, undepre…

7be9376

…cate `useQuery`

refactor(zero-solid): update createQuery and SolidView to use createC…

f829fd7

…omputed and enhance reconcile options

reconcile no more

b289f76

zero context optional for backwards compatibility

d5189ed

grgbkr added 5 commits July 1, 2025 13:32

get rid of view sharing, fix tests, expand tests

4c23019

test

a570edd

logic for closing zero, and cleanup logic

de8a541

deprecations and renames

01d5b80

cleanup

40fe936

grgbkr force-pushed the grgbkr/solid-reconcile branch from 4d27167 to 40fe936 Compare July 1, 2025 20:32

vercel bot deployed to Preview – replicache-docs July 1, 2025 20:32 View deployment

vercel bot deployed to Preview – zbugs July 1, 2025 20:33 View deployment

grgbkr enabled auto-merge (squash) July 1, 2025 20:36

grgbkr merged commit 24d81c6 into main Jul 1, 2025
12 of 13 checks passed

grgbkr deleted the grgbkr/solid-reconcile branch July 1, 2025 20:39

arv reviewed Jul 2, 2025

View reviewed changes

grgbkr mentioned this pull request Jul 3, 2025

perf(zero-solid): use reconcile to minimize reactive changes on query changes #4575

Merged

	<ZeroProvider zeroSignal={zeroOptions}>{props.children}</ZeroProvider>
	<ZeroProvider options={zeroOptions}>{props.children}</ZeroProvider>

	<ZeroProvider zeroSignal={zeroSignal}>{props.children}</ZeroProvider>
	<ZeroProvider zero={zeroSignal}>{props.children}</ZeroProvider>

refactor(zero-solid): reconcile changes to data due to query changes #4559

refactor(zero-solid): reconcile changes to data due to query changes #4559

Uh oh!

Conversation

grgbkr commented Jun 30, 2025

Uh oh!

vercel bot commented Jun 30, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Jun 30, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

grgbkr commented Jul 1, 2025

Uh oh!

devagrawal09 commented Jul 1, 2025

Uh oh!

arv commented Jul 1, 2025

Uh oh!

github-actions bot commented Jul 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

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!

grgbkr Jul 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

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!

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!

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!

arv Jul 2, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

devagrawal09 Jul 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

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!

grgbkr commented Jul 1, 2025

Uh oh!

Uh oh!

arv commented Jul 2, 2025

Uh oh!

arv left a comment

Choose a reason for hiding this comment

vercel bot commented Jun 30, 2025 •

edited

Loading

github-actions bot commented Jun 30, 2025 •

edited

Loading

github-actions bot commented Jul 1, 2025 •

edited

Loading

grgbkr Jul 1, 2025 •

edited

Loading

arv Jul 2, 2025 •

edited

Loading

devagrawal09 Jul 1, 2025 •

edited

Loading