revalidate() Not Working As Expected

I'm fetching data from Supabase and using their Realtime feature so I can see live updates. To do that I'm using cache(), createAsync(), and revalidate() It looks like this: cache function:
const getNotes = cache(async () => {
"use server";
// get data
const { data } = await supabase.from("notes").select();
// return data
return data;
}, "notes");
const getNotes = cache(async () => {
"use server";
// get data
const { data } = await supabase.from("notes").select();
// return data
return data;
}, "notes");
createAsync function:
const notes = createAsync(() => getNotes());
const notes = createAsync(() => getNotes());
Here's where I'm confused. revalidate() works no matter what value I pass it. So all of these options will revalidate the notes Signal from createAsync. 1. revalidate() 2. revalidate("notes") 3. revalidate("some random string") I only expected option #2 to work. What am I missing? Thanks, Chris
8 Replies
peerreynders
peerreynders3mo ago
Case 1: Works as intended; undefined hits all known caches. Case 3 is the strange one.
GitHub
solid-router/src/data/cache.ts at 57847624fb673003f6f0d8261ca7352ff...
A universal router for Solid inspired by Ember and React Router - solidjs/solid-router
peerreynders
peerreynders3mo ago
Are you on @​solidjs/router 0.13.3 released 8 days ago?
ChrisThornham
ChrisThornham3mo ago
I'm on 0.13.2 Was Case 3 a known bug with 0.13.2? @peerreynders I'd also like to thank you for talking me into learning about cache(), createAsync(). It eliminates so much code! Working with real-time updates is much easier.
peerreynders
peerreynders3mo ago
Not that I'm aware of; it's just that the source is from April 30; so if anything earlier was fixed reviewing the recent code wouldn't help.
peerreynders
peerreynders3mo ago
Are you sure the revalidate is doing it because a actions have a response helper that could do something similar (i.e. try removing the revalidate entirely).
GitHub
solid-router/src/data/action.ts at e773947b85ac78281816e86621a2cdb6...
A universal router for Solid inspired by Ember and React Router - solidjs/solid-router
ChrisThornham
ChrisThornham3mo ago
If I remove revalidate() the update stops working. So I'm quite sure revalidate is allowing the realtime updates to work.
peerreynders
peerreynders3mo ago
A StackBlitz example to demonstrate cache isolation with client side cache usage. Each button can be observed to revalidate in isolation. Then a fresh SolidStart installation with the following modifications:
// file: src/api.ts
import { cache } from '@solidjs/router';
import { get1st, get2nd } from './server/api';

const getFirst = cache(get1st, 'first');
const getSecond = cache(get2nd, 'second');

export { getFirst, getSecond };
// file: src/api.ts
import { cache } from '@solidjs/router';
import { get1st, get2nd } from './server/api';

const getFirst = cache(get1st, 'first');
const getSecond = cache(get2nd, 'second');

export { getFirst, getSecond };
"use server"
// file: src/server/api.ts

let first = 0;
const get1st = () => {
const value = first;
console.log('first', value);
first += 1;
return Promise.resolve(value);
};

let second = 0;
const get2nd = () => {
const value = second;
console.log('second', value);
second += 1;
return Promise.resolve(value);
};

export { get1st, get2nd };

/*
Note: separate instances of this module seem to be instantiated
during SSR and later server function invocations.

That is why the first click doesn't seem to update anything.
The very first server function invocation seems to create its own module instance
so the "first" value returned is "0" (the value already placed on the page via SSR).
*/
"use server"
// file: src/server/api.ts

let first = 0;
const get1st = () => {
const value = first;
console.log('first', value);
first += 1;
return Promise.resolve(value);
};

let second = 0;
const get2nd = () => {
const value = second;
console.log('second', value);
second += 1;
return Promise.resolve(value);
};

export { get1st, get2nd };

/*
Note: separate instances of this module seem to be instantiated
during SSR and later server function invocations.

That is why the first click doesn't seem to update anything.
The very first server function invocation seems to create its own module instance
so the "first" value returned is "0" (the value already placed on the page via SSR).
*/
It demonstrates the same behaviour (nothing changes with node .output/server/index.mjs on the production build). So there is something funky going on with your setup.
peerreynders
StackBlitz
solidjs/router cache isolation - StackBlitz
external.ts holds a link object that flipper.ts sends NavigationEvents to which are forwarded to the root component in app.tsx
ChrisThornham
ChrisThornham3mo ago
Thank you @peerreynders I'll dig through this!