From 8ed6e1ff5a7cdc1fad8ca63829b98ba18a964e0d Mon Sep 17 00:00:00 2001 From: Andre Wiggins Date: Mon, 18 Jan 2021 14:31:01 -0800 Subject: [PATCH 1/4] Move excess dom children cleanup to diffElementNodes (-5 B) --- src/diff/children.js | 7 ------- src/diff/index.js | 7 +++++++ 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/diff/children.js b/src/diff/children.js index d8b40170d1..45cec30652 100644 --- a/src/diff/children.js +++ b/src/diff/children.js @@ -228,13 +228,6 @@ export function diffChildren( newParentVNode._dom = firstChildDom; - // Remove children that are not part of any vnode. - if (excessDomChildren != null && typeof newParentVNode.type != 'function') { - for (i = excessDomChildren.length; i--; ) { - if (excessDomChildren[i] != null) removeNode(excessDomChildren[i]); - } - } - // Remove remaining oldChildren if there are any. for (i = oldChildrenLength; i--; ) { if (oldChildren[i] != null) { diff --git a/src/diff/index.js b/src/diff/index.js index 46517aa3b9..2ee8785965 100644 --- a/src/diff/index.js +++ b/src/diff/index.js @@ -412,6 +412,13 @@ function diffElementNodes( EMPTY_OBJ, isHydrating ); + + // Remove children that are not part of any vnode. + if (excessDomChildren != null) { + for (i = excessDomChildren.length; i--; ) { + if (excessDomChildren[i] != null) removeNode(excessDomChildren[i]); + } + } } // (as above, don't diff props during hydration) From 24dd7608911611f9c33ab65dab11431443e21613 Mon Sep 17 00:00:00 2001 From: Andre Wiggins Date: Mon, 18 Jan 2021 14:44:57 -0800 Subject: [PATCH 2/4] Remove EMPTY_OBJ hack in diffChildren (-9 B) --- src/diff/children.js | 14 -------------- src/diff/index.js | 2 +- src/render.js | 8 ++++++-- 3 files changed, 7 insertions(+), 17 deletions(-) diff --git a/src/diff/children.js b/src/diff/children.js index 45cec30652..6550709fec 100644 --- a/src/diff/children.js +++ b/src/diff/children.js @@ -44,20 +44,6 @@ export function diffChildren( let oldChildrenLength = oldChildren.length; - // Only in very specific places should this logic be invoked (top level `render` and `diffElementNodes`). - // I'm using `EMPTY_OBJ` to signal when `diffChildren` is invoked in these situations. I can't use `null` - // for this purpose, because `null` is a valid value for `oldDom` which can mean to skip to this logic - // (e.g. if mounting a new tree in which the old DOM should be ignored (usually for Fragments). - if (oldDom == EMPTY_OBJ) { - if (excessDomChildren != null) { - oldDom = excessDomChildren[0]; - } else if (oldChildrenLength) { - oldDom = getDomSibling(oldParentVNode, 0); - } else { - oldDom = null; - } - } - newParentVNode._children = []; for (i = 0; i < renderResult.length; i++) { childVNode = renderResult[i]; diff --git a/src/diff/index.js b/src/diff/index.js index 2ee8785965..c88f74553d 100644 --- a/src/diff/index.js +++ b/src/diff/index.js @@ -409,7 +409,7 @@ function diffElementNodes( newVNode.type === 'foreignObject' ? false : isSvg, excessDomChildren, commitQueue, - EMPTY_OBJ, + dom.firstChild, isHydrating ); diff --git a/src/render.js b/src/render.js index 47a60ba073..d09a54eaad 100644 --- a/src/render.js +++ b/src/render.js @@ -45,11 +45,15 @@ export function render(vnode, parentDom, replaceNode) { ? [replaceNode] : oldVNode ? null - : parentDom.childNodes.length + : parentDom.firstChild ? EMPTY_ARR.slice.call(parentDom.childNodes) : null, commitQueue, - replaceNode || EMPTY_OBJ, + !isHydrating && replaceNode + ? replaceNode + : oldVNode + ? oldVNode._dom + : parentDom.firstChild, isHydrating ); From 0c3ebdc896e154c8dd999911d4d653b77b153edf Mon Sep 17 00:00:00 2001 From: Andre Wiggins Date: Mon, 18 Jan 2021 14:48:29 -0800 Subject: [PATCH 3/4] Remove unused excessDomChildren check in placeChild (-8 B) --- src/diff/children.js | 9 +-------- 1 file changed, 1 insertion(+), 8 deletions(-) diff --git a/src/diff/children.js b/src/diff/children.js index 6550709fec..5afcd5dc9e 100644 --- a/src/diff/children.js +++ b/src/diff/children.js @@ -171,7 +171,6 @@ export function diffChildren( childVNode, oldVNode, oldChildren, - excessDomChildren, newDom, oldDom ); @@ -258,7 +257,6 @@ function reorderChildren(childVNode, oldDom, parentDom) { vnode, vnode, childVNode._children, - null, vnode._dom, oldDom ); @@ -293,7 +291,6 @@ function placeChild( childVNode, oldVNode, oldChildren, - excessDomChildren, newDom, oldDom ) { @@ -310,14 +307,10 @@ function placeChild( // can clean up the property childVNode._nextDom = undefined; } else if ( - excessDomChildren == oldVNode || + oldVNode == null || newDom != oldDom || newDom.parentNode == null ) { - // NOTE: excessDomChildren==oldVNode above: - // This is a compression of excessDomChildren==null && oldVNode==null! - // The values only have the same type when `null`. - outer: if (oldDom == null || oldDom.parentNode !== parentDom) { parentDom.appendChild(newDom); nextDom = null; From 2ce0fb19c3c434dd80ffc4792f6941c060b0ace9 Mon Sep 17 00:00:00 2001 From: Andre Wiggins Date: Mon, 18 Jan 2021 15:52:21 -0800 Subject: [PATCH 4/4] Fix linting --- src/diff/children.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/diff/children.js b/src/diff/children.js index 5afcd5dc9e..a2d59c2f00 100644 --- a/src/diff/children.js +++ b/src/diff/children.js @@ -1,7 +1,6 @@ import { diff, unmount, applyRef } from './index'; import { createVNode, Fragment } from '../create-element'; import { EMPTY_OBJ, EMPTY_ARR } from '../constants'; -import { removeNode } from '../util'; import { getDomSibling } from '../component'; /**