The function passed to createMemo is called regardless of read

[andraaspar]

Hi,

I notice that the function passed to createMemo is called regardless of the value being read or not.

Repro: https://playground.solidjs.com/anonymous/67b97e2b-ab4c-4cbc-b8ce-8ebf0f1e165c

I was surprised by this. It is not mentioned in the docs at https://docs.solidjs.com/reference/basic-reactivity/create-memo . I was trying to track down why my component suspended. Turns out I was making a computed value based on a resource, and even though I wrapped all read operations into Suspense, the component itself was still suspending because of createMemo calling the function outside the template.

I think if there is a reason for this behavior then it should be mentioned in the docs. If there is not, then I would be happy to submit a bug.

What is the case here?

[andraaspar]

I just discovered that the docs recommend using createMemo in place of createEffect here: https://docs.solidjs.com/concepts/derived-values/memos#keep-logic-in-memos

That should be considered. I assumed a memo was like a function: only called when necessary. That page refers to it being like an effect: called up front and then at each change.

[atk]

There is already a community primitive: https://github.com/solidjs-community/solid-primitives/tree/main/packages/memo#createLazyMemo

[andraaspar]

This resolves it, thank you.

[andraaspar]

@atk Neat! I wrote my own in desperation.

Is this a documentation issue then?

[atk]

Our next-gen docs are not yet finished, obviously, but yes, those parts are slightly underdocumented.

[andraaspar]

BTW my workaround was:

import { createMemo } from 'solid-js'

export function createCached(...params) {
  let memo
  return () => {
    if (!memo) {
      memo = createMemo(...params)
    }
    return memo()
  }
}

Is there anything wrong with this approach? Would a dynamically created memo be disposed correctly?

[andraaspar]

I am not sure if I am. It's being used in place of createMemo, but the actual call to createMemo will only execute when the returned function is called. In the template, but not necessarily during the creation of the component. Is that in a reactive scope?

[andraaspar]

Asking because I see that the community implementation is way more complicated: https://github.com/solidjs-community/solid-primitives/blob/6cd7857b5bccb16e68e62d97592980c8bb667f9f/packages/memo/src/index.ts#L389

[atk]

Components have their own reactive context through being rendered; otherwise, you can create it yourself using createRoot. The community variant aims to be isomorphic, i.e. work in a context where the same code might be executed on the server and/or the client.

[andraaspar]

I get that, and sorry to be bothering you. I'm just pulling my hair out because createLazyMemo does not work in my project but the code posted above does, and I could not come up with a test case on the Playground.

[atk]

You're not bothering me at all.