refactor(perf): 让 props 只构造一次, 降低复杂度且提高性能

This commit is contained in:
lihao.ylh 2021-06-25 17:23:02 +08:00
parent 17db25f53f
commit 1a107bc67a
4 changed files with 13 additions and 7 deletions

View File

@ -173,7 +173,7 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
this.props = new Props(this, props, extras); this.props = new Props(this, props, extras);
this._children = new NodeChildren(this as ParentalNode, this.initialChildren(children)); this._children = new NodeChildren(this as ParentalNode, this.initialChildren(children));
this._children.internalInitParent(); this._children.internalInitParent();
this.props.import( this.props.merge(
this.upgradeProps(this.initProps(props || {})), this.upgradeProps(this.initProps(props || {})),
this.upgradeProps(extras || {}), this.upgradeProps(extras || {}),
); );

View File

@ -218,6 +218,7 @@ export class Prop implements IPropParent {
* set value, val should be JSON Object * set value, val should be JSON Object
*/ */
setValue(val: CompositeValue) { setValue(val: CompositeValue) {
if (val === this._value) return;
const editor = this.owner.document?.designer.editor; const editor = this.owner.document?.designer.editor;
const oldValue = this._value; const oldValue = this._value;
this._value = val; this._value = val;
@ -231,7 +232,7 @@ export class Prop implements IPropParent {
} else if (Array.isArray(val)) { } else if (Array.isArray(val)) {
this._type = 'list'; this._type = 'list';
} else if (isPlainObject(val)) { } else if (isPlainObject(val)) {
if (isJSSlot(val) && this.options.skipSetSlot !== true) { if (isJSSlot(val)) {
this.setAsSlot(val); this.setAsSlot(val);
} else if (isJSExpression(val)) { } else if (isJSExpression(val)) {
this._type = 'expression'; this._type = 'expression';

View File

@ -64,9 +64,9 @@ export class Props implements IPropParent {
}); });
if (Array.isArray(value)) { if (Array.isArray(value)) {
this.type = 'list'; this.type = 'list';
this.items = value.map(item => new Prop(this, item.value, item.name, item.spread, { skipSetSlot: true })); this.items = value.map(item => new Prop(this, item.value, item.name, item.spread));
} else if (value != null) { } else if (value != null) {
this.items = Object.keys(value).map(key => new Prop(this, value[key], key, false, { skipSetSlot: true })); this.items = Object.keys(value).map(key => new Prop(this, value[key], key, false));
} }
if (extras) { if (extras) {
Object.keys(extras).forEach(key => { Object.keys(extras).forEach(key => {
@ -96,10 +96,15 @@ export class Props implements IPropParent {
originItems.forEach(item => item.purge()); originItems.forEach(item => item.purge());
} }
merge(value: PropsMap) { merge(value: PropsMap, extras?: PropsMap) {
Object.keys(value).forEach(key => { Object.keys(value).forEach(key => {
this.query(key, true)!.setValue(value[key]); this.query(key, true)!.setValue(value[key]);
}); });
if (extras) {
Object.keys(extras).forEach(key => {
this.query(getConvertedExtraKey(key), true)!.setValue(extras[key]);
});
}
} }
export(stage: TransformStage = TransformStage.Save): { props?: PropsMap | PropsList; extras?: object } { export(stage: TransformStage = TransformStage.Save): { props?: PropsMap | PropsList; extras?: object } {

View File

@ -33,13 +33,13 @@ export function initNodeReducer(props, node) {
// 2. 结构为 JSExpression 并且带有 events 字段 // 2. 结构为 JSExpression 并且带有 events 字段
if ((item.name === 'fieldId' && value) || (isJSExpression(value) && value.events)) { if ((item.name === 'fieldId' && value) || (isJSExpression(value) && value.events)) {
if (newProps[item.name] && !node.props.has(item.name)) { if (newProps[item.name] && !node.props.has(item.name)) {
node.props.add(value, item.name, false, { skipSetSlot: true }); node.props.add(value, item.name, false);
} }
return; return;
} }
newProps[item.name] = item.initial(node as any, newProps[item.name]); newProps[item.name] = item.initial(node as any, newProps[item.name]);
if (newProps[item.name] && !node.props.has(item.name)) { if (newProps[item.name] && !node.props.has(item.name)) {
node.props.add(value, item.name, false, { skipSetSlot: true }); node.props.add(value, item.name, false);
} }
} catch (e) { } catch (e) {
if (hasOwnProperty(props, item.name)) { if (hasOwnProperty(props, item.name)) {