peerreynders
peerreynders
SSolidJS
Created by Hussein on 7/5/2024 in #support
how do i dedupe requests without `cache`?
Another idea:
45 replies
SSolidJS
Created by Hussein on 7/6/2024 in #support
is this a good pattern?
If the router isn't smart enough you should be able to have a simple isLoggedIn "use server" function inside a createAsync (i.e. no cache) that can trigger the <Show /> fallback once it resolves. Personally I'd look into managing the user info in a context value that could flip a separate loggedIn memo flag based on what is going on. That way the <Login /> route component could get that info without a server round trip.
29 replies
SSolidJS
Created by Hussein on 7/6/2024 in #support
is this a good pattern?
but i will call getUser() in login too right?
Fair enough, the redirect would interfere - though I haven't tried it, the router may be smart enough to handle that.
29 replies
SSolidJS
Created by Hussein on 7/6/2024 in #support
is this a good pattern?
That's is why the approaches are asymmetric. Throwing a redirect covers the majority case of any component needing a logged in user. If there is no logged in user, you get out of Dodge. On the other hand first load onto /login when there is a logged in user is the minority case. There is no need to log in, so you simply <Navigate /> away from the <Login/> route component.
29 replies
SSolidJS
Created by Hussein on 7/6/2024 in #support
is this a good pattern?
Where are getting that from? You are only using one getUser cache.
29 replies
SSolidJS
Created by Hussein on 7/6/2024 in #support
is this a good pattern?
There are two separate requirements: - Redirection to /login from /home (or any other protected route) if the user is not logged in. This is the majority case covered by throwing a redirect. - Redirection to /home from /login if the user is logged in. This is the minority case covered by <Navigate />. Also using && inside JSX like that is an React-ism.
29 replies
SSolidJS
Created by Hussein on 7/6/2024 in #support
is this a good pattern?
Your OP doesn't address that either
export default function Login() {
const user = createAsync(() => getUser());

return (
<Show when={!user()} fallback={() => <Navigate href="/home" />}>
<div>Login</div>
</Show>
);
}
export default function Login() {
const user = createAsync(() => getUser());

return (
<Show when={!user()} fallback={() => <Navigate href="/home" />}>
<div>Login</div>
</Show>
);
}
Does the asymmetry of the approaches bother you?
29 replies
SSolidJS
Created by Hussein on 7/5/2024 in #support
how do i dedupe requests without `cache`?
45 replies
SSolidJS
Created by Hussein on 7/5/2024 in #support
how do i dedupe requests without `cache`?
Fixed preload:
45 replies
SSolidJS
Created by Hussein on 7/5/2024 in #support
how do i dedupe requests without `cache`?
its not as complex as u think it is
And yet this topic exists … How does this work for you?
45 replies
SSolidJS
Created by Hussein on 7/5/2024 in #support
how do i dedupe requests without `cache`?
How do you propose to dedupe without a staleness window?
45 replies
SSolidJS
Created by Hussein on 7/5/2024 in #support
how do i dedupe requests without `cache`?
That's because for bfcache cache lasts 5 minutes. So in fact you want to dedup less, fetch more. Backward/Forward are browser controls - not application controls. They are designed to provide stale views from the bfcache without additional fetches. So caches behaviour is in line with browser design. Perhaps Backward/Forward aren't intended for the purpose you are trying to use them for.
45 replies
SSolidJS
Created by Hussein on 7/5/2024 in #support
how do i dedupe requests without `cache`?
createAsync(), cache() and load() were purposefully designed to work in concert to enable fast navigation, avoid waterfalls and duplicate fetches. Deduping is the primary purpose of the cache wrapper which is why this topic's title is confusing. Why would you want to “dedupe requests without cache” when that is cache's reason for existence?
even though i don't need all its behavior.
What exactly is the behaviour you don't need (or don't want)? The only thing I can come up with is that it fetches when another createAsync attaches once the 5 second window of the last fetch has passed. So don't ever let more than one createAsync attach to the cache point. Rather than having each component attach to the cache point separately with their own createAsync have them build on top of the singular createAsync point that you expose instead of the cache point. You still get load() on preload and fetch on navigate if you warm the cache point in the load().
45 replies
SSolidJS
Created by Hussein on 7/5/2024 in #support
how do i dedupe requests without `cache`?
I still don't understand what your beef with cache is. I cannot find evidence of the claims you make in your OP. Starting with a basic SolidStart install: - Add src/api.tsx - Move src/routes/about.tsx to src/routes/abouts/[id].tsx and apply the modifications indicated. - Alter the link in src/app.tsx to <a href="/about/10">About</a> Then: 1. During SSR the fetch is run once on the server. It doesn't rerun on the client. 2. Once it is older than 5 seconds and a new consumer connects to the cache point the data is refreshed-updating all connected consumers. 3. On hover the preload starts the fetch and it runs exactly once:
preload: person 10
done fetching 10
navigate: person 10
preload: person 10
done fetching 10
navigate: person 10
So there are no duplicate fetches …
45 replies
SSolidJS
Created by Hussein on 7/5/2024 in #support
how do i dedupe requests without `cache`?
The <Router /> component has a preload prop - so that's the global option.
45 replies
SSolidJS
Created by 𝔐𝔞𝔱𝔱𝔦𝔫 on 7/5/2024 in #support
Why is this not reactive? (using signal + html open attribute)
Because one has to think of that first: https://playground.solidjs.com/anonymous/5894f9a2-aa5e-4106-b79d-aa2c843143bf Seriously people complain about Solid's documentation but I think MDN could benefit from more expansive examples as well.
22 replies
SSolidJS
Created by 𝔐𝔞𝔱𝔱𝔦𝔫 on 7/5/2024 in #support
Why is this not reactive? (using signal + html open attribute)
There was actually a 4ms minimum wait on setTimeout() to prevent client fingerprinting but they seemed to have eased up on that recently.
22 replies
SSolidJS
Created by 𝔐𝔞𝔱𝔱𝔦𝔫 on 7/5/2024 in #support
Why is this not reactive? (using signal + html open attribute)
The microtask queue is where resolved promises are scheduled - so (resolved) promises can block UI. setTimeout is considered a macrotask. https://vimeo.com/254947206
22 replies
SSolidJS
Created by 𝔐𝔞𝔱𝔱𝔦𝔫 on 7/5/2024 in #support
Why is this not reactive? (using signal + html open attribute)
The previous example used queueMicrotask - it turned out that the details open prop hadn't been updated by then so I had to wait until the next cycle of the event loop. I didn't try requestAnimationFrame().
22 replies