WIP fixed recalc bug?

Author: markerikson

src/hooks/useSelector.ts

@@ -142,15 +142,16 @@ export function createSelectorHook(context = ReactReduxContext): UseSelector {
 
     const latestWrappedSelectorRef = useRef(wrappedSelector)
 
-    console.log(
-      'Writing latest selector. Same reference? ',
-      wrappedSelector === latestWrappedSelectorRef.current
-    )
+    // console.log(
+    //   'Writing latest selector. Same reference? ',
+    //   wrappedSelector === latestWrappedSelectorRef.current
+    // )
     latestWrappedSelectorRef.current = wrappedSelector
 
     const cache = useMemo(() => {
+      console.log('Recreating cache')
       const cache = createCache(() => {
-        console.log('Wrapper cache called: ', store.getState())
+        // console.log('Wrapper cache called: ', store.getState())
         //return latestWrappedSelectorRef.current(trackingNode.proxy as TState)
         return wrappedSelector(trackingNode.proxy as TState)
       })

src/utils/Subscription.ts

@@ -46,11 +46,11 @@ function createListenerCollection() {
           //console.log('Listener: ', listener)
           if (listener.trigger == 'tracked') {
             if (listener.selectorCache!.cache.needsRecalculation()) {
-              console.log('Calling subscriber due to recalc need')
-              // console.log(
-              //   'Calling subscriber due to recalc. Revision before: ',
-              //   $REVISION
-              // )
+              //console.log('Calling subscriber due to recalc need')
+              console.log(
+                'Calling subscriber due to recalc. Revision before: ',
+                $REVISION
+              )
               listener.callback()
               //console.log('Revision after: ', $REVISION)
             } else {
@@ -169,7 +169,7 @@ export function createSubscription(
 
   function notifyNestedSubs() {
     if (store && trackingNode) {
-      //console.log('Updating node in notifyNestedSubs')
+      console.log('Updating node in notifyNestedSubs')
       updateNode(trackingNode, store.getState())
     }
     listeners.notify()

src/utils/autotracking/autotracking.ts

@@ -22,10 +22,12 @@ export class Cell<T> {
   _value: T
   _lastValue: T
   _isEqual: EqualityFn = tripleEq
+  _name: string | undefined
 
-  constructor(initialValue: T, isEqual: EqualityFn = tripleEq) {
+  constructor(initialValue: T, isEqual: EqualityFn = tripleEq, name?: string) {
     this._value = this._lastValue = initialValue
     this._isEqual = isEqual
+    this._name = name
   }
 
   // Whenever a storage value is read, it'll add itself to the current tracker if
@@ -60,7 +62,7 @@ function tripleEq(a: unknown, b: unknown) {
 export class TrackingCache {
   _cachedValue: any
   _cachedRevision = -1
-  _deps: any[] = []
+  _deps: Cell<any>[] = []
   hits = 0
   _needsRecalculation = false
 
@@ -79,20 +81,20 @@ export class TrackingCache {
   }
 
   getValue = () => {
-    console.log('TrackedCache getValue')
+    //console.log('TrackedCache getValue')
     return this.value
   }
 
   needsRecalculation() {
     if (!this._needsRecalculation) {
       this._needsRecalculation = this.revision > this._cachedRevision
     }
-    console.log(
-      'Needs recalculation: ',
-      this._needsRecalculation,
-      this._cachedRevision,
-      this._cachedValue
-    )
+    // console.log(
+    //   'Needs recalculation: ',
+    //   this._needsRecalculation,
+    //   this._cachedRevision,
+    //   this._cachedValue
+    // )
     return this._needsRecalculation
   }
 
@@ -139,9 +141,9 @@ export class TrackingCache {
   }
 
   get value() {
-    console.log(
-      `TrackingCache value: revision = ${this.revision}, cachedRevision = ${this._cachedRevision}, value = ${this._cachedValue}`
-    )
+    // console.log(
+    //   `TrackingCache value: revision = ${this.revision}, cachedRevision = ${this._cachedRevision}, value = ${this._cachedValue}`
+    // )
     // When getting the value for a Cache, first we check all the dependencies of
     // the cache to see what their current revision is. If the current revision is
     // greater than the cached revision, then something has changed.
@@ -168,6 +170,9 @@ export class TrackingCache {
       // dependencies. If any dependency changes, this number will be less
       // than the new revision.
       this._cachedRevision = this.revision
+      this._needsRecalculation = false
+
+      console.log('Value: ', this._cachedValue, 'deps: ', this._deps)
       // }
     }
 
@@ -180,6 +185,10 @@ export class TrackingCache {
   }
 
   get revision() {
+    console.log('Calculating revision: ', {
+      value: this._cachedValue,
+      deps: this._deps.map((d) => d._name),
+    })
     // The current revision is the max of all the dependencies' revisions.
     return Math.max(...this._deps.map((d) => d.revision), 0)
   }
@@ -209,9 +218,10 @@ export function setValue<T extends Cell<unknown>>(
 
 export function createCell<T = unknown>(
   initialValue: T,
-  isEqual: EqualityFn = tripleEq
+  isEqual: EqualityFn = tripleEq,
+  name?: string
 ): Cell<T> {
-  return new Cell(initialValue, isEqual)
+  return new Cell(initialValue, isEqual, name)
 }
 
 export function createCache<T = unknown>(

src/utils/autotracking/proxy.ts

@@ -19,7 +19,7 @@ const proto = Object.getPrototypeOf({})
 
 class ObjectTreeNode<T extends Record<string, unknown>> implements Node<T> {
   proxy: T = new Proxy(this, objectProxyHandler) as unknown as T
-  tag = createTag()
+  tag = createTag('object')
   tags = {} as Record<string, Tag>
   children = {} as Record<string, Node>
   collectionTag = null
@@ -33,7 +33,7 @@ class ObjectTreeNode<T extends Record<string, unknown>> implements Node<T> {
 
 const objectProxyHandler = {
   get(node: Node, key: string | symbol): unknown {
-    console.log('Reading key: ', key, node.value)
+    //console.log('Reading key: ', key, node.value)
 
     function calculateResult() {
       const { value } = node
@@ -64,7 +64,7 @@ const objectProxyHandler = {
         let tag = node.tags[key]
 
         if (tag === undefined) {
-          tag = node.tags[key] = createTag()
+          tag = node.tags[key] = createTag(key)
           tag.value = childValue
         }
 
@@ -96,7 +96,7 @@ const objectProxyHandler = {
 
 class ArrayTreeNode<T extends Array<unknown>> implements Node<T> {
   proxy: T = new Proxy([this], arrayProxyHandler) as unknown as T
-  tag = createTag()
+  tag = createTag('array')
   tags = {}
   children = {}
   collectionTag = null
@@ -191,7 +191,7 @@ export function updateNode<T extends Array<unknown> | Record<string, unknown>>(
   }
 
   for (const key in tags) {
-    console.log('Checking tag: ', key)
+    //console.log('Checking tag: ', key)
     const childValue = (value as Record<string, unknown>)[key]
     const newChildValue = (newValue as Record<string, unknown>)[key]
 
@@ -206,7 +206,7 @@ export function updateNode<T extends Array<unknown> | Record<string, unknown>>(
   }
 
   for (const key in children) {
-    console.log(`Checking node: key = ${key}, value = ${children[key]}`)
+    //console.log(`Checking node: key = ${key}, value = ${children[key]}`)
     const childNode = children[key]
     const newChildValue = (newValue as Record<string, unknown>)[key]
 

src/utils/autotracking/tracking.ts

@@ -2,15 +2,15 @@ import {
   createCell as createStorage,
   getValue as consumeTag,
   setValue,
-  Cell
+  Cell,
 } from './autotracking'
 
 export type Tag = Cell<unknown>
 
 const neverEq = (a: any, b: any): boolean => false
 
-export function createTag(): Tag {
-  return createStorage(null, neverEq)
+export function createTag(name?: string): Tag {
+  return createStorage(null, neverEq, name)
 }
 export { consumeTag }
 export function dirtyTag(tag: Tag, value: any): void {
@@ -35,7 +35,7 @@ export const consumeCollection = (node: Node): void => {
   let tag = node.collectionTag
 
   if (tag === null) {
-    tag = node.collectionTag = createTag()
+    tag = node.collectionTag = createTag(node.collectionTag?._name || 'Unknown')
   }
 
   consumeTag(tag)