migrate unstable_buildProxyFunction to unstable_replaceInternalFunction

[wenerme]

by unstable_buildProxyFunction

const canProxyOrig = unstable_buildProxyFunction()[5];
export const proxyWithCompare = unstable_buildProxyFunction(deepEqual, undefined, (x) => {
  if (isReactComponent(x)) {
    // react
    return false;
  }
  if (typeof EventTarget !== 'undefined' && x instanceof EventTarget) {
    // dom
    return false;
  }

  // refSet.has, isArray && !iterator, WeakMap, WeakSet, Error, Number, Date, String, RegExp, ArrayBuffer
  return canProxyOrig(x);
})[0];

the new proxyWithCompare will replace the objectIs and canProxy,
but unstable_replaceInternalFunction('objectIs') will replace the global objectIs, this affect the later proxy.

is this the new way to do this ?

export function proxyWithCompare(o: any) {
  const prevs: Record<string, any> = {};
  unstable_replaceInternalFunction('objectIs', (prev) => {
    prevs.objectIs = prev;
    return deepEqual;
  });
  unstable_replaceInternalFunction('canProxy', (prev) => {
    prevs.canProxy = prev;
    return (x) => {
      if (isReactComponent(x)) {
        // react
        return false;
      }
      if (typeof EventTarget !== 'undefined' && x instanceof EventTarget) {
        // dom
        return false;
      }
      return prev(x);
    };
  });
  let p = proxy(o);

  Object.entries(prevs).forEach(([k, v]) => {
    unstable_replaceInternalFunction(k as 'objectIs', () => v);
  });
  return p;
}

[dai-shi]

Thanks for opening up a discussion.

but unstable_replaceInternalFunction('objectIs') will replace the global objectIs, this affect the later proxy.

Yeah, avoiding changing globals was originally my strong motivation back then, but I kind of gave it up. The new one should be more maintainable and more capable.

is this the new way to do this ?

wow, good idea.
it almost works, but it actually doesn't work as before for the case when you have a new nested proxy after the creation. If that's the goal, we might need to handle something in the core.

[wenerme]

but it actually doesn't work as before for the case when you have a new nested proxy after the creation

Seems this may cause problem, is that mean this const a = proxyWithCompare({}); a.b={b:{}};a.b.b={} will not go throught the objectIs hook, I hope valtio can hold these hooks in a scope.

[dai-shi]

I understand the requirement, but also wonder if there's an alternative way without such a scope. We can now customize the proxy handler, so there might be a way. It's like a puzzle. 🤔