perf: created NULL constant

src/clone-element.js

@@ -1,6 +1,6 @@
 import { assign, slice } from './util';
 import { createVNode } from './create-element';
-import { UNDEFINED } from './constants';
+import { NULL, UNDEFINED } from './constants';
 
 /**
  * Clones the given VNode, optionally adding attributes/props and replacing its
@@ -43,6 +43,6 @@ export function cloneElement(vnode, props, children) {
 		normalizedProps,
 		key || vnode.key,
 		ref || vnode.ref,
-		null
+		NULL
 	);
 }

src/component.js

@@ -2,7 +2,7 @@ import { assign } from './util';
 import { diff, commitRoot } from './diff/index';
 import options from './options';
 import { Fragment } from './create-element';
-import { MODE_HYDRATE } from './constants';
+import { MODE_HYDRATE, NULL } from './constants';
 
 /**
  * Base Component class. Provides `setState()` and `forceUpdate()`, which
@@ -28,7 +28,7 @@ export function BaseComponent(props, context) {
 BaseComponent.prototype.setState = function (update, callback) {
 	// only clone state when copying to nextState the first time.
 	let s;
-	if (this._nextState != null && this._nextState !== this.state) {
+	if (this._nextState != NULL && this._nextState !== this.state) {
 		s = this._nextState;
 	} else {
 		s = this._nextState = assign({}, this.state);
@@ -45,7 +45,7 @@ BaseComponent.prototype.setState = function (update, callback) {
 	}
 
 	// Skip update if updater function returned null
-	if (update == null) return;
+	if (update == NULL) return;
 
 	if (this._vnode) {
 		if (callback) {
@@ -89,18 +89,18 @@ BaseComponent.prototype.render = Fragment;
  * @param {number | null} [childIndex]
  */
 export function getDomSibling(vnode, childIndex) {
-	if (childIndex == null) {
+	if (childIndex == NULL) {
 		// Use childIndex==null as a signal to resume the search from the vnode's sibling
 		return vnode._parent
 			? getDomSibling(vnode._parent, vnode._index + 1)
-			: null;
+			: NULL;
 	}
 
 	let sibling;
 	for (; childIndex < vnode._children.length; childIndex++) {
 		sibling = vnode._children[childIndex];
 
-		if (sibling != null && sibling._dom != null) {
+		if (sibling != NULL && sibling._dom != NULL) {
 			// Since updateParentDomPointers keeps _dom pointer correct,
 			// we can rely on _dom to tell us if this subtree contains a
 			// rendered DOM node, and what the first rendered DOM node is
@@ -113,7 +113,7 @@ export function getDomSibling(vnode, childIndex) {
 	// Only climb up and search the parent if we aren't searching through a DOM
 	// VNode (meaning we reached the DOM parent of the original vnode that began
 	// the search)
-	return typeof vnode.type == 'function' ? getDomSibling(vnode) : null;
+	return typeof vnode.type == 'function' ? getDomSibling(vnode) : NULL;
 }
 
 /**
@@ -137,9 +137,9 @@ function renderComponent(component) {
 			oldVNode,
 			component._globalContext,
 			component._parentDom.namespaceURI,
-			oldVNode._flags & MODE_HYDRATE ? [oldDom] : null,
+			oldVNode._flags & MODE_HYDRATE ? [oldDom] : NULL,
 			commitQueue,
-			oldDom == null ? getDomSibling(oldVNode) : oldDom,
+			oldDom == NULL ? getDomSibling(oldVNode) : oldDom,
 			!!(oldVNode._flags & MODE_HYDRATE),
 			refQueue
 		);
@@ -158,11 +158,11 @@ function renderComponent(component) {
  * @param {import('./internal').VNode} vnode
  */
 function updateParentDomPointers(vnode) {
-	if ((vnode = vnode._parent) != null && vnode._component != null) {
-		vnode._dom = vnode._component.base = null;
+	if ((vnode = vnode._parent) != NULL && vnode._component != NULL) {
+		vnode._dom = vnode._component.base = NULL;
 		for (let i = 0; i < vnode._children.length; i++) {
 			let child = vnode._children[i];
-			if (child != null && child._dom != null) {
+			if (child != NULL && child._dom != NULL) {
 				vnode._dom = vnode._component.base = child._dom;
 				break;
 			}

src/constants.js

@@ -14,6 +14,7 @@ export const SVG_NAMESPACE = 'http://www.w3.org/2000/svg';
 export const XHTML_NAMESPACE = 'http://www.w3.org/1999/xhtml';
 export const MATH_NAMESPACE = 'http://www.w3.org/1998/Math/MathML';
 
+export const NULL = null;
 export const UNDEFINED = undefined;
 export const EMPTY_OBJ = /** @type {any} */ ({});
 export const EMPTY_ARR = [];

src/create-context.js

@@ -1,4 +1,5 @@
 import { enqueueRender } from './component';
+import { NULL } from './constants';
 
 export let i = 0;
 
@@ -13,7 +14,7 @@ export function createContext(defaultValue) {
 			this.getChildContext = () => ctx;
 
 			this.componentWillUnmount = () => {
-				subs = null;
+				subs = NULL;
 			};
 
 			this.shouldComponentUpdate = function (_props) {

src/create-element.js

@@ -1,6 +1,6 @@
 import { slice } from './util';
 import options from './options';
-import { UNDEFINED } from './constants';
+import { NULL, UNDEFINED } from './constants';
 
 let vnodeId = 0;
 
@@ -31,15 +31,15 @@ export function createElement(type, props, children) {
 
 	// If a Component VNode, check for and apply defaultProps
 	// Note: type may be undefined in development, must never error here.
-	if (typeof type == 'function' && type.defaultProps != null) {
+	if (typeof type == 'function' && type.defaultProps != NULL) {
 		for (i in type.defaultProps) {
 			if (normalizedProps[i] === UNDEFINED) {
 				normalizedProps[i] = type.defaultProps[i];
 			}
 		}
 	}
 
-	return createVNode(type, normalizedProps, key, ref, null);
+	return createVNode(type, normalizedProps, key, ref, NULL);
 }
 
 /**
@@ -63,25 +63,25 @@ export function createVNode(type, props, key, ref, original) {
 		props,
 		key,
 		ref,
-		_children: null,
-		_parent: null,
+		_children: NULL,
+		_parent: NULL,
 		_depth: 0,
-		_dom: null,
-		_component: null,
+		_dom: NULL,
+		_component: NULL,
 		constructor: UNDEFINED,
-		_original: original == null ? ++vnodeId : original,
+		_original: original == NULL ? ++vnodeId : original,
 		_index: -1,
 		_flags: 0
 	};
 
 	// Only invoke the vnode hook if this was *not* a direct copy:
-	if (original == null && options.vnode != null) options.vnode(vnode);
+	if (original == NULL && options.vnode != NULL) options.vnode(vnode);
 
 	return vnode;
 }
 
 export function createRef() {
-	return { current: null };
+	return { current: NULL };
 }
 
 export function Fragment(props) {
@@ -94,4 +94,4 @@ export function Fragment(props) {
  * @returns {vnode is VNode}
  */
 export const isValidElement = vnode =>
-	vnode != null && vnode.constructor == UNDEFINED;
+	vnode != NULL && vnode.constructor == UNDEFINED;

src/diff/catch-error.js

@@ -1,3 +1,5 @@
+import { NULL } from '../constants';
+
 /**
  * Find the closest error boundary to a thrown error and call it
  * @param {object} error The thrown value
@@ -20,12 +22,12 @@ export function _catchError(error, vnode, oldVNode, errorInfo) {
 			try {
 				ctor = component.constructor;
 
-				if (ctor && ctor.getDerivedStateFromError != null) {
+				if (ctor && ctor.getDerivedStateFromError != NULL) {
 					component.setState(ctor.getDerivedStateFromError(error));
 					handled = component._dirty;
 				}
 
-				if (component.componentDidCatch != null) {
+				if (component.componentDidCatch != NULL) {
 					component.componentDidCatch(error, errorInfo || {});
 					handled = component._dirty;
 				}

src/diff/children.js

@@ -5,7 +5,8 @@ import {
 	EMPTY_ARR,
 	INSERT_VNODE,
 	MATCHED,
-	UNDEFINED
+	UNDEFINED,
+	NULL
 } from '../constants';
 import { isArray } from '../util';
 import { getDomSibling } from '../component';
@@ -79,7 +80,7 @@ export function diffChildren(
 
 	for (i = 0; i < newChildrenLength; i++) {
 		childVNode = newParentVNode._children[i];
-		if (childVNode == null) continue;
+		if (childVNode == NULL) continue;
 
 		// At this point, constructNewChildrenArray has assigned _index to be the
 		// matchingIndex for this VNode's oldVNode (or -1 if there is no oldVNode).
@@ -110,7 +111,7 @@ export function diffChildren(
 		newDom = childVNode._dom;
 		if (childVNode.ref && oldVNode.ref != childVNode.ref) {
 			if (oldVNode.ref) {
-				applyRef(oldVNode.ref, null, childVNode);
+				applyRef(oldVNode.ref, NULL, childVNode);
 			}
 			refQueue.push(
 				childVNode.ref,
@@ -119,7 +120,7 @@ export function diffChildren(
 			);
 		}
 
-		if (firstChildDom == null && newDom != null) {
+		if (firstChildDom == NULL && newDom != NULL) {
 			firstChildDom = newDom;
 		}
 
@@ -174,11 +175,11 @@ function constructNewChildrenArray(
 		childVNode = renderResult[i];
 
 		if (
-			childVNode == null ||
+			childVNode == NULL ||
 			typeof childVNode == 'boolean' ||
 			typeof childVNode == 'function'
 		) {
-			newParentVNode._children[i] = null;
+			newParentVNode._children[i] = NULL;
 			continue;
 		}
 		// If this newVNode is being reused (e.g. <div>{reuse}{reuse}</div>) in the same diff,
@@ -192,19 +193,19 @@ function constructNewChildrenArray(
 			childVNode.constructor == String
 		) {
 			childVNode = newParentVNode._children[i] = createVNode(
-				null,
+				NULL,
 				childVNode,
-				null,
-				null,
-				null
+				NULL,
+				NULL,
+				NULL
 			);
 		} else if (isArray(childVNode)) {
 			childVNode = newParentVNode._children[i] = createVNode(
 				Fragment,
 				{ children: childVNode },
-				null,
-				null,
-				null
+				NULL,
+				NULL,
+				NULL
 			);
 		} else if (childVNode.constructor === UNDEFINED && childVNode._depth > 0) {
 			// VNode is already in use, clone it. This can happen in the following
@@ -215,7 +216,7 @@ function constructNewChildrenArray(
 				childVNode.type,
 				childVNode.props,
 				childVNode.key,
-				childVNode.ref ? childVNode.ref : null,
+				childVNode.ref ? childVNode.ref : NULL,
 				childVNode._original
 			);
 		} else {
@@ -236,7 +237,7 @@ function constructNewChildrenArray(
 			remainingOldChildren
 		));
 
-		oldVNode = null;
+		oldVNode = NULL;
 		if (matchingIndex !== -1) {
 			oldVNode = oldChildren[matchingIndex];
 			remainingOldChildren--;
@@ -248,7 +249,7 @@ function constructNewChildrenArray(
 		// Here, we define isMounting for the purposes of the skew diffing
 		// algorithm. Nodes that are unsuspending are considered mounting and we detect
 		// this by checking if oldVNode._original === null
-		const isMounting = oldVNode == null || oldVNode._original === null;
+		const isMounting = oldVNode == NULL || oldVNode._original === NULL;
 
 		if (isMounting) {
 			if (matchingIndex == -1) {
@@ -302,7 +303,7 @@ function constructNewChildrenArray(
 	if (remainingOldChildren) {
 		for (i = 0; i < oldChildrenLength; i++) {
 			oldVNode = oldChildren[i];
-			if (oldVNode != null && (oldVNode._flags & MATCHED) == 0) {
+			if (oldVNode != NULL && (oldVNode._flags & MATCHED) == 0) {
 				if (oldVNode._dom == oldDom) {
 					oldDom = getDomSibling(oldVNode);
 				}
@@ -342,13 +343,13 @@ function insert(parentVNode, oldDom, parentDom) {
 		if (oldDom && parentVNode.type && !parentDom.contains(oldDom)) {
 			oldDom = getDomSibling(parentVNode);
 		}
-		parentDom.insertBefore(parentVNode._dom, oldDom || null);
+		parentDom.insertBefore(parentVNode._dom, oldDom || NULL);
 		oldDom = parentVNode._dom;
 	}
 
 	do {
 		oldDom = oldDom && oldDom.nextSibling;
-	} while (oldDom != null && oldDom.nodeType == 8);
+	} while (oldDom != NULL && oldDom.nodeType == 8);
 
 	return oldDom;
 }
@@ -361,7 +362,7 @@ function insert(parentVNode, oldDom, parentDom) {
  */
 export function toChildArray(children, out) {
 	out = out || [];
-	if (children == null || typeof children == 'boolean') {
+	if (children == NULL || typeof children == 'boolean') {
 	} else if (isArray(children)) {
 		children.some(child => {
 			toChildArray(child, out);
@@ -403,10 +404,10 @@ function findMatchingIndex(
 	let shouldSearch =
 		// (typeof type != 'function' || type === Fragment || key) &&
 		remainingOldChildren >
-		(oldVNode != null && (oldVNode._flags & MATCHED) == 0 ? 1 : 0);
+		(oldVNode != NULL && (oldVNode._flags & MATCHED) == 0 ? 1 : 0);
 
 	if (
-		oldVNode === null ||
+		oldVNode === NULL ||
 		(oldVNode &&
 			key == oldVNode.key &&
 			type === oldVNode.type &&