From 7774f5db0b3828a71c9bd83aeaeb58d70fd87d15 Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Sat, 7 Jun 2025 02:20:22 -0500 Subject: [PATCH 1/3] junk: Bump tersers, hoists namespaces, NULL, & UNDEFINED --- package-lock.json | 13 +++++++------ package.json | 2 +- 2 files changed, 8 insertions(+), 7 deletions(-) diff --git a/package-lock.json b/package-lock.json index 42bdf75886..2301c5bcec 100644 --- a/package-lock.json +++ b/package-lock.json @@ -40,7 +40,7 @@ "sade": "^1.8.1", "sinon": "^19.0.2", "sinon-chai": "^4.0.0", - "terser": "5.16.0", + "terser": "^5.41.0", "typescript": "5.1.6", "undici": "^4.12.0", "vite": "^6.2.0", @@ -11511,13 +11511,14 @@ } }, "node_modules/terser": { - "version": "5.16.0", - "resolved": "https://registry.npmjs.org/terser/-/terser-5.16.0.tgz", - "integrity": "sha512-KjTV81QKStSfwbNiwlBXfcgMcOloyuRdb62/iLFPGBcVNF4EXjhdYBhYHmbJpiBrVxZhDvltE11j+LBQUxEEJg==", + "version": "5.41.0", + "resolved": "https://registry.npmjs.org/terser/-/terser-5.41.0.tgz", + "integrity": "sha512-H406eLPXpZbAX14+B8psIuvIr8+3c+2hkuYzpMkoE0ij+NdsVATbA78vb8neA/eqrj7rywa2pIkdmWRsXW6wmw==", "dev": true, + "license": "BSD-2-Clause", "dependencies": { - "@jridgewell/source-map": "^0.3.2", - "acorn": "^8.5.0", + "@jridgewell/source-map": "^0.3.3", + "acorn": "^8.14.0", "commander": "^2.20.0", "source-map-support": "~0.5.20" }, diff --git a/package.json b/package.json index 83f9f6bf02..ac3c204faf 100644 --- a/package.json +++ b/package.json @@ -231,7 +231,7 @@ "sade": "^1.8.1", "sinon": "^19.0.2", "sinon-chai": "^4.0.0", - "terser": "5.16.0", + "terser": "^5.41.0", "typescript": "5.1.6", "undici": "^4.12.0", "vite": "^6.2.0", From af53275a05faf28cd22a09829a9fbe18cecb30d9 Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Sat, 7 Jun 2025 02:33:11 -0500 Subject: [PATCH 2/3] refactor: Inline namespaces --- src/constants.js | 4 ---- src/diff/index.js | 15 +++++++-------- src/diff/props.js | 4 ++-- 3 files changed, 9 insertions(+), 14 deletions(-) diff --git a/src/constants.js b/src/constants.js index 57d56d98c6..7fc20b7110 100644 --- a/src/constants.js +++ b/src/constants.js @@ -12,10 +12,6 @@ export const SKIP_CHILDREN = 1 << 3; /** Reset all mode flags */ export const RESET_MODE = ~(MODE_HYDRATE | MODE_SUSPENDED); -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} */ ({}); diff --git a/src/diff/index.js b/src/diff/index.js index d9a62cbae5..18f16d3454 100644 --- a/src/diff/index.js +++ b/src/diff/index.js @@ -1,14 +1,11 @@ import { EMPTY_OBJ, - MATH_NAMESPACE, MODE_HYDRATE, MODE_SUSPENDED, NULL, RESET_MODE, SKIP_CHILDREN, - SVG_NAMESPACE, - UNDEFINED, - XHTML_NAMESPACE + UNDEFINED } from '../constants'; import { BaseComponent, getDomSibling } from '../component'; import { Fragment } from '../create-element'; @@ -475,9 +472,9 @@ function diffElementNodes( let checked; // Tracks entering and exiting namespaces when descending through the tree. - if (nodeType == 'svg') namespace = SVG_NAMESPACE; - else if (nodeType == 'math') namespace = MATH_NAMESPACE; - else if (!namespace) namespace = XHTML_NAMESPACE; + if (nodeType == 'svg') namespace = 'http://www.w3.org/2000/svg'; + else if (nodeType == 'math') namespace = 'http://www.w3.org/1998/Math/MathML'; + else if (!namespace) namespace = 'http://www.w3.org/1999/xhtml'; if (excessDomChildren != NULL) { for (i = 0; i < excessDomChildren.length; i++) { @@ -600,7 +597,9 @@ function diffElementNodes( newVNode, oldVNode, globalContext, - nodeType == 'foreignObject' ? XHTML_NAMESPACE : namespace, + nodeType == 'foreignObject' + ? 'http://www.w3.org/1999/xhtml' + : namespace, excessDomChildren, commitQueue, excessDomChildren diff --git a/src/diff/props.js b/src/diff/props.js index ed17f763fa..62ef825b92 100644 --- a/src/diff/props.js +++ b/src/diff/props.js @@ -1,4 +1,4 @@ -import { NULL, SVG_NAMESPACE } from '../constants'; +import { NULL } from '../constants'; import options from '../options'; function setStyle(style, key, value) { @@ -92,7 +92,7 @@ export function setProperty(dom, name, value, oldValue, namespace) { ); } } else { - if (namespace == SVG_NAMESPACE) { + if (namespace == 'http://www.w3.org/2000/svg') { // Normalize incorrect prop usage for SVG: // - xlink:href / xlinkHref --> href (xlink:href was removed from SVG and isn't needed) // - className --> class From ff3b89227ba07cc902370fba537504ff14560328 Mon Sep 17 00:00:00 2001 From: Ryan Christian Date: Sat, 7 Jun 2025 02:39:51 -0500 Subject: [PATCH 3/3] refactor: Inline NULL & UNDEFINED --- src/clone-element.js | 3 +- src/component.js | 24 ++++++------ src/constants.js | 2 - src/create-context.js | 3 +- src/create-element.js | 21 +++++------ src/diff/catch-error.js | 6 +-- src/diff/children.js | 55 ++++++++++++--------------- src/diff/index.js | 84 ++++++++++++++++++++--------------------- src/diff/props.js | 11 +++--- src/render.js | 11 +++--- 10 files changed, 102 insertions(+), 118 deletions(-) diff --git a/src/clone-element.js b/src/clone-element.js index b2f6e118cf..3dc41e8c00 100644 --- a/src/clone-element.js +++ b/src/clone-element.js @@ -1,6 +1,5 @@ import { assign, slice } from './util'; import { createVNode } from './create-element'; -import { NULL } from './constants'; /** * Clones the given VNode, optionally adding attributes/props and replacing its @@ -33,6 +32,6 @@ export function cloneElement(vnode, props, children) { normalizedProps, key || vnode.key, ref || vnode.ref, - NULL + null ); } diff --git a/src/component.js b/src/component.js index 9b1327629b..cafdf33d4d 100644 --- a/src/component.js +++ b/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, NULL } from './constants'; +import { MODE_HYDRATE } 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 = NULL; + if ((vnode = vnode._parent) != null && vnode._component != null) { + vnode._dom = 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 = child._dom; break; } diff --git a/src/constants.js b/src/constants.js index 7fc20b7110..d3e6c558c4 100644 --- a/src/constants.js +++ b/src/constants.js @@ -12,7 +12,5 @@ export const SKIP_CHILDREN = 1 << 3; /** Reset all mode flags */ export const RESET_MODE = ~(MODE_HYDRATE | MODE_SUSPENDED); -export const NULL = null; -export const UNDEFINED = undefined; export const EMPTY_OBJ = /** @type {any} */ ({}); export const EMPTY_ARR = []; diff --git a/src/create-context.js b/src/create-context.js index 851b95acbc..99d514dbef 100644 --- a/src/create-context.js +++ b/src/create-context.js @@ -1,5 +1,4 @@ import { enqueueRender } from './component'; -import { NULL } from './constants'; export let i = 0; @@ -14,7 +13,7 @@ export function createContext(defaultValue) { this.getChildContext = () => ctx; this.componentWillUnmount = () => { - subs = NULL; + subs = null; }; this.shouldComponentUpdate = function (_props) { diff --git a/src/create-element.js b/src/create-element.js index 0c0990ff60..debc7fed3e 100644 --- a/src/create-element.js +++ b/src/create-element.js @@ -1,6 +1,5 @@ import { slice } from './util'; import options from './options'; -import { NULL, UNDEFINED } from './constants'; let vnodeId = 0; @@ -29,7 +28,7 @@ export function createElement(type, props, children) { arguments.length > 3 ? slice.call(arguments, 2) : children; } - return createVNode(type, normalizedProps, key, ref, NULL); + return createVNode(type, normalizedProps, key, ref, null); } /** @@ -53,25 +52,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, - constructor: UNDEFINED, - _original: original == NULL ? ++vnodeId : original, + _dom: null, + _component: null, + constructor: void 0, + _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) { @@ -84,4 +83,4 @@ export function Fragment(props) { * @returns {vnode is VNode} */ export const isValidElement = vnode => - vnode != NULL && vnode.constructor == UNDEFINED; + vnode != null && vnode.constructor == void 0; diff --git a/src/diff/catch-error.js b/src/diff/catch-error.js index ada46f1942..2bd607f797 100644 --- a/src/diff/catch-error.js +++ b/src/diff/catch-error.js @@ -1,5 +1,3 @@ -import { NULL } from '../constants'; - /** * Find the closest error boundary to a thrown error and call it * @param {object} error The thrown value @@ -22,12 +20,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; } diff --git a/src/diff/children.js b/src/diff/children.js index 7f401a0373..752ae07581 100644 --- a/src/diff/children.js +++ b/src/diff/children.js @@ -1,13 +1,6 @@ import { diff, unmount, applyRef } from './index'; import { createVNode, Fragment } from '../create-element'; -import { - EMPTY_OBJ, - EMPTY_ARR, - INSERT_VNODE, - MATCHED, - UNDEFINED, - NULL -} from '../constants'; +import { EMPTY_OBJ, EMPTY_ARR, INSERT_VNODE, MATCHED } from '../constants'; import { isArray } from '../util'; import { getDomSibling } from '../component'; @@ -80,7 +73,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). @@ -111,7 +104,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, @@ -120,7 +113,7 @@ export function diffChildren( ); } - if (firstChildDom == NULL && newDom != NULL) { + if (firstChildDom == null && newDom != null) { firstChildDom = newDom; } @@ -129,7 +122,7 @@ export function diffChildren( oldVNode._children === childVNode._children ) { oldDom = insert(childVNode, oldDom, parentDom); - } else if (typeof childVNode.type == 'function' && result !== UNDEFINED) { + } else if (typeof childVNode.type == 'function' && result !== void 0) { oldDom = result; } else if (newDom) { oldDom = newDom.nextSibling; @@ -175,11 +168,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.
{reuse}{reuse}
) in the same diff, @@ -193,21 +186,21 @@ 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) { + } else if (childVNode.constructor == void 0 && childVNode._depth > 0) { // VNode is already in use, clone it. This can happen in the following // scenario: // const reuse =
@@ -216,7 +209,7 @@ function constructNewChildrenArray( childVNode.type, childVNode.props, childVNode.key, - childVNode.ref ? childVNode.ref : NULL, + childVNode.ref ? childVNode.ref : null, childVNode._original ); } else { @@ -237,7 +230,7 @@ function constructNewChildrenArray( remainingOldChildren )); - oldVNode = NULL; + oldVNode = null; if (matchingIndex != -1) { oldVNode = oldChildren[matchingIndex]; remainingOldChildren--; @@ -249,7 +242,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) { @@ -321,7 +314,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); } @@ -361,13 +354,13 @@ function insert(parentVNode, oldDom, parentDom) { if (oldDom && parentVNode.type && !oldDom.parentNode) { 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; } @@ -380,7 +373,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); @@ -422,10 +415,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 && childVNode.key == null) || + (oldVNode === null && childVNode.key == null) || (oldVNode && key == oldVNode.key && type == oldVNode.type && diff --git a/src/diff/index.js b/src/diff/index.js index 18f16d3454..b9a0af76ee 100644 --- a/src/diff/index.js +++ b/src/diff/index.js @@ -2,10 +2,8 @@ import { EMPTY_OBJ, MODE_HYDRATE, MODE_SUSPENDED, - NULL, RESET_MODE, - SKIP_CHILDREN, - UNDEFINED + SKIP_CHILDREN } from '../constants'; import { BaseComponent, getDomSibling } from '../component'; import { Fragment } from '../create-element'; @@ -62,7 +60,7 @@ export function diff( // When passing through createElement it assigns the object // constructor as undefined. This to prevent JSON-injection. - if (newVNode.constructor != UNDEFINED) return NULL; + if (newVNode.constructor != void 0) return null; // If the previous diff bailed out, resume creating/hydrating. if (oldVNode._flags & MODE_SUSPENDED) { @@ -123,11 +121,11 @@ export function diff( } // Invoke getDerivedStateFromProps - if (isClassComponent && c._nextState == NULL) { + if (isClassComponent && c._nextState == null) { c._nextState = c.state; } - if (isClassComponent && newType.getDerivedStateFromProps != NULL) { + if (isClassComponent && newType.getDerivedStateFromProps != null) { if (c._nextState == c.state) { c._nextState = assign({}, c._nextState); } @@ -146,28 +144,28 @@ export function diff( if (isNew) { if ( isClassComponent && - newType.getDerivedStateFromProps == NULL && - c.componentWillMount != NULL + newType.getDerivedStateFromProps == null && + c.componentWillMount != null ) { c.componentWillMount(); } - if (isClassComponent && c.componentDidMount != NULL) { + if (isClassComponent && c.componentDidMount != null) { c._renderCallbacks.push(c.componentDidMount); } } else { if ( isClassComponent && - newType.getDerivedStateFromProps == NULL && + newType.getDerivedStateFromProps == null && newProps !== oldProps && - c.componentWillReceiveProps != NULL + c.componentWillReceiveProps != null ) { c.componentWillReceiveProps(newProps, componentContext); } if ( (!c._force && - c.shouldComponentUpdate != NULL && + c.shouldComponentUpdate != null && c.shouldComponentUpdate( newProps, c._nextState, @@ -204,11 +202,11 @@ export function diff( break outer; } - if (c.componentWillUpdate != NULL) { + if (c.componentWillUpdate != null) { c.componentWillUpdate(newProps, c._nextState, componentContext); } - if (isClassComponent && c.componentDidUpdate != NULL) { + if (isClassComponent && c.componentDidUpdate != null) { c._renderCallbacks.push(() => { c.componentDidUpdate(oldProps, oldState, snapshot); }); @@ -263,16 +261,16 @@ export function diff( // Handle setState called in render, see #2553 c.state = c._nextState; - if (c.getChildContext != NULL) { + if (c.getChildContext != null) { globalContext = assign({}, globalContext, c.getChildContext()); } - if (isClassComponent && !isNew && c.getSnapshotBeforeUpdate != NULL) { + if (isClassComponent && !isNew && c.getSnapshotBeforeUpdate != null) { snapshot = c.getSnapshotBeforeUpdate(oldProps, oldState); } let isTopLevelFragment = - tmp != NULL && tmp.type === Fragment && tmp.key == NULL; + tmp != null && tmp.type === Fragment && tmp.key == null; let renderResult = tmp; if (isTopLevelFragment) { @@ -301,12 +299,12 @@ export function diff( } if (clearProcessingException) { - c._pendingError = c._processingException = NULL; + c._pendingError = c._processingException = null; } } catch (e) { - newVNode._original = NULL; + newVNode._original = null; // if hydrating or creating initial tree, bailout preserves DOM: - if (isHydrating || excessDomChildren != NULL) { + if (isHydrating || excessDomChildren != null) { if (e.then) { let commentMarkersToFind = 0, done = false; @@ -318,7 +316,7 @@ export function diff( newVNode._component._excess = []; for (let i = 0; i < excessDomChildren.length; i++) { let child = excessDomChildren[i]; - if (child == NULL || done) continue; + if (child == null || done) continue; // When we encounter a boundary with $s we are opening // a boundary, this implies that we need to bump @@ -332,7 +330,7 @@ export function diff( newVNode._component._excess.push(child); } commentMarkersToFind++; - excessDomChildren[i] = NULL; + excessDomChildren[i] = null; } else if (child.nodeType == 8 && child.data == '/$s') { commentMarkersToFind--; if (commentMarkersToFind > 0) { @@ -340,10 +338,10 @@ export function diff( } done = commentMarkersToFind === 0; oldDom = excessDomChildren[i]; - excessDomChildren[i] = NULL; + excessDomChildren[i] = null; } else if (commentMarkersToFind > 0) { newVNode._component._excess.push(child); - excessDomChildren[i] = NULL; + excessDomChildren[i] = null; } } @@ -352,7 +350,7 @@ export function diff( oldDom = oldDom.nextSibling; } - excessDomChildren[excessDomChildren.indexOf(oldDom)] = NULL; + excessDomChildren[excessDomChildren.indexOf(oldDom)] = null; newVNode._component._excess = [oldDom]; } @@ -417,7 +415,7 @@ export function commitRoot(commitQueue, root, refQueue) { function cloneNode(node) { if ( typeof node != 'object' || - node == NULL || + node == null || (node._depth && node._depth > 0) ) { return node; @@ -476,7 +474,7 @@ function diffElementNodes( else if (nodeType == 'math') namespace = 'http://www.w3.org/1998/Math/MathML'; else if (!namespace) namespace = 'http://www.w3.org/1999/xhtml'; - if (excessDomChildren != NULL) { + if (excessDomChildren != null) { for (i = 0; i < excessDomChildren.length; i++) { value = excessDomChildren[i]; @@ -489,14 +487,14 @@ function diffElementNodes( (nodeType ? value.localName == nodeType : value.nodeType == 3) ) { dom = value; - excessDomChildren[i] = NULL; + excessDomChildren[i] = null; break; } } } - if (dom == NULL) { - if (nodeType == NULL) { + if (dom == null) { + if (nodeType == null) { return document.createTextNode(newProps); } @@ -514,10 +512,10 @@ function diffElementNodes( isHydrating = false; } // we created a new parent, so none of the previously attached children can be reused: - excessDomChildren = NULL; + excessDomChildren = null; } - if (nodeType == NULL) { + if (nodeType == null) { // During hydration, we still have to split merged text from SSR'd HTML. if (oldProps !== newProps && (!isHydrating || dom.data != newProps)) { dom.data = newProps; @@ -531,7 +529,7 @@ function diffElementNodes( // If we are in a situation where we are not hydrating but are using // existing DOM (e.g. replaceNode) we should read the existing DOM // attributes to diff them - if (!isHydrating && excessDomChildren != NULL) { + if (!isHydrating && excessDomChildren != null) { oldProps = {}; for (i = 0; i < dom.attributes.length; i++) { value = dom.attributes[i]; @@ -551,7 +549,7 @@ function diffElementNodes( ) { continue; } - setProperty(dom, i, NULL, value, namespace); + setProperty(dom, i, null, value, namespace); } } @@ -610,7 +608,7 @@ function diffElementNodes( ); // Remove children that are not part of any vnode. - if (excessDomChildren != NULL) { + if (excessDomChildren != null) { for (i = excessDomChildren.length; i--; ) { removeNode(excessDomChildren[i]); } @@ -620,10 +618,10 @@ function diffElementNodes( // As above, don't diff props during hydration if (!isHydrating) { i = 'value'; - if (nodeType == 'progress' && inputValue == NULL) { + if (nodeType == 'progress' && inputValue == null) { dom.removeAttribute('value'); } else if ( - inputValue != UNDEFINED && + inputValue != void 0 && // #2756 For the -element the initial value is 0, // despite the attribute not being present. When the attribute // is missing the progress bar is treated as indeterminate. @@ -634,7 +632,7 @@ function diffElementNodes( } i = 'checked'; - if (checked != UNDEFINED && checked != dom[i]) { + if (checked != void 0 && checked != dom[i]) { setProperty(dom, i, checked, oldProps[i], namespace); } } @@ -658,7 +656,7 @@ export function applyRef(ref, value, vnode) { ref._unmount(); } - if (!hasRefUnmount || value != NULL) { + if (!hasRefUnmount || value != null) { // Store the cleanup function on the function // instance object itself to avoid shape // transitioning vnode @@ -683,11 +681,11 @@ export function unmount(vnode, parentVNode, skipRemove) { if ((r = vnode.ref)) { if (!r.current || r.current == vnode._dom) { - applyRef(r, NULL, parentVNode); + applyRef(r, null, parentVNode); } } - if ((r = vnode._component) != NULL) { + if ((r = vnode._component) != null) { if (r.componentWillUnmount) { try { r.componentWillUnmount(); @@ -696,7 +694,7 @@ export function unmount(vnode, parentVNode, skipRemove) { } } - r._parentDom = NULL; + r._parentDom = null; } if ((r = vnode._children)) { @@ -715,7 +713,7 @@ export function unmount(vnode, parentVNode, skipRemove) { removeNode(vnode._dom); } - vnode._component = vnode._parent = vnode._dom = UNDEFINED; + vnode._component = vnode._parent = vnode._dom = void 0; } /** The `.render()` method for a PFC backing instance. */ diff --git a/src/diff/props.js b/src/diff/props.js index 62ef825b92..307c63f165 100644 --- a/src/diff/props.js +++ b/src/diff/props.js @@ -1,10 +1,9 @@ -import { NULL } from '../constants'; import options from '../options'; function setStyle(style, key, value) { if (key[0] == '-') { - style.setProperty(key, value == NULL ? '' : value); - } else if (value == NULL) { + style.setProperty(key, value == null ? '' : value); + } else if (value == null) { style[key] = ''; } else { style[key] = value; @@ -114,7 +113,7 @@ export function setProperty(dom, name, value, oldValue, namespace) { name in dom ) { try { - dom[name] = value == NULL ? '' : value; + dom[name] = value == null ? '' : value; // labelled break is 1b smaller here than a return statement (sorry) break o; } catch (e) {} @@ -129,7 +128,7 @@ export function setProperty(dom, name, value, oldValue, namespace) { if (typeof value == 'function') { // never serialize functions as attribute values - } else if (value != NULL && (value !== false || name[4] == '-')) { + } else if (value != null && (value !== false || name[4] == '-')) { dom.setAttribute(name, name == 'popover' && value == true ? '' : value); } else { dom.removeAttribute(name); @@ -151,7 +150,7 @@ function createEventProxy(useCapture) { return function (e) { if (this._listeners) { const eventHandler = this._listeners[e.type + useCapture]; - if (e._dispatched == NULL) { + if (e._dispatched == null) { e._dispatched = eventClock++; // When `e._dispatched` is smaller than the time when the targeted event diff --git a/src/render.js b/src/render.js index 3817b7eacc..d0358b2eb4 100644 --- a/src/render.js +++ b/src/render.js @@ -1,4 +1,4 @@ -import { EMPTY_OBJ, MODE_HYDRATE, NULL } from './constants'; +import { EMPTY_OBJ, MODE_HYDRATE } from './constants'; import { commitRoot, diff } from './diff/index'; import { createElement, Fragment } from './create-element'; import options from './options'; @@ -25,9 +25,9 @@ export function render(vnode, parentDom) { // this by assigning a new `_children` property to DOM nodes which points // to the last rendered tree. By default this property is not present, which // means that we are mounting a new tree for the first time. - let oldVNode = isHydrating ? NULL : parentDom._children; + let oldVNode = isHydrating ? null : parentDom._children; - vnode = parentDom._children = createElement(Fragment, NULL, [vnode]); + vnode = parentDom._children = createElement(Fragment, null, [vnode]); // List of effects that need to be called after diffing. let commitQueue = [], @@ -41,11 +41,12 @@ export function render(vnode, parentDom) { EMPTY_OBJ, parentDom.namespaceURI, oldVNode - ? NULL + ? null : parentDom.firstChild ? slice.call(parentDom.childNodes) - : NULL, + : null, commitQueue, + // @ts-expect-error TODO: Legitimate type mismatch that our use of `NULL` hid oldVNode ? oldVNode._dom : parentDom.firstChild, isHydrating, refQueue