lemonad Comments - Answer Overflow

lemonad

•Created by lemonad on 4/21/2025 in #support

Untrack on store arrays

So there’s no way to untrack arrays in stores? I tried untracking the length and each individual index before reading but that did not help.

4 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

Edit: No, it turns out to be different (I intercept it during prop passing and use a different signal downstream) – I think I have this down now. Thanks everyone : ) ~~I have one other case where I have a type { max: number, min: number } | undefined where I update the store as originally posted. Which seems to trigger the following effect every time:~~

createEffect(
+     on(
+       () => props.trackingDepth,
+       (td) => {
+         console.log(td);
+       },
+     ),
+   );

createEffect(
+     on(
+       () => props.trackingDepth,
+       (td) => {
+         console.log(td);
+       },
+     ),
+   );

~~so there is something I'm still missing with the shallow merge. Really sorry if you've already answered it and I've missed it or not understood it.~~

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

I think I need to find all places where I trigger effects with on or similar where the effect is dependent on e.g. store.a and where a is an object. It might be just this single instance and that's why I haven't run into this earlier.

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

Oh, targets is an array though. Perhaps that's the thing.

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

That is, I think I understand what's going on in the original case and the explanations make a lot of sense. Reading it, I would have thought that the above example should only trigger the effect when going from undefined to an object but not when replacing the object.

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

[Edit: See next message] Still, what I don't understand is why this only breaks in this specific case. I've got other places where I do the exact same thing and it seems to work fine. Is the underlying problem that I set the value in two different places? That is,

const onReceivedTargets = (msg: unknown, ack: undefined | (() => void)) => {
  ...
  setTargets(result.data);
};
...
<SubComponent targets={globalStore.targets} />

const onReceivedTargets = (msg: unknown, ack: undefined | (() => void)) => {
  ...
  setTargets(result.data);
};
...
<SubComponent targets={globalStore.targets} />

and then

createEffect(
    on(
      () => props.targets,
      (targets) => {

createEffect(
    on(
      () => props.targets,
      (targets) => {

works as expected. I'm still not sure I understand when it works and when it does not work.

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

It might seem like a weird design (and it could very well still be : ) The solid-js app speaks directly to an embedded device without internet access so for the most part there is one server and one client. The app provides real-time control for the operator and many of these messages arrive around 30 times a second.

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

@zulu Thanks a lot for the detailed reply. It looks like the spread does exactly what i need, i.e. one level of reactivity – no more, no less.

createEffect(() => {
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
  const x = { ...(props.nearestPointConfig ?? {}) };

createEffect(() => {
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
  const x = { ...(props.nearestPointConfig ?? {}) };

Slightly OT: what I haven't yet figured out is how to get reasonable code using on with the same construct:

createEffect(
  on(
    { ...props.nearestPointConfig },
    (config: unknown) => { <-- !

createEffect(
  on(
    { ...props.nearestPointConfig },
    (config: unknown) => { <-- !

Since { ...undefined } gives me {}, I get an object with all members optional, which is not exactly what i want.

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

Thanks for the answer, it makes sense now. For me, the problem is probably not so much that I don't understand fine-grained reactivity (I've been using solid-js for a long time but still have many knowledge gaps). It is more that I don't know what I don't know in this case. I could very well have been blissfully unaware and lucky so things have just worked – and I've drawn the wrong conclusions from it : ) With signals, I think types such as { names: string, areas: AreaType[] } | undefined trigger effects when set and there is no deep, nested reactivity to consider. I hope : ) What I didn't like using lots of individual signals was to prop pass those around as much so I wanted a context and I chose a store for it. I figured as long as I always replaced e.g. store.a as a whole, I would get the same behavior as the previously used signals. Which does not seem to be the case. I need something in between a signal and a store : )

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

I've recently implemented this global store to avoid passing props everywhere so in some regards it is different to how I use stores in other places. Perhaps I've just been lucky this far : )

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

What is the takeaway here? That when I use a store, I should always track things by the leaves of the tree to be certain it works?

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

Thanks for the example @zulu! I now understand why using console.log on a structure is not the best choice for debugging this : ) However, if you don't mind, what makes one update different from the other in my case? It seems I update the store in exactly the same way two times but only one works for both. Given your example, I could see my second createEffect never working but sometimes it does, which confuses me

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

Yes! Thank you for your help : )

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

Perhaps not the right term here but hopefully you understand what I meant : )

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

@zulu Sorry, I meant destructuring was counterintuitive and was wondering how you came up with that as a solution

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

@zulu Wow, thanks! For me it seems totally counterintuitive to do {...props.nearestPointConfig}, how did you come up with it?

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

Hmm, it doesn't seem to happen in your playground so you might be on to something with having to do with how I update the values. If you get the chance, please take a look and see if there's something that is odd with that or the way I set up the context.

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

Console was cleared
effect undefined
effect 2 undefined
Timeout 1
effect {name: 'hello', areas: Array(1)}
effect 2 {name: 'hello', areas: Array(1)}
Timeout 2
effect {name: 'hello', areas: Array(1)}

Console was cleared
effect undefined
effect 2 undefined
Timeout 1
effect {name: 'hello', areas: Array(1)}
effect 2 {name: 'hello', areas: Array(1)}
Timeout 2
effect {name: 'hello', areas: Array(1)}

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

@peerreynders Okay, I managed to replicate it now: https://playground.solidjs.com/anonymous/18509665-99be-4412-8209-3cb410f8a3c5 (updated link)

31 replies

SSolidJS

•Created by lemonad on 4/19/2025 in #support

createEffect vs createEffect + on

@peerreynders Oh, I think I found something now, even though it does not make a lot of sense. I have two different socket.io message handlers where I set the value of nearestPointConfig. If the first one updates the value, I get both "effect" and "effect 2" outputs but if the other one is doing the updating, I get only the "effect" output. The values I set look no different from each other.

31 replies

Gaming

Programming