leaner 0.0.1 → 0.1.1

package/dist/core.js

@@ -11,6 +11,34 @@ function isPlainObjectOrArray( value ) {
   return isPlainObject( value ) || Array.isArray( value );
 }
 
+let scheduled = null;
+
+function schedule( callback ) {
+  scheduleWatcher( createWatcher( null, callback, true ) );
+}
+
+function scheduleWatcher( watcher ) {
+  if ( scheduled == null ) {
+    scheduled = new Set();
+    Promise.resolve().then( runSchedule );
+  }
+
+  scheduled.add( watcher );
+}
+
+function runSchedule() {
+  if ( scheduled != null ) {
+    const watchers = scheduled.values();
+    scheduled = null;
+
+    for ( const watcher of watchers ) {
+      const callback = watcher.callback;
+      if ( callback != null )
+        callback();
+    }
+  }
+}
+
 let deps = null;
 
 function track( record ) {
@@ -19,9 +47,14 @@ function track( record ) {
 }
 
 function react( record ) {
-  if ( record.watches != null ) {
-    for ( const watch of record.watches.values() )
-      watch();
+  for ( const watcher of record.values() ) {
+    const callback = watcher.callback;
+    if ( callback != null ) {
+      if ( watcher.async )
+        scheduleWatcher( watcher );
+      else
+        callback();
+    }
   }
 }
 
@@ -45,21 +78,63 @@ function addDeps( newDeps ) {
   }
 }
 
-function updateDeps( newDeps, deps, callback ) {
-  for ( const dep of newDeps ) {
-    if ( dep.watches == null )
-      dep.watches = new Set();
-    dep.watches.add( callback );
-    if ( deps != null )
-      deps.delete( dep );
+let current = null;
+
+function withScope( scope, callback ) {
+  const old = current;
+  current = scope;
+
+  try {
+    return callback();
+  } finally {
+    current = old;
   }
+}
+
+function createWatcher( deps, callback, async ) {
+  const watcher = {
+    deps,
+    callback,
+    async,
+  };
+
+  if ( current != null )
+    current.push( watcher );
 
   if ( deps != null ) {
-    for ( const dep of deps )
-      dep.watches.delete( callback );
+    for ( const dep of deps ) {
+      dep.add( watcher );
+    }
   }
 
-  return newDeps;
+  return watcher;
+}
+
+function updateWatcher( watcher, deps ) {
+  for ( const dep of deps ) {
+    dep.add( watcher );
+    if ( watcher.deps != null )
+      watcher.deps.delete( dep );
+  }
+
+  if ( watcher.deps != null ) {
+    for ( const dep of watcher.deps )
+      dep.delete( watcher );
+  }
+
+  watcher.deps = deps;
+}
+
+function destroyScope( scope ) {
+  for ( const watcher of scope ) {
+    watcher.callback = null;
+
+    if ( watcher.deps != null ) {
+      for ( const dep of watcher.deps )
+        dep.delete( watcher );
+      watcher.deps = null;
+    }
+  }
 }
 
 const stateGetterHandler = {
@@ -73,94 +148,76 @@ const stateGetterHandler = {
   },
 };
 
-const stateGetterRecords = new WeakMap();
+const stateGetterCache = new WeakMap();
 
 function stateGetterGet( target, prop ) {
   if ( prop === 'get' ) {
     return arg => {
       if ( typeof arg == 'function' )
-        return createDynamicStateRecord( target, arg ).proxy;
+        return createDynamicStateGetterProxy( target, arg );
       else
-        return createChildStateRecord( target, arg ).proxy;
+        return createChildStateGetterProxy( target, arg );
     };
   }
 
   if ( prop === Symbol.toPrimitive )
     throw new Error( 'Using a state getter as a primitive value is not allowed' );
 
-  return createChildStateRecord( target, prop ).proxy;
+  return createChildStateGetterProxy( target, prop );
 }
 
-function stateGetterApply( target ) {
-  const value = target();
-
-  if ( isPlainObjectOrArray( value ) ) {
-    const record = stateGetterRecords.get( target );
-    return createReaderRecord( record, value ).proxy;
-  }
-
-  return value;
-}
-
-function createRecord( prop, getter ) {
-  return {
-    prop,
-    target: getter,
-    proxy: new Proxy( getter, stateGetterHandler ),
-    children: null,
-    reader: null,
-    watches: null,
-  };
+function createRootStateGetterProxy( getter ) {
+  return new Proxy( getter, stateGetterHandler );
 }
 
-function createRootStateRecord( getter ) {
-  const record = createRecord( '(root)', getter );
+function createChildStateGetterProxy( target, prop ) {
+  let cache = stateGetterCache.get( target );
 
-  stateGetterRecords.set( getter, record );
-
-  return record;
-}
-
-function createChildStateRecord( target, prop ) {
-  const record = stateGetterRecords.get( target );
+  if ( cache == null ) {
+    cache = Object.create( null );
+    stateGetterCache.set( target, cache );
+  }
 
-  if ( record.children != null && record.children[ prop ] != null )
-    return record.children[ prop ];
+  let proxy = cache[ prop ];
 
-  if ( record.children == null )
-    record.children = Object.create( null );
+  if ( proxy == null ) {
+    proxy = new Proxy( getter, stateGetterHandler );
+    cache[ prop ] = proxy;
+  }
 
-  const childRecord = createRecord( prop, getter );
+  return proxy;
 
   function getter() {
     const value = target();
-    track( childRecord );
-    return value[ prop ];
-  }
-  stateGetterRecords.set( getter, childRecord );
 
-  record.children[ prop ] = childRecord;
+    if ( isPlainObjectOrArray( value ) )
+      trackProperty( value, prop );
 
-  return childRecord;
+    return value[ prop ];
+  }
 }
 
-function createDynamicStateRecord( target, arg ) {
-  const dynamicRecord = {
-    prop: '(dynamic)',
-    target: getter,
-    proxy: new Proxy( getter, stateGetterHandler ),
-  };
+function createDynamicStateGetterProxy( target, arg ) {
+  return new Proxy( getter, stateGetterHandler );
 
   function getter() {
     const value = target();
-    const index = arg();
-    track( createChildStateRecord( target, index ) );
-    return value[ index ];
+    const prop = arg();
+
+    if ( isPlainObjectOrArray( value ) )
+      trackProperty( value, prop );
+
+    return value[ prop ];
   }
+}
+
+function stateGetterApply( target ) {
+  const value = target();
 
-  stateGetterRecords.set( getter, dynamicRecord );
+  if ( isPlainObjectOrArray( value ) )
+    return createStateReader( value ).proxy;
 
-  return dynamicRecord;
+  return value;
 }
 
 const stateReaderHandler = {
@@ -173,53 +230,82 @@ const stateReaderHandler = {
   },
 };
 
-const stateReaderRecords = new WeakMap();
-
-const stateReaderProxies = new WeakSet();
+const stateReaders = new WeakMap();
+const stateReaderTargets = new WeakMap();
 
 function stateReaderGet( target, prop ) {
-  const record = stateReaderRecords.get( target );
-
-  const childRecord = createChildStateRecord( record.target, prop );
-
-  track( childRecord );
+  trackProperty( target, prop );
 
   const value = target[ prop ];
 
   if ( isPlainObjectOrArray( value ) )
-    return createReaderRecord( childRecord, value ).proxy;
+    return createStateReader( value ).proxy;
 
   return value;
 }
 
-function createReaderRecord( record, value ) {
-  if ( record.reader != null && record.reader.value === value )
-    return record.reader;
+function trackProperty( target, prop ) {
+  const reader = createStateReader( target );
+
+  if ( reader.props == null )
+    reader.props = Object.create( null );
+
+  let record = reader.props[ prop ];
 
-  // reuse an existing record; this happens e.g. if an array was rearranged using splice/unshift
-  const existingRecord = stateReaderRecords.get( value );
-  if ( existingRecord != null ) {
-    record.reader = existingRecord;
-    existingRecord.target = record.target;
-    return existingRecord;
+  if ( record == null ) {
+    record = new Set();
+    reader.props[ prop ] = record;
   }
 
-  record.reader = {
-    value,
-    target: record.target,
-    proxy: new Proxy( value, stateReaderHandler ),
-  };
+  track( record );
+}
 
-  stateReaderRecords.set( value, record.reader );
-  stateReaderProxies.add( record.reader.proxy );
+function createStateReader( value ) {
+  let reader = stateReaders.get( value );
 
-  return record.reader;
+  if ( reader == null ) {
+    reader = {
+      proxy: new Proxy( value, stateReaderHandler ),
+      props: null,
+    };
+    stateReaders.set( value, reader );
+    stateReaderTargets.set( reader.proxy, value );
+  }
+
+  return reader;
 }
 
-function isStateReader( value ) {
-  if ( stateReaderProxies.has( value ) )
-    return true;
-  return false;
+function getStateReader( value ) {
+  return stateReaders.get( value );
+}
+
+function isStateReaderProxy( value ) {
+  return stateReaderTargets.has( value );
+}
+
+function unwrapStateReaderProxy( value ) {
+  const valueTarget = stateReaderTargets.get( value );
+  if ( valueTarget != null )
+    return valueTarget;
+
+  unwrapProperties( value, stateReaderTargets, new WeakSet() );
+
+  return value;
+}
+
+function unwrapProperties( value, map, visited ) {
+  visited.add( value );
+
+  for ( const key in value ) {
+    const prop = value[ key ];
+    if ( isPlainObjectOrArray( prop ) && !visited.has( prop ) ) {
+      const valueTarget = map.get( prop );
+      if ( valueTarget != null )
+        value[ key ] = valueTarget;
+      else
+        unwrapProperties( prop, map, visited );
+    }
+  }
 }
 
 const computedGetterHandler = {
@@ -272,7 +358,7 @@ function createDynamicComputedProxy( target, arg ) {
 function computedGetterApply( target ) {
   const value = target();
 
-  if ( isPlainObjectOrArray( value ) && !isStateReader( value ) )
+  if ( isPlainObjectOrArray( value ) && !isStateReaderProxy( value ) )
     return new Proxy( value, computedReaderHandler );
 
   return value;
@@ -291,7 +377,7 @@ const computedReaderHandler = {
 function computedReaderGet( target, prop ) {
   const value = target[ prop ];
 
-  if ( isPlainObjectOrArray( value ) && !isStateReader( value ) )
+  if ( isPlainObjectOrArray( value ) && !isStateReaderProxy( value ) )
     return new Proxy( value, computedReaderHandler );
 
   return value;
@@ -303,10 +389,11 @@ class Mutator {
   }
 }
 
-function applyMutator( record, value, callback ) {
-  mutableValues = new WeakMap();
-  mutableValues.set( value, record );
+function mutate( callback ) {
+  return new Mutator( callback );
+}
 
+function applyMutator( value, callback ) {
   const proxy = new Proxy( value, stateMutatorHandler );
 
   stateMutatorTargets = new WeakMap();
@@ -316,10 +403,8 @@ function applyMutator( record, value, callback ) {
 
   try {
     callback( proxy );
-
     return mutated;
   } finally {
-    mutableValues = null;
     stateMutatorTargets = null;
     mutated = null;
   }
@@ -331,7 +416,6 @@ const stateMutatorHandler = {
   deleteProperty: stateMutatorDelete,
 };
 
-let mutableValues = null;
 let stateMutatorTargets = null;
 
 let mutated = null;
@@ -340,14 +424,8 @@ function stateMutatorGet( target, prop ) {
   const value = target[ prop ];
 
   if ( isPlainObjectOrArray( value ) ) {
-    const record = mutableValues.get( target );
-
-    const childRecord = createChildStateRecord( record.target, prop );
-    mutableValues.set( value, childRecord );
-
     const proxy = new Proxy( value, stateMutatorHandler );
     stateMutatorTargets.set( proxy, value );
-
     return proxy;
   }
 
@@ -355,18 +433,23 @@ function stateMutatorGet( target, prop ) {
 }
 
 function stateMutatorSet( target, prop, value ) {
-  const record = mutableValues.get( target );
-
-  if ( Array.isArray( target ) && isIntegerKey( prop ) && Number( prop ) >= target.length ) {
-    // the length of the array is changed implicitly when a new element is added
-    const lengthRecord = createChildStateRecord( record.target, 'length' );
-    mutated.add( lengthRecord );
+  const reader = getStateReader( target );
+
+  if ( reader != null && reader.props != null ) {
+    if ( Array.isArray( target ) && isIntegerKey( prop ) && Number( prop ) >= target.length ) {
+      // the length of the array is changed implicitly when a new element is added
+      const record = reader.props.length;
+      if ( record != null )
+        mutated.add( record );
+    }
   }
 
   if ( isPlainObjectOrArray( value ) ) {
     const valueTarget = stateMutatorTargets.get( value );
     if ( valueTarget != null )
       value = valueTarget;
+    else
+      unwrapProperties( value, stateMutatorTargets, new WeakSet() );
   }
 
   if ( target[ prop ] === value )
@@ -374,8 +457,11 @@ function stateMutatorSet( target, prop, value ) {
 
   target[ prop ] = value;
 
-  const childRecord = createChildStateRecord( record.target, prop );
-  mutated.add( childRecord );
+  if ( reader != null && reader.props != null ) {
+    const record = reader.props[ prop ];
+    if ( record != null )
+      mutated.add( record );
+  }
 
   return true;
 }
@@ -386,10 +472,13 @@ function stateMutatorDelete( target, prop ) {
 
   delete target[ prop ];
 
-  const record = mutableValues.get( target );
+  const reader = getStateReader( target );
 
-  const childRecord = createChildStateRecord( record.target, prop );
-  mutated.add( childRecord );
+  if ( reader != null && reader.props != null ) {
+    const record = reader.props[ prop ];
+    if ( record != null )
+      mutated.add( record );
+  }
 
   return true;
 }
@@ -398,28 +487,14 @@ function isIntegerKey( key ) {
   return typeof key == 'string' && key != 'NaN' && key[ 0 ] != '-' && '' + parseInt( key, 10 ) == key;
 }
 
-let scheduled = null;
-
-function schedule( callback ) {
-  if ( scheduled == null ) {
-    scheduled = new Set();
-    Promise.resolve().then( () => {
-      const watches = scheduled.values();
-      scheduled = null;
-      for ( const watch of watches )
-        watch();
-    } );
-  }
-
-  scheduled.add( callback );
-}
-
-function useState( initial ) {
+function state( initial ) {
   let current = initial;
 
-  const record = createRootStateRecord( getter );
+  const record = new Set();
+
+  const proxy = createRootStateGetterProxy( getter );
 
-  return [ record.proxy, setter ];
+  return [ proxy, setter ];
 
   function getter() {
     track( record );
@@ -427,14 +502,21 @@ function useState( initial ) {
   }
   function setter( value ) {
     if ( value instanceof Mutator ) {
-      const mutated = applyMutator( record, current, value.callback );
+      if ( !isPlainObjectOrArray( current ) )
+        throw new TypeError( 'Only plain objects and arrays can be mutated' );
+
+      const mutated = applyMutator( current, value.callback );
 
       for ( const record of mutated )
         react( record );
     } else {
       if ( typeof value == 'function' ) {
         const readOnlyValue = stateGetterApply( getter );
+
         value = value( readOnlyValue );
+
+        if ( isPlainObjectOrArray( value ) )
+          value = unwrapStateReaderProxy( value );
       }
 
       if ( current !== value ) {
@@ -445,27 +527,17 @@ function useState( initial ) {
   }
 }
 
-function useWatchEffect( callback ) {
-  let deps = null;
-
-  update();
-
-  function update() {
-    const [ _, newDeps ] = withDeps( callback );
-
-    deps = updateDeps( newDeps, deps, update );
-  }
-}
-
-function useWatch( getter, callback ) {
+function watch( getter, callback ) {
   let [ value, deps ] = withDeps( getter );
 
-  updateDeps( deps, null, update );
+  const watcher = createWatcher( deps, update, false );
+
+  deps = null;
 
   function update() {
     const [ newValue, newDeps ] = withDeps( getter );
 
-    deps = updateDeps( newDeps, deps, update );
+    updateWatcher( watcher, newDeps );
 
     if ( newValue !== value ) {
       callback( newValue, value );
@@ -474,39 +546,29 @@ function useWatch( getter, callback ) {
   }
 }
 
-function useEffect( callback ) {
-  let deps = null;
+function effect( callback ) {
+  const watcher = createWatcher( null, update, true );
 
-  schedule( update );
+  scheduleWatcher( watcher );
 
   function update() {
-    const [ _, newDeps ] = withDeps( callback );
+    const [ _, deps ] = withDeps( callback );
 
-    deps = updateDeps( newDeps, deps, () => schedule( update ) );
+    updateWatcher( watcher, deps );
   }
 }
 
-function useReactive( callback ) {
-  let deps = null;
-
-  update();
-
-  function update() {
-    const [ _, newDeps ] = withDeps( callback );
-
-    deps = updateDeps( newDeps, deps, () => schedule( update ) );
-  }
-}
+function reactive( getter, callback ) {
+  let value;
 
-function useReactiveWatch( getter, callback ) {
-  let value = null, deps = null;
+  const watcher = createWatcher( null, update, true );
 
   update( true );
 
   function update( force ) {
-    const [ newValue, newDeps ] = withDeps( getter );
+    const [ newValue, deps ] = withDeps( getter );
 
-    deps = updateDeps( newDeps, deps, () => schedule( update ) );
+    updateWatcher( watcher, deps );
 
     if ( force || newValue !== value ) {
       callback( newValue, value );
@@ -515,33 +577,38 @@ function useReactiveWatch( getter, callback ) {
   }
 }
 
-function useComputed( callback ) {
-  let deps = null, value = null, valid = false;
+function computed( callback ) {
+  let value, valid = false;
+
+  const watcher = createWatcher( null, invalidate, false );
 
   return createRootComputedProxy( execute );
 
   function execute() {
+    if ( watcher.callback == null )
+      throw new Error( 'A destroyed computed value cannot be used' );
+
     if ( !valid ) {
-      const [ newValue, newDeps ] = withDeps( callback );
+      const [ newValue, deps ] = withDeps( callback );
 
-      deps = updateDeps( newDeps, deps, invalidate );
+      updateWatcher( watcher, deps );
 
       value = newValue;
       valid = true;
     }
 
-    addDeps( deps );
+    addDeps( watcher.deps );
 
     return value;
   }
 
   function invalidate() {
-    value = null;
+    value = undefined;
     valid = false;
   }
 }
 
-function useConstant( value ) {
+function constant( value ) {
   return createRootComputedProxy( getter );
 
   function getter() {
@@ -549,14 +616,11 @@ function useConstant( value ) {
   }
 }
 
-function mutate( callback ) {
-  return new Mutator( callback );
-}
-
-function current( value ) {
+function transform( value, callback ) {
   if ( typeof value == 'function' )
-    return value();
-  return value;
+    return computed( () => callback( value() ) );
+  else
+    return callback( value );
 }
 
-export { current, mutate, schedule, useComputed, useConstant, useEffect, useReactive, useReactiveWatch, useState, useWatch, useWatchEffect };
+export { computed, constant, destroyScope, effect, mutate, reactive, schedule, state, transform, watch, withScope };