updates

solidjs · Jun 15, 2019 · 5bc5141 · 5bc5141
1 parent 5c0061a
commit 5bc5141
Show file tree

Hide file tree

Showing 7 changed files with 85 additions and 134 deletions.
diff --git a/bench/bench.js b/bench/bench.js
@@ -1,4 +1,4 @@
-const { createRoot, createSignal, createEffect, createMemo } = require('../lib/solid');
+const { createRoot, createSignal, createEffect } = require('../lib/solid');
 
 var now = typeof process === 'undefined' ? browserNow : nodeNow;
 
@@ -226,17 +226,17 @@ function createComputation1000(ss, offset) {
 }
 
 function updateComputations1to1(n, sources) {
-  var s1 = sources[0],
-    c = createMemo(function () { return s1[0](); });
+  var s1 = sources[0];
+  createEffect(function () { return s1[0](); });
   for (var i = 0; i < n; i++) {
     s1[1](i);
   }
 }
 
 function updateComputations2to1(n, sources) {
   var s1 = sources[0],
-    s2 = sources[1],
-    c = createMemo(function () { return s1[0]() + s2[0](); });
+    s2 = sources[1];
+  createEffect(function () { return s1[0]() + s2[0](); });
   for (var i = 0; i < n; i++) {
     s1[1](i);
   }
@@ -246,42 +246,42 @@ function updateComputations4to1(n, sources) {
   var s1 = sources[0],
     s2 = sources[1],
     s3 = sources[2],
-    s4 = sources[3],
-    c = createMemo(function () { return s1[0]() + s2[0]() + s3[0]() + s4[0](); });
+    s4 = sources[3];
+  createEffect(function () { return s1[0]() + s2[0]() + s3[0]() + s4[0](); });
   for (var i = 0; i < n; i++) {
     s1[1](i);
   }
 }
 
 function updateComputations1000to1(n, sources) {
-  var s1 = sources[0],
-    c = createMemo(function () {
-      var sum = 0;
-      for (var i = 0; i < 1000; i++) {
-        sum += sources[i][0]();
-      }
-      return sum;
-    });
+  var s1 = sources[0];
+  createEffect(function () {
+    var sum = 0;
+    for (var i = 0; i < 1000; i++) {
+      sum += sources[i][0]();
+    }
+    return sum;
+  });
   for (var i = 0; i < n; i++) {
     s1[1](i);
   }
 }
 
 function updateComputations1to2(n, sources) {
-  var s1 = sources[0],
-    c1 = createMemo(function () { return s1[0](); }),
-    c2 = createMemo(function () { return s1[0](); });
+  var s1 = sources[0];
+  createEffect(function () { return s1[0](); });
+  createEffect(function () { return s1[0](); });
   for (var i = 0; i < n / 2; i++) {
     s1[1](i);
   }
 }
 
 function updateComputations1to4(n, sources) {
-  var s1 = sources[0],
-    c1 = createMemo(function () { return s1[0](); }),
-    c2 = createMemo(function () { return s1[0](); }),
-    c3 = createMemo(function () { return s1[0](); }),
-    c4 = createMemo(function () { return s1[0](); });
+  var s1 = sources[0];
+  createEffect(function () { return s1[0](); });
+  createEffect(function () { return s1[0](); });
+  createEffect(function () { return s1[0](); });
+  createEffect(function () { return s1[0](); });
   for (var i = 0; i < n / 4; i++) {
     s1[1](i);
   }

diff --git a/documentation/api.md b/documentation/api.md
@@ -16,9 +16,9 @@ Creates a new effect that automatically tracks dependencies. 2nd argument is the
 
 Creates a new signal that can be used for reactive tracking. By default signals always notify on setting a value. However a comparator can be passed in to indicate whether the values should be considered equal and listeners not notified.
 
-### `createMemo(prev => <code>, initialValue): getValueFn`
+### `createMemo(prev => <code>, initialValue, comparatorFn): getValueFn`
 
-Creates a readonly signal that recalculates it's value whenever the executed codes dependencies update.
+Creates a readonly signal that recalculates it's value whenever the executed codes dependencies update. Memos only notify dependents when returned value changes. You can also set a custom comparator.
 
 ### `createDependentEffect(() => <code>, dependencies, defer): void`
 

diff --git a/dom-expressions.config.js b/dom-expressions.config.js
@@ -3,7 +3,7 @@ module.exports = {
   includeTypes: true,
   variables: {
     imports: [ `import {
-      createEffect as wrap, sample, createRoot as root,
+      createEffect as wrap, sample, createRoot as root, createMemo as memo,
       onCleanup as cleanup, setContext, registerSuspense,
       getContextOwner as currentContext
     } from '../solid.js'` ],

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "solid-js",
   "description": "A declarative JavaScript library for building user interfaces.",
-  "version": "0.7.13",
+  "version": "0.8.0",
   "author": "Ryan Carniato",
   "license": "MIT",
   "repository": {
@@ -26,15 +26,15 @@
     "@babel/preset-typescript": "^7.3.3",
     "coveralls": "^3.0.4",
     "cpx": "^1.5.0",
-    "dom-expressions": "0.9.10",
-    "hyper-dom-expressions": "0.9.2",
+    "dom-expressions": "0.10.0",
+    "hyper-dom-expressions": "0.10.0",
     "jest": "~24.8.0",
-    "lit-dom-expressions": "0.9.2",
+    "lit-dom-expressions": "0.10.0",
     "npm-run-all": "^4.1.5",
     "rimraf": "^2.6.3",
-    "rollup": "^1.14.4",
+    "rollup": "^1.15.5",
     "rollup-plugin-babel": "^4.3.2",
     "rollup-plugin-node-resolve": "^5.0.1",
-    "typescript": "^3.5.1"
+    "typescript": "^3.5.2"
   }
 }
diff --git a/src/dom/index.js b/src/dom/index.js
@@ -1,6 +1,6 @@
 import { Attributes } from 'dom-expressions';
 import {
-      createEffect as wrap, sample, createRoot as root,
+      createEffect as wrap, sample, createRoot as root, createMemo as memo,
       onCleanup as cleanup, setContext, registerSuspense,
       getContextOwner as currentContext
     } from '../solid.js';
@@ -248,74 +248,51 @@ export function spread(node, accessor) {
 
 export function when(parent, accessor, expr, options, marker) {
   let beforeNode, current, disposable;
-  const { afterRender, fallback } = options;
+  const { afterRender, fallback } = options,
+    condition = memo(accessor);
 
   if (marker !== undefined) beforeNode = marker ? marker.previousSibling : parent.lastChild;
-  cleanup(function dispose() { disposable && disposable(); });
-
-  wrap(cached => {
-    const value = accessor();
-    if (value === cached) return cached;
-    return sample(() => {
+  wrap(() => {
+    const value = condition();
+    sample(() => {
       parent = (marker && marker.parentNode) || (beforeNode && beforeNode.parentNode) || parent;
-      disposable && disposable();
       clearAll(parent, current, marker, beforeNode && beforeNode.nextSibling);
       current = null;
       if (value == null || value === false) {
         afterRender && afterRender(current, marker);
         if (fallback) {
-          root(disposer => {
-            disposable = disposer;
-            addNode(parent, fallback(), marker, ++groupCounter, node => current = node);
-          });
+          addNode(parent, fallback(), marker, ++groupCounter, node => current = node);
         }
-      } else {
-        root(disposer => {
-          disposable = disposer;
-          addNode(parent, expr(value), marker, ++groupCounter, node => current = node, afterRender && afterRender(node, marker));
-        });
-      }
-      return value;
+      } else addNode(parent, expr(value), marker, ++groupCounter, node => (current = node, afterRender && afterRender(node, marker)));
     });
   });
 }
 
 export function switchWhen(parent, conditions, _, options, marker) {
   let beforeNode, current, disposable;
-  const { fallback } = options;
+  const { fallback } = options,
+    evalConditions = memo(() => {
+      for (let i = 0; i < conditions.length; i++) {
+        if (conditions[i].condition()) return i;
+      }
+      return -1;
+    });
 
   if (marker !== undefined) beforeNode = marker ? marker.previousSibling : parent.lastChild;
-  function evalConditions() {
-    for (let i = 0; i < conditions.length; i++) {
-      if (conditions[i].condition()) return {index: i, render: conditions[i].render, afterRender: conditions[i].options && conditions[i].options.afterRender};
-    }
-    return {index: -1};
-  }
-  cleanup(function dispose() { disposable && disposable(); });
-
-  wrap(cached => {
-    const {index, render, afterRender} = evalConditions();
-    if (index === cached) return cached;
-    return sample(() => {
+  wrap(() => {
+    const index = evalConditions();
+    sample(() => {
       parent = (marker && marker.parentNode) || (beforeNode && beforeNode.parentNode) || parent;
-      disposable && disposable();
       clearAll(parent, current, marker, beforeNode && beforeNode.nextSibling);
       current = null;
       if (index < 0) {
-        afterRender && afterRender(null, marker);
         if (fallback) {
-          root(disposer => {
-            disposable = disposer;
-            addNode(parent, fallback(), marker, ++groupCounter, node => current = node);
-          });
+          addNode(parent, fallback(), marker, ++groupCounter, node => current = node);
         }
       } else {
-        root(disposer => {
-          disposable = disposer;
-          addNode(parent, render(), marker, ++groupCounter, node => current = node, afterRender && afterRender(node, marker));
-        });
+        const afterRender = conditions[index].options && conditions[index].options.afterRender;
+        addNode(parent, conditions[index].render(), marker, ++groupCounter, node => current = node, afterRender && afterRender(node, marker));
       }
-      return index;
     });
   });
 }