@reckona/mreact-compat 0.0.169 → 0.0.170

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reckona/mreact-compat",
-  "version": "0.0.169",
+  "version": "0.0.170",
   "description": "React-compatible runtime implementation for mreact.",
   "keywords": [
     "compatibility",
@@ -69,7 +69,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@reckona/mreact-reactive-core": "0.0.169",
-    "@reckona/mreact-shared": "0.0.169"
+    "@reckona/mreact-shared": "0.0.170",
+    "@reckona/mreact-reactive-core": "0.0.170"
   }
 }

package/src/dom-children.ts

@@ -45,6 +45,10 @@ export function syncScopedChildNodes(
   after: ChildNode | null,
   nextNodes: readonly Node[],
 ): void {
+  if (replaceEmptyFullChildList(parent, before, after, nextNodes)) {
+    return;
+  }
+
   if (replaceDisjointFullChildList(parent, before, after, nextNodes)) {
     return;
   }
@@ -57,6 +61,10 @@ export function syncScopedChildNodes(
     return;
   }
 
+  if (nextNodes.length > 16 && moveSingleSwappedPair(parent, before, after, nextNodes)) {
+    return;
+  }
+
   let cursor = parent.firstChild;
 
   if (before !== null) {
@@ -91,6 +99,25 @@ export function syncScopedChildNodes(
   }
 }
 
+function replaceEmptyFullChildList(
+  parent: ParentNode,
+  before: ChildNode | null,
+  after: ChildNode | null,
+  nextNodes: readonly Node[],
+): boolean {
+  if (
+    before !== null ||
+    after !== null ||
+    nextNodes.length <= 16 ||
+    parent.childNodes.length !== 0
+  ) {
+    return false;
+  }
+
+  parent.replaceChildren(...nextNodes);
+  return true;
+}
+
 function replaceDisjointFullChildList(
   parent: ParentNode,
   before: ChildNode | null,
@@ -177,6 +204,57 @@ function removeSingleMissingChild(
   return true;
 }
 
+function moveSingleSwappedPair(
+  parent: ParentNode,
+  before: ChildNode | null,
+  after: ChildNode | null,
+  nextNodes: readonly Node[],
+): boolean {
+  let cursor = before === null ? parent.firstChild : before.nextSibling;
+  let index = 0;
+  let firstMismatchIndex = -1;
+  let secondMismatchIndex = -1;
+  let firstCurrent: ChildNode | null = null;
+  let secondCurrent: ChildNode | null = null;
+
+  while (cursor !== null && cursor !== after && index < nextNodes.length) {
+    const current = cursor;
+
+    if (current !== nextNodes[index]) {
+      if (firstMismatchIndex === -1) {
+        firstMismatchIndex = index;
+        firstCurrent = current;
+      } else if (secondMismatchIndex === -1) {
+        secondMismatchIndex = index;
+        secondCurrent = current;
+      } else {
+        return false;
+      }
+    }
+
+    cursor = current.nextSibling;
+    index += 1;
+  }
+
+  if (
+    index !== nextNodes.length ||
+    cursor !== after ||
+    firstCurrent === null ||
+    secondCurrent === null ||
+    firstCurrent !== nextNodes[secondMismatchIndex] ||
+    secondCurrent !== nextNodes[firstMismatchIndex]
+  ) {
+    return false;
+  }
+
+  parent.insertBefore(secondCurrent, firstCurrent);
+  parent.insertBefore(
+    firstCurrent,
+    (nextNodes[secondMismatchIndex + 1] as ChildNode | undefined) ?? after,
+  );
+  return true;
+}
+
 export function removeChildIfPresent(parent: ParentNode, child: Node): void {
   if (child.parentNode !== parent) {
     return;

package/src/element.ts

@@ -100,17 +100,21 @@ export function createElement<P extends object>(
   type: ElementType<P>,
   config: (P & ReactReservedProps) | null,
   ...children: ReactCompatNode[]
+): ReactCompatElement<P>;
+export function createElement<P extends object>(
+  type: ElementType<P>,
+  config: (P & ReactReservedProps) | null,
 ): ReactCompatElement<P> {
+  const childCount = arguments.length - 2;
+
   if (typeof type === "string") {
     const key = config?.key === undefined ? null : String(config.key);
     const ref = config?.ref ?? null;
-    const props = copyElementProps(config) as P & { children?: ReactCompatNode };
+    const props = copyCreateElementProps(config) as P & {
+      children?: ReactCompatNode;
+    };
 
-    if (children.length === 1) {
-      props.children = children[0];
-    } else if (children.length > 1) {
-      props.children = children;
-    }
+    assignCreateElementChildren(props, childCount, arguments);
 
     setHostOwnPropsMeta(props);
 
@@ -127,15 +131,14 @@ export function createElement<P extends object>(
     typeof type === "object" && type !== null ? normalizeElementType(type) : type;
   const key = config?.key === undefined ? null : String(config.key);
   const ref = config?.ref ?? null;
-  const props = applyDefaultProps(normalizedType, copyElementProps(config)) as P & {
+  const props = applyDefaultProps(
+    normalizedType,
+    copyCreateElementProps(config),
+  ) as P & {
     children?: ReactCompatNode;
   };
 
-  if (children.length === 1) {
-    props.children = children[0];
-  } else if (children.length > 1) {
-    props.children = children;
-  }
+  assignCreateElementChildren(props, childCount, arguments);
 
   if (typeof normalizedType === "string") {
     setHostOwnPropsMeta(props);
@@ -150,6 +153,30 @@ export function createElement<P extends object>(
   };
 }
 
+function assignCreateElementChildren(
+  props: { children?: ReactCompatNode },
+  childCount: number,
+  args: IArguments,
+): void {
+  if (childCount === 1) {
+    props.children = args[2] as ReactCompatNode;
+    return;
+  }
+
+  if (childCount <= 1) {
+    return;
+  }
+
+  const children: ReactCompatNode[] = [];
+  children.length = childCount;
+
+  for (let index = 0; index < childCount; index += 1) {
+    children[index] = args[index + 2] as ReactCompatNode;
+  }
+
+  props.children = children;
+}
+
 /** Creates a React-compatible element from JSX runtime arguments. */
 export function createElementFromJsxConfig<P extends object>(
   type: ElementType<P>,
@@ -312,6 +339,7 @@ function copyElementProps(
   source: object | null | undefined,
   base?: object,
   omitChildren = false,
+  copySymbols: boolean | "internal" = true,
 ): Record<string, unknown> {
   const props: Record<PropertyKey, unknown> = {};
 
@@ -324,7 +352,40 @@ function copyElementProps(
   }
 
   copyOwnStringElementProps(source, props, omitChildren);
-  copyOwnSymbolElementProps(source, props);
+  if (copySymbols === "internal") {
+    copyInternalElementSymbolProps(source, props);
+  } else if (copySymbols) {
+    copyOwnSymbolElementProps(source, props);
+  }
+  return props as Record<string, unknown>;
+}
+
+function copyCreateElementProps(
+  source: object | null | undefined,
+): Record<string, unknown> {
+  const props: Record<PropertyKey, unknown> = {};
+
+  if (source === null || source === undefined) {
+    return props as Record<string, unknown>;
+  }
+
+  const stringSource = source as Record<string, unknown>;
+  for (const name in source) {
+    if (!hasOwnProperty.call(source, name)) {
+      continue;
+    }
+
+    if (
+      name !== "key" &&
+      name !== "ref" &&
+      name !== "__self" &&
+      name !== "__source"
+    ) {
+      props[name] = stringSource[name];
+    }
+  }
+
+  copyInternalElementSymbolProps(source, props);
   return props as Record<string, unknown>;
 }
 
@@ -361,6 +422,16 @@ function copyOwnSymbolElementProps(
   }
 }
 
+function copyInternalElementSymbolProps(
+  source: object,
+  target: Record<PropertyKey, unknown>,
+): void {
+  const symbolSource = source as Record<PropertyKey, unknown>;
+  if (hasOwnProperty.call(source, REACTIVE_TEXT_BINDING_META)) {
+    target[REACTIVE_TEXT_BINDING_META] = symbolSource[REACTIVE_TEXT_BINDING_META];
+  }
+}
+
 function normalizeElementType<P>(type: ElementType<P>): ElementType<P> {
   return isReactCompatContextProviderShorthand(type) ? (type.Provider as ElementType<P>) : type;
 }

package/src/hooks.ts

@@ -2214,6 +2214,10 @@ function cleanupInactiveInstances(runtime: RootRuntime): void {
     return;
   }
 
+  if (activeInstanceKeys.size === runtime.instances.size) {
+    return;
+  }
+
   for (const [key, instance] of runtime.instances) {
     if (!activeInstanceKeys.has(key)) {
       cleanupInstance(instance);
@@ -2224,7 +2228,7 @@ function cleanupInactiveInstances(runtime: RootRuntime): void {
 }
 
 function indexInstanceKey(runtime: RootRuntime, key: string): void {
-  for (const prefix of instanceKeyPrefixes(key)) {
+  forEachInstanceKeyPrefix(key, (prefix) => {
     let keys = runtime.instanceKeysByPrefix.get(prefix);
 
     if (keys === undefined) {
@@ -2233,15 +2237,15 @@ function indexInstanceKey(runtime: RootRuntime, key: string): void {
     }
 
     keys.add(key);
-  }
+  });
 }
 
 function removeInstanceKeyFromIndex(runtime: RootRuntime, key: string): void {
-  for (const prefix of instanceKeyPrefixes(key)) {
+  forEachInstanceKeyPrefix(key, (prefix) => {
     const keys = runtime.instanceKeysByPrefix.get(prefix);
 
     if (keys === undefined) {
-      continue;
+      return;
     }
 
     keys.delete(key);
@@ -2249,18 +2253,27 @@ function removeInstanceKeyFromIndex(runtime: RootRuntime, key: string): void {
     if (keys.size === 0) {
       runtime.instanceKeysByPrefix.delete(prefix);
     }
-  }
+  });
 }
 
-function instanceKeyPrefixes(key: string): string[] {
-  const parts = key.split(".");
-  const prefixes: string[] = [];
+function forEachInstanceKeyPrefix(
+  key: string,
+  callback: (prefix: string) => void,
+): void {
+  let start = 0;
+
+  while (start < key.length) {
+    const next = key.indexOf(".", start);
+
+    if (next === -1) {
+      break;
+    }
 
-  for (let index = 1; index <= parts.length; index += 1) {
-    prefixes.push(parts.slice(0, index).join("."));
+    callback(key.slice(0, next));
+    start = next + 1;
   }
 
-  return prefixes;
+  callback(key);
 }
 
 function cleanupInstance(instance: ComponentInstance): void {