arnelenero / simpler-state

The simplest app state management for React
https://simpler-state.js.org
MIT License
478 stars 16 forks source link

Infinite re-render when putting non-serializable objects in entities #25

Closed bgoosmanviz closed 1 year ago

bgoosmanviz commented 1 year ago

This code works as long as I pick a subset of values out of the object. The extension object is non-serializable, with functions in it, in addition to strings and numbers.

// extension.ts
export const extension = entity<any | undefined>(getExtension(), [logger("extension")]);

async function getExtension() {
  const extension = await initExtension({ scope: ExtensionScope.ReadWrite, validateOrigin: () => true });
  // This works 👇
  return _.pick(extension, ["file", "params", "scope", "user", "container"]);
  // This causes an infinite loop 👇
  return extension;
}

// App.tsx
export function App() {
  const extensionJson = extension.use();
  ...
  console.log("☠️ infinite loop");
}
arnelenero commented 1 year ago

Hi. Thanks for posting.

Would you care to share the implementation of your logger plug-in?

bgoosmanviz commented 1 year ago

import { Plugin } from "simpler-state";

export const logger = (name: string): Plugin => { return { set: (origSet, entity) => (...args) => { const prev = entity.get(); origSet(...args);

    console.log(`${name}:`, prev, "-->", entity.get());
  },

init: (origInit, entity) => () => {
  origInit();

  console.log(`[${name}] Initial value:`, entity.get());
},

}; };

On Dec 26, 2022 at 3:31:34 AM, Arnel Enero @.***> wrote:

Hi. Thanks for posting.

Would you care to share the implementation of your logger plug-in?

— Reply to this email directly, view it on GitHub https://github.com/arnelenero/simpler-state/issues/25#issuecomment-1364997206, or unsubscribe https://github.com/notifications/unsubscribe-auth/ASZ3BWOFQACS2PKRGI6T7X3WPFJWNANCNFSM6AAAAAATHAN47A . You are receiving this because you authored the thread.Message ID: @.***>