From 3b51b223ab16c9a56973de8138bd0db5a0ae6c82 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8D=93=E5=87=8C?= Date: Wed, 4 Sep 2019 14:02:02 +0800 Subject: [PATCH 1/2] refactor: optimize performance of remove children --- packages/driver-dom/src/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/driver-dom/src/index.js b/packages/driver-dom/src/index.js index 0897b6696d..ff4a7254d0 100644 --- a/packages/driver-dom/src/index.js +++ b/packages/driver-dom/src/index.js @@ -364,8 +364,8 @@ export function afterRender({ container }) { /** * Remove all children from node. - * @NOTE: Fast path support in web. + * @NOTE: Optimization at web. */ export function removeChildren(node) { - node.innerHTML = ''; + node.textContent = ''; } From 794a7ca07ee3267449185d216e4a5366a6ad4728 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8D=93=E5=87=8C?= Date: Wed, 4 Sep 2019 15:43:54 +0800 Subject: [PATCH 2/2] chore: use isNull to replace xxx === null --- packages/rax/src/hooks.js | 6 +++--- packages/rax/src/types.js | 6 ++++++ packages/rax/src/vdom/instantiateComponent.js | 4 ++-- packages/rax/src/vdom/native.js | 4 ++-- packages/rax/src/vdom/shallowEqual.js | 4 ++-- packages/rax/src/vdom/shouldUpdateComponent.js | 6 +++--- 6 files changed, 18 insertions(+), 12 deletions(-) diff --git a/packages/rax/src/hooks.js b/packages/rax/src/hooks.js index 46c55f5c8a..1933b5e8cb 100644 --- a/packages/rax/src/hooks.js +++ b/packages/rax/src/hooks.js @@ -1,7 +1,7 @@ import Host from './vdom/host'; import { scheduleEffect, flushEffect } from './vdom/scheduler'; import { is } from './vdom/shallowEqual'; -import { isFunction } from './types'; +import {isFunction, isNull} from './types'; import { invokeMinifiedError } from './error'; function getCurrentInstance() { @@ -22,7 +22,7 @@ function getCurrentRenderingInstance() { } function areInputsEqual(inputs, prevInputs) { - if (prevInputs === null || inputs.length !== prevInputs.length) { + if (isNull(prevInputs) || inputs.length !== prevInputs.length) { return false; } @@ -198,7 +198,7 @@ export function useMemo(create, inputs) { hooks[hookID] = [create(), inputs]; } else { const prevInputs = hooks[hookID][1]; - if (inputs === null || !areInputsEqual(inputs, prevInputs)) { + if (isNull(inputs) || !areInputsEqual(inputs, prevInputs)) { hooks[hookID] = [create(), inputs]; } } diff --git a/packages/rax/src/types.js b/packages/rax/src/types.js index f18088aab5..556ffed064 100644 --- a/packages/rax/src/types.js +++ b/packages/rax/src/types.js @@ -1,3 +1,9 @@ +export const NULL = null; + +export function isNull(obj) { + return obj === NULL; +} + export function isFunction(obj) { return typeof obj === 'function'; } diff --git a/packages/rax/src/vdom/instantiateComponent.js b/packages/rax/src/vdom/instantiateComponent.js index fec61f69a0..5a2137496a 100644 --- a/packages/rax/src/vdom/instantiateComponent.js +++ b/packages/rax/src/vdom/instantiateComponent.js @@ -1,11 +1,11 @@ import Host from './host'; -import { isString, isNumber, isObject, isArray } from '../types'; +import {isString, isNumber, isObject, isArray, isNull} from '../types'; import { invokeMinifiedError } from '../error'; function instantiateComponent(element) { let instance; - if (element === undefined || element === null || element === false || element === true) { + if (element === undefined || isNull(element) || element === false || element === true) { instance = new Host.Empty(); } else if (isArray(element)) { instance = new Host.Fragment(element); diff --git a/packages/rax/src/vdom/native.js b/packages/rax/src/vdom/native.js index f77b7619af..1b8a566c2a 100644 --- a/packages/rax/src/vdom/native.js +++ b/packages/rax/src/vdom/native.js @@ -6,7 +6,7 @@ import getElementKeyName from './getElementKeyName'; import Instance from './instance'; import BaseComponent from './base'; import toArray from './toArray'; -import { isFunction, isArray } from '../types'; +import {isFunction, isArray, isNull} from '../types'; const STYLE = 'style'; const CHILDREN = 'children'; @@ -345,7 +345,7 @@ class NativeComponent extends BaseComponent { // `driver.removeChildren` is optional driver protocol. let shouldRemoveAllChildren = Boolean( driver.removeChildren - && nextChildrenElements === null || nextChildrenElements && nextChildrenElements.length === 0 + && isNull(nextChildrenElements) || nextChildrenElements && nextChildrenElements.length === 0 ); // Unmount children that are no longer present. diff --git a/packages/rax/src/vdom/shallowEqual.js b/packages/rax/src/vdom/shallowEqual.js index 41bd028f12..7a62f489b8 100644 --- a/packages/rax/src/vdom/shallowEqual.js +++ b/packages/rax/src/vdom/shallowEqual.js @@ -1,4 +1,4 @@ -import { isObject } from '../types'; +import {isNull, isObject} from '../types'; const hasOwnProperty = {}.hasOwnProperty; @@ -28,7 +28,7 @@ export default function shallowEqual(objA, objB) { return true; } - if (!isObject(objA) || objA === null || !isObject(objB) || objB === null) { + if (!isObject(objA) || isNull(objA) || !isObject(objB) || isNull(objB)) { return false; } diff --git a/packages/rax/src/vdom/shouldUpdateComponent.js b/packages/rax/src/vdom/shouldUpdateComponent.js index ec0eaf552c..6b71bb3256 100644 --- a/packages/rax/src/vdom/shouldUpdateComponent.js +++ b/packages/rax/src/vdom/shouldUpdateComponent.js @@ -1,8 +1,8 @@ -import { isArray, isString, isNumber, isObject } from '../types'; +import {isArray, isString, isNumber, isObject, isNull} from '../types'; function shouldUpdateComponent(prevElement, nextElement) { - let prevEmpty = prevElement === null; - let nextEmpty = nextElement === null; + let prevEmpty = isNull(prevElement); + let nextEmpty = isNull(nextElement); if (prevEmpty || nextEmpty) { return prevEmpty === nextEmpty; }