perf: improve basic message performance furhter

src/container/element-list/element-list.tsx

@@ -122,8 +122,10 @@ export class ElementList extends React.Component {
 			return;
 		}
 
-		targetElement.setHighlighted(false);
-		targetElement.setPlaceholderHighlighted(false);
+		Mobx.transaction(() => {
+			targetElement.setHighlighted(false);
+			targetElement.setPlaceholderHighlighted(false);
+		});
 	}
 
 	private handleDragOver(e: React.DragEvent<HTMLElement>): void {
@@ -139,35 +141,33 @@ export class ElementList extends React.Component {
 
 		const draggedElement = store.getDraggedElement();
 
-		if (!targetContent || !visualTargetElement) {
+		if (!targetContent || !visualTargetElement || !draggedElement) {
 			return;
 		}
 
+		const higlightedElement = store.getHighlightedElement();
+		const placeholderHighlightedElement = store.getPlaceHolderHighhlightedElement();
+
+		const higlightedElementContent = store.getHighlightedElementContent();
+		const accepted = targetContent.accepts(draggedElement);
+
 		Mobx.transaction(() => {
-			if (!draggedElement) {
+			if (!accepted) {
 				targetContent.setHighlighted(false);
 				visualTargetElement.setPlaceholderHighlighted(false);
 				return;
 			}
 
-			store
-				.getProject()
-				.getElementContents()
-				.filter(sec => sec.getHighlighted() && sec !== targetContent)
-				.forEach(se => se.setHighlighted(false));
-
-			store
-				.getProject()
-				.getElements()
-				.filter(se => se.getHighlighted() && se !== visualTargetElement)
-				.forEach(se => se.setHighlighted(false));
+			if (placeholderHighlightedElement) {
+				placeholderHighlightedElement.setPlaceholderHighlighted(false);
+			}
 
-			const accepted = targetContent.accepts(draggedElement);
+			if (higlightedElement) {
+				higlightedElement.setPlaceholderHighlighted(false);
+			}
 
-			if (!accepted) {
-				targetContent.setHighlighted(false);
-				visualTargetElement.setPlaceholderHighlighted(false);
-				return;
+			if (higlightedElementContent) {
+				higlightedElementContent.setHighlighted(false);
 			}
 
 			e.dataTransfer.dropEffect = 'copy';
@@ -195,13 +195,15 @@ export class ElementList extends React.Component {
 			return;
 		}
 
-		draggedElement.setDragged(true);
-		store.setSelectedElement(draggedElement);
-
 		if (this.dragImg) {
 			e.dataTransfer.effectAllowed = 'copy';
 			e.dataTransfer.setDragImage(this.dragImg, 75, 15);
 		}
+
+		Mobx.transaction(() => {
+			draggedElement.setDragged(true);
+			store.setSelectedElement(draggedElement);
+		});
 	}
 
 	private handleDrop(e: React.DragEvent<HTMLElement>): void {

src/electron/create-edit-message-handler.ts

@@ -2,7 +2,7 @@ import * as Clipboard from './clipboard';
 import * as Message from '../message';
 import { requestApp } from './request-app';
 import * as Types from '../types';
-import * as uuid from 'uuid';
+// import * as uuid from 'uuid';
 
 import {
 	ServerMessageHandlerContext,
@@ -59,7 +59,8 @@ export async function createEditMessageHandler(
 				break;
 			}
 			case Message.MessageType.Paste: {
-				const clipboard = Clipboard.getClipboard();
+				// Disabled pending investigation
+				/* const clipboard = Clipboard.getClipboard();
 
 				if (!clipboard) {
 					return;
@@ -93,7 +94,7 @@ export async function createEditMessageHandler(
 								project: clipboard.payload.project
 							}
 						});
-				}
+				}*/
 			}
 		}
 	};
@@ -109,14 +110,3 @@ function serializeItemType(type: Types.ItemType): Types.SerializedItemType {
 			return 'none';
 	}
 }
-
-function deserializeItemType(type: Types.SerializedItemType): Types.ItemType {
-	switch (type) {
-		case 'element':
-			return Types.ItemType.Element;
-		case 'page':
-			return Types.ItemType.Page;
-		case 'none':
-			return Types.ItemType.None;
-	}
-}

src/model/alva-app.ts

@@ -184,9 +184,7 @@ export class AlvaApp {
 	}
 
 	@Mobx.action
-	public update(raw: AlvaApp | Types.SerializedAlvaApp): void {
-		const b = raw instanceof AlvaApp ? raw : AlvaApp.from(raw);
-
+	public update(b: AlvaApp): void {
 		this.activeView = b.activeView;
 		this.panes = b.panes;
 		this.paneSizes = b.paneSizes;

src/model/element-action.ts

@@ -249,12 +249,7 @@ export class ElementAction {
 	}
 
 	@Mobx.action
-	public update(raw: this | Types.SerializedElementAction): void {
-		const b =
-			raw instanceof ElementAction
-				? raw
-				: ElementAction.from(raw, { userStore: this.userStore });
-
+	public update(b: this): void {
 		this.id = b.id;
 		this.payload = b.payload;
 		this.payloadType = b.payloadType;

src/model/element/element-content.ts

@@ -251,8 +251,7 @@ export class ElementContent {
 	}
 
 	@Mobx.action
-	public update(raw: ElementContent | Types.SerializedElementContent): void {
-		const b = raw instanceof ElementContent ? raw.toJSON() : raw;
+	public update(b: ElementContent): void {
 		this.elementIds = b.elementIds;
 		this.forcedOpen = b.forcedOpen;
 		this.highlighted = b.highlighted;

src/model/element/element-property/element-property.ts

@@ -208,12 +208,10 @@ export class ElementProperty {
 	}
 
 	@Mobx.action
-	public update(b: ElementProperty | Types.SerializedElementProperty): void {
-		const data = b instanceof ElementProperty ? b.toJSON() : b;
-
-		this.id = data.id;
-		this.patternPropertyId = data.patternPropertyId;
-		this.setDefault = data.setDefault;
-		this.value = data.value;
+	public update(b: ElementProperty): void {
+		this.id = b.id;
+		this.patternPropertyId = b.patternPropertyId;
+		this.setDefault = b.setDefault;
+		this.value = b.value;
 	}
 }

src/model/element/element.ts

@@ -656,9 +656,7 @@ export class Element {
 	}
 
 	@Mobx.action
-	public update(b: Element | Types.SerializedElement): void {
-		const e = b instanceof Element ? b : Element.from(b, { project: this.project });
-
+	public update(b: Element): void {
 		if (this.selected) {
 			this.project.unsetSelectedElement();
 		}
@@ -669,22 +667,22 @@ export class Element {
 
 		const propsChanges = computeDifference({
 			before: this.getProperties(),
-			after: e.getProperties()
+			after: b.getProperties()
 		});
 
 		propsChanges.removed.forEach(change => this.removeProperty(change.before));
 		propsChanges.added.forEach(change => this.addProperty(change.after));
 		propsChanges.changed.forEach(change => change.before.update(change.after));
 
-		this.shouldHighlight = e.shouldHighlight;
-		this.dragged = e.dragged;
-		this.shouldFocus = e.focused;
-		this.containerId = e.containerId;
-		this.name = e.name;
-		this.open = e.open;
-		this.forcedOpen = e.forcedOpen;
-		this.shouldPlaceholderHighlight = e.placeholderHighlighted;
-		this.selected = e.selected;
+		this.shouldHighlight = b.shouldHighlight;
+		this.dragged = b.dragged;
+		this.shouldFocus = b.focused;
+		this.containerId = b.containerId;
+		this.name = b.name;
+		this.open = b.open;
+		this.forcedOpen = b.forcedOpen;
+		this.shouldPlaceholderHighlight = b.placeholderHighlighted;
+		this.selected = b.selected;
 	}
 }
 

src/model/page/page.ts

@@ -273,8 +273,7 @@ export class Page {
 		};
 	}
 
-	public update(raw: Page | Types.SerializedPage): void {
-		const b = raw instanceof Page ? raw.toJSON() : raw;
+	public update(b: Page): void {
 		this.active = b.active;
 		this.name = b.name;
 		this.rootId = b.rootId;

src/model/pattern-library/pattern-library.ts

@@ -379,9 +379,7 @@ export class PatternLibrary {
 	}
 
 	@Mobx.action
-	public update(raw: PatternLibrary | Types.SerializedPatternLibrary): void {
-		const b = raw instanceof PatternLibrary ? raw : PatternLibrary.from(raw);
-
+	public update(b: PatternLibrary): void {
 		this.bundleId = b.bundleId;
 		this.bundle = b.bundle;
 		this.description = b.description;

src/model/pattern-property/asset-property.ts

@@ -47,8 +47,7 @@ export class PatternAssetProperty extends PatternPropertyBase<string | undefined
 		};
 	}
 
-	public update(raw: PatternAssetProperty | Types.SerializedPatternAssetProperty): void {
-		const prop = raw instanceof PatternAssetProperty ? raw : PatternAssetProperty.from(raw);
+	public update(prop: PatternAssetProperty): void {
 		this.contextId = prop.getContextId();
 		this.defaultValue = prop.getDefaultValue();
 		this.description = prop.getDescription();

src/model/pattern-property/boolean-property.ts

@@ -49,8 +49,7 @@ export class PatternBooleanProperty extends PatternPropertyBase<boolean | undefi
 		};
 	}
 
-	public update(raw: PatternBooleanProperty | Types.SerializedPatternBooleanProperty): void {
-		const prop = raw instanceof PatternBooleanProperty ? raw : PatternBooleanProperty.from(raw);
+	public update(prop: PatternBooleanProperty): void {
 		this.contextId = prop.getContextId();
 		this.defaultValue = prop.getDefaultValue();
 		this.description = prop.getDescription();

src/model/pattern-property/enum-property.ts

@@ -111,8 +111,7 @@ export class PatternEnumProperty extends PatternPropertyBase<EnumValue | undefin
 		};
 	}
 
-	public update(raw: PatternEnumProperty | Types.SerializedPatternEnumProperty): void {
-		const prop = raw instanceof PatternEnumProperty ? raw : PatternEnumProperty.from(raw);
+	public update(prop: PatternEnumProperty): void {
 		this.contextId = prop.getContextId();
 		this.defaultOptionId = prop.getDefaultOptionId();
 		this.example = prop.getExample();

src/model/pattern-property/event-handler-property.ts

@@ -110,9 +110,7 @@ export class PatternEventHandlerProperty extends PatternPropertyBase<string[]> {
 		};
 	}
 
-	public update(raw: this | Types.SerializedPatternEventHandlerProperty): void {
-		const prop =
-			raw instanceof PatternEventHandlerProperty ? raw : PatternEventHandlerProperty.from(raw);
+	public update(prop: this): void {
 		this.contextId = prop.getContextId();
 		this.description = prop.getDescription();
 		this.event = prop.getEvent();

src/model/pattern-property/href-property.ts

@@ -47,8 +47,7 @@ export class PatternHrefProperty extends PatternPropertyBase<string | undefined>
 		};
 	}
 
-	public update(raw: PatternHrefProperty | Types.SerializedHrefProperty): void {
-		const prop = raw instanceof PatternHrefProperty ? raw : PatternHrefProperty.from(raw);
+	public update(prop: PatternHrefProperty): void {
 		this.contextId = prop.getContextId();
 		this.description = prop.getDescription();
 		this.defaultValue = prop.getDefaultValue();

src/model/pattern-property/number-property.ts

@@ -51,8 +51,7 @@ export class PatternNumberProperty extends PatternPropertyBase<number | undefine
 		};
 	}
 
-	public update(raw: PatternNumberProperty | Types.SerializedPatternNumberProperty): void {
-		const prop = raw instanceof PatternNumberProperty ? raw : PatternNumberProperty.from(raw);
+	public update(prop: PatternNumberProperty): void {
 		this.contextId = prop.getContextId();
 		this.defaultValue = prop.getDefaultValue();
 		this.description = prop.getDescription();

src/model/pattern-property/string-property.ts

@@ -54,8 +54,7 @@ export class PatternStringProperty extends PatternPropertyBase<string | undefine
 		};
 	}
 
-	public update(raw: PatternStringProperty | Types.SerializedStringProperty): void {
-		const prop = raw instanceof PatternStringProperty ? raw : PatternStringProperty.from(raw);
+	public update(prop: PatternStringProperty): void {
 		this.contextId = prop.getContextId();
 		this.description = prop.getDescription();
 		this.defaultValue = prop.getDefaultValue();

src/model/pattern/pattern-slot.ts

@@ -96,14 +96,12 @@ export class PatternSlot {
 		};
 	}
 
-	public update(raw: PatternSlot | Types.SerializedPatternSlot): void {
-		const b = raw instanceof PatternSlot ? raw.toJSON() : raw;
-
+	public update(b: PatternSlot): void {
 		this.contextId = b.contextId;
 		this.description = b.description;
 		this.example = b.example;
 		this.hidden = b.hidden;
-		this.displayName = b.label;
+		this.displayName = b.displayName;
 		this.propertyName = b.propertyName;
 		this.required = b.required;
 		this.type = toSlotType(b.type);

src/model/pattern/pattern.ts

@@ -151,12 +151,7 @@ export class Pattern {
 		};
 	}
 
-	public update(raw: Pattern | Types.SerializedPattern, context?: PatternContext): void {
-		const pattern =
-			raw instanceof Pattern
-				? raw
-				: Pattern.from(raw, context || { patternLibrary: this.patternLibrary });
-
+	public update(pattern: Pattern, context?: PatternContext): void {
 		this.contextId = pattern.getContextId();
 		this.description = pattern.getDescription();
 		this.exportName = pattern.getExportName();

src/model/project.ts

@@ -669,11 +669,24 @@ export class Project {
 					return;
 				}
 
-				const changedData = object.toJSON();
-				changedData[change.key] = change.newValue;
+				if (!object.hasOwnProperty(change.key)) {
+					return;
+				}
+
+				const ValueModel =
+					typeof change.newValue === 'object'
+						? ModelTree.getModelByName((change.newValue as AnyModel).model)
+						: undefined;
+
+				const value = ValueModel
+					? ValueModel.from(change.newValue, { project: this })
+					: change.newValue;
+
+				if (typeof value === 'object' && !ValueModel) {
+					return;
+				}
 
-				// tslint:disable-next-line:no-any
-				(object.update as any)(changedData);
+				object[change.key] = value;
 			}
 
 			if (message.payload.change.hasOwnProperty('index')) {

src/model/user-store-action/user-store-action.ts

@@ -109,13 +109,11 @@ export class UserStoreAction {
 	}
 
 	@Mobx.action
-	public update(raw: this | Types.SerializedUserStoreAction): void {
-		const b = raw instanceof UserStoreAction ? raw.toJSON() : raw;
-
+	public update(b: this): void {
 		this.acceptsProperty = b.acceptsProperty;
 		this.id = b.id;
 		this.name = b.name;
-		this.userStorePropertyId = b.storePropertyId;
+		this.userStorePropertyId = b.userStorePropertyId;
 		this.type = deserializeType(b.type);
 	}
 }