More performance tweaks

Author: Michael Trotter

src/React/Basic.js

@@ -8,8 +8,7 @@ exports.createComponent_ = function(
   buildStateUpdate,
   handler,
   composeCancelEventFn,
-  identityEventFn,
-  displayName
+  identityEventFn
 ) {
   var defaultInitialState = null;
   var defaultShouldUpdate = function() {
@@ -106,71 +105,73 @@ exports.createComponent_ = function(
     return self;
   }
 
-  var Component = function constructor(props) {
-    this.$$mounted = true;
-    this.$$spec = props.$$spec;
-    this.state =
-      // React may optimize components with no state,
-      // so we leave state null if it was left as
-      // the default value.
-      this.$$spec.initialState === defaultInitialState
-        ? null
-        : { $$state: this.$$spec.initialState };
-    return this;
-  };
+  return function(displayName) {
+    var Component = function constructor(props) {
+      this.$$mounted = true;
+      this.$$spec = props.$$spec;
+      this.state =
+        // React may optimize components with no state,
+        // so we leave state null if it was left as
+        // the default value.
+        this.$$spec.initialState === defaultInitialState
+          ? null
+          : { $$state: this.$$spec.initialState };
+      return this;
+    };
 
-  Component.prototype = Object.create(React.Component.prototype);
+    Component.prototype = Object.create(React.Component.prototype);
 
-  Component.displayName = displayName;
+    Component.displayName = displayName;
 
-  Component.prototype.shouldComponentUpdate = function(nextProps, nextState) {
-    var shouldUpdate = this.$$spec.shouldUpdate;
-    return shouldUpdate === defaultShouldUpdate
-      ? true
-      : shouldUpdate({
-          props: this.props.$$props,
-          state: this.state === null ? null : this.state.$$state
-        })(nextProps.$$props)(nextState === null ? null : nextState.$$state);
-  };
+    Component.prototype.shouldComponentUpdate = function(nextProps, nextState) {
+      var shouldUpdate = this.$$spec.shouldUpdate;
+      return shouldUpdate === defaultShouldUpdate
+        ? true
+        : shouldUpdate({
+            props: this.props.$$props,
+            state: this.state === null ? null : this.state.$$state
+          })(nextProps.$$props)(nextState === null ? null : nextState.$$state);
+    };
 
-  Component.prototype.componentDidMount = function() {
-    var didMount = this.$$spec.didMount;
-    if (didMount !== defaultDidMount) {
-      this.$$spec.didMount(contextToSelf(this))();
-    }
-  };
+    Component.prototype.componentDidMount = function() {
+      var didMount = this.$$spec.didMount;
+      if (didMount !== defaultDidMount) {
+        this.$$spec.didMount(contextToSelf(this))();
+      }
+    };
 
-  Component.prototype.componentDidUpdate = function() {
-    var didUpdate = this.$$spec.didUpdate;
-    if (didUpdate !== defaultDidUpdate) {
-      didUpdate(contextToSelf(this))();
-    }
-  };
+    Component.prototype.componentDidUpdate = function() {
+      var didUpdate = this.$$spec.didUpdate;
+      if (didUpdate !== defaultDidUpdate) {
+        didUpdate(contextToSelf(this))();
+      }
+    };
 
-  Component.prototype.componentWillUnmount = function() {
-    this.$$mounted = false;
-    var willUnmount = this.$$spec.willUnmount;
-    if (willUnmount !== defaultWillUnmount) {
-      willUnmount({
-        props: this.props.$$props,
-        state: this.state === null ? null : this.state.$$state
-      })();
-    }
-  };
+    Component.prototype.componentWillUnmount = function() {
+      this.$$mounted = false;
+      var willUnmount = this.$$spec.willUnmount;
+      if (willUnmount !== defaultWillUnmount) {
+        willUnmount({
+          props: this.props.$$props,
+          state: this.state === null ? null : this.state.$$state
+        })();
+      }
+    };
 
-  Component.prototype.render = function() {
-    return this.$$spec.render(contextToSelf(this));
-  };
+    Component.prototype.render = function() {
+      return this.$$spec.render(contextToSelf(this));
+    };
 
-  return {
-    $$type: Component,
-    initialState: defaultInitialState,
-    shouldUpdate: defaultShouldUpdate,
-    didMount: defaultDidMount,
-    didUpdate: defaultDidUpdate,
-    willUnmount: defaultWillUnmount,
-    update: defaultUpdate,
-    render: defaultRender
+    return {
+      $$type: Component,
+      initialState: defaultInitialState,
+      shouldUpdate: defaultShouldUpdate,
+      didMount: defaultDidMount,
+      didUpdate: defaultDidUpdate,
+      willUnmount: defaultWillUnmount,
+      update: defaultUpdate,
+      render: defaultRender
+    };
   };
 };
 

src/React/Basic.purs

@@ -27,7 +27,7 @@ module React.Basic
 import Prelude
 
 import Data.Either (Either(..))
-import Data.Function.Uncurried (Fn2, Fn6, runFn2, runFn6)
+import Data.Function.Uncurried (Fn2, Fn5, runFn2, runFn5)
 import Data.Nullable (Nullable, notNull, null)
 import Effect (Effect)
 import Effect.Aff (Aff, runAff_)
@@ -201,7 +201,7 @@ createComponent
    . String
   -> ComponentSpec props state Unit action
 createComponent =
-  runFn6
+  runFn5
     createComponent_
     NoUpdate
     buildStateUpdate
@@ -211,7 +211,7 @@ createComponent =
 
 foreign import createComponent_
   :: forall props state action
-   . Fn6
+   . Fn5
       (StateUpdate props state action)
       (StateUpdate props state action
         -> { state   :: Nullable state
@@ -223,8 +223,7 @@ foreign import createComponent_
       (forall a. EventFn SyntheticEvent a -> EventFn SyntheticEvent a)
       -- identityEventFn
       (EventFn SyntheticEvent SyntheticEvent)
-      String
-      (ComponentSpec props state Unit action)
+      (String -> ComponentSpec props state Unit action)
 
 -- | An empty node. This is often useful when you would like to conditionally
 -- | show something, but you don't want to (or can't) modify the `children` prop