@zeus-js/runtime-dom 0.1.1-beta.1 → 0.1.1-beta.11

package/dist/runtime-dom.cjs

@@ -1,5 +1,5 @@
 /**
-* runtime-dom v0.1.1-beta.1
+* runtime-dom v0.1.1-beta.11
 * (c) 2026 baicie
 * Released under the MIT License.
 **/
@@ -426,22 +426,14 @@ function stringifyText(value) {
 function setAttr(el, name, value) {
 	const attrName = normalizeAttrName(name);
 	const propName = getBooleanDomPropertyName(name);
-	if (propName && el instanceof HTMLElement) {
-		el[propName] = Boolean(value);
-		if (value == null || value === false) el.removeAttribute(attrName);
-		else if (value === true) el.setAttribute(attrName, "");
-		else el.setAttribute(attrName, String(value));
-		return;
-	}
-	if (value == null || value === false) {
-		el.removeAttribute(attrName);
-		return;
+	const serialized = value == null || value === false ? null : value === true ? "" : String(value);
+	if (serialized === null ? !el.hasAttribute(attrName) : el.getAttribute(attrName) === serialized) {
+		if (!propName || !(el instanceof HTMLElement)) return;
+		if (Boolean(value) === Boolean(el[propName])) return;
 	}
-	if (value === true) {
-		el.setAttribute(attrName, "");
-		return;
-	}
-	el.setAttribute(attrName, String(value));
+	if (propName && el instanceof HTMLElement) el[propName] = Boolean(value);
+	if (serialized === null) el.removeAttribute(attrName);
+	else el.setAttribute(attrName, serialized);
 }
 function getBooleanDomPropertyName(name) {
 	return BOOLEAN_DOM_PROPERTY_NAME[name];
@@ -465,9 +457,7 @@ function normalizeAttrName(name) {
 	return name === "className" ? "class" : name;
 }
 function bindAttr(el, name, value, once = false) {
-	applyBinding(value, once, (next) => {
-		setAttr(el, name, next);
-	});
+	applyBinding(value, once, (next) => setAttr(el, name, next));
 }
 function bindProp(el, name, value, once = false) {
 	applyBinding(value, once, (next) => {
@@ -501,42 +491,45 @@ function bindStyle(el, value, once = false) {
 			prev = void 0;
 			return;
 		}
-		patchStyle(el, prev, next);
-		prev = next;
+		prev = patchStyle(el, prev, next);
 	});
 }
 function patchStyle(el, prev, next) {
 	const style = el.style;
-	if (prev) {
-		for (const key in prev) if (!(key in next)) style.setProperty(toKebabCase$2(key), "");
+	const values = prev ? prev[0] : Object.create(null);
+	const keys = Object.keys(next);
+	const state = style.cssText + keys.join(",");
+	const styleChanged = prev && state != prev[1];
+	let wrote = false;
+	for (const key in values) if (!(key in next)) {
+		style.setProperty(key.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`), "");
+		wrote = true;
+		delete values[key];
 	}
 	for (const key in next) {
 		const value = next[key];
-		const name = toKebabCase$2(key);
-		if (value == null) style.setProperty(name, "");
-		else style.setProperty(name, normalizeStyleValue(key, value));
+		const expected = value == null ? "" : normalizeStyleValue(key, value);
+		if (values[key] === expected && !styleChanged) continue;
+		style.setProperty(key.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`), expected);
+		wrote = true;
+		values[key] = expected;
 	}
+	return prev && !wrote ? prev : [values, style.cssText + keys.join(",")];
 }
 function normalizeStyleValue(key, value) {
-	if (typeof value === "number" && value !== 0 && !isUnitlessNumber(key)) return `${value}px`;
+	if (typeof value === "number" && value !== 0 && unitlessNumbers[key] !== true) return `${value}px`;
 	return String(value);
 }
-const unitlessNumbers = /* @__PURE__ */ new Set([
-	"opacity",
-	"zIndex",
-	"fontWeight",
-	"lineHeight",
-	"flex",
-	"flexGrow",
-	"flexShrink",
-	"order"
-]);
-function isUnitlessNumber(key) {
-	return unitlessNumbers.has(key);
-}
-function toKebabCase$2(value) {
-	return value.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
-}
+const unitlessNumbers = {
+	opacity: true,
+	zIndex: true,
+	fontWeight: true,
+	lineHeight: true,
+	flex: true,
+	flexGrow: true,
+	flexShrink: true,
+	order: true
+};
 //#endregion
 //#region packages/core/runtime-dom/src/events.ts
 const delegatedEvents = /* @__PURE__ */ new Set();
@@ -740,7 +733,9 @@ function mountIndexFor(parent, marker, each, render) {
 function mountKeyedFor(parent, marker, each, key, render) {
 	let records = [];
 	const subtreeContext = captureScopedSubtreeContext();
-	let latestEntries = [];
+	let latestItems = [];
+	const latestKeys = [];
+	let latestItemsUseFixedSlots = false;
 	let reconcileRequested = false;
 	let reconciling = false;
 	let disposed = false;
@@ -754,7 +749,7 @@ function mountKeyedFor(parent, marker, each, key, render) {
 		for (const record of currentRecords) disposeListRecord(record);
 	};
 	(0, _zeus_js_signal_internal.onScopeDispose)(dispose, true);
-	const reconcile = (nextEntries) => {
+	const reconcileEntries = (nextEntries) => {
 		if (disposed) return;
 		const oldMap = /* @__PURE__ */ new Map();
 		for (const record of records) oldMap.set(record.key, record);
@@ -767,7 +762,10 @@ function mountKeyedFor(parent, marker, each, key, render) {
 					const oldRecord = oldMap.get(itemKey);
 					if (oldRecord) {
 						oldMap.delete(itemKey);
-						oldRecord.setItem(() => item);
+						if (!Object.is(oldRecord.item, item)) {
+							oldRecord.item = item;
+							oldRecord.setItem(() => item);
+						}
 						oldRecord.setIndex(i);
 						nextRecords.push(oldRecord);
 					} else {
@@ -775,6 +773,7 @@ function mountKeyedFor(parent, marker, each, key, render) {
 						const [readIndex, setIndex] = (0, _zeus_js_signal_internal.createSignal)(i);
 						const subtree = new ScopedSubtree(parent, marker, subtreeContext);
 						const record = {
+							item,
 							key: itemKey,
 							setItem,
 							setIndex,
@@ -831,13 +830,48 @@ function mountKeyedFor(parent, marker, each, key, render) {
 			throw error;
 		}
 	};
+	const reconcileLatestItems = () => {
+		if (disposed) return;
+		if (latestItemsUseFixedSlots) {
+			const items = latestItems;
+			(0, _zeus_js_signal_internal.batch)(() => {
+				for (let i = 0; i < items.length; i++) {
+					const item = items[i];
+					const record = records[i];
+					if (!Object.is(record.item, item)) {
+						record.item = item;
+						record.setItem(() => item);
+					}
+				}
+			});
+			if (!disposed) emitDevtoolsEvent({
+				type: "mount-for",
+				length: records.length
+			});
+			return;
+		}
+		const items = latestItems;
+		const nextEntries = [];
+		const nextKeys = /* @__PURE__ */ new Set();
+		for (let i = 0; i < items.length; i++) {
+			const item = items[i];
+			const itemKey = latestKeys[i];
+			if (nextKeys.has(itemKey)) throw duplicateKeyError(itemKey, i);
+			nextKeys.add(itemKey);
+			nextEntries.push({
+				item,
+				key: itemKey
+			});
+		}
+		reconcileEntries(nextEntries);
+	};
 	const drainReconciliations = () => {
 		if (reconciling) return;
 		reconciling = true;
 		try {
 			while (reconcileRequested) {
 				reconcileRequested = false;
-				(0, _zeus_js_signal_internal.untrack)(() => reconcile(latestEntries));
+				(0, _zeus_js_signal_internal.untrack)(reconcileLatestItems);
 			}
 		} finally {
 			reconciling = false;
@@ -854,19 +888,16 @@ function mountKeyedFor(parent, marker, each, key, render) {
 		runner = (0, _zeus_js_signal_internal.effect)(() => {
 			var _each2;
 			const nextItems = (_each2 = each()) !== null && _each2 !== void 0 ? _each2 : [];
-			const nextEntries = [];
-			const nextKeys = /* @__PURE__ */ new Set();
+			let useFixedSlots = nextItems.length === records.length;
 			for (let i = 0; i < nextItems.length; i++) {
 				const item = nextItems[i];
 				const itemKey = key(item, i);
-				if (nextKeys.has(itemKey)) throw duplicateKeyError(itemKey, i);
-				nextKeys.add(itemKey);
-				nextEntries.push({
-					item,
-					key: itemKey
-				});
+				latestKeys[i] = itemKey;
+				if (useFixedSlots && !Object.is(itemKey, records[i].key)) useFixedSlots = false;
 			}
-			latestEntries = nextEntries;
+			latestKeys.length = nextItems.length;
+			latestItems = nextItems;
+			latestItemsUseFixedSlots = useFixedSlots;
 		}, { scheduler: scheduleReconciliation });
 	} catch (error) {
 		dispose();

package/dist/runtime-dom.esm-browser.js

@@ -1,5 +1,5 @@
 /**
-* runtime-dom v0.1.1-beta.1
+* runtime-dom v0.1.1-beta.11
 * (c) 2026 baicie
 * Released under the MIT License.
 **/
@@ -278,7 +278,8 @@ var ReactiveEffect = class {
 	trigger() {
 		if (this.flags & 64) pausedQueueEffects.add(this);
 		else if (this.scheduler) this.scheduler();
-		else this.runIfDirty();
+		else if (this.flags & 128) this.runIfDirty();
+		else this.run();
 	}
 	/**
 	* @internal
@@ -573,6 +574,7 @@ var Dep = class {
 	}
 	track(debugInfo) {
 		if (!activeSub || !shouldTrack || activeSub === this.computed) return;
+		if (this.computed) activeSub.flags |= 128;
 		let link = this.activeLink;
 		if (link === void 0 || link.sub !== activeSub) {
 			link = this.activeLink = new Link(activeSub, this);
@@ -1825,22 +1827,14 @@ function stringifyText(value) {
 function setAttr(el, name, value) {
 	const attrName = normalizeAttrName(name);
 	const propName = getBooleanDomPropertyName(name);
-	if (propName && el instanceof HTMLElement) {
-		el[propName] = Boolean(value);
-		if (value == null || value === false) el.removeAttribute(attrName);
-		else if (value === true) el.setAttribute(attrName, "");
-		else el.setAttribute(attrName, String(value));
-		return;
-	}
-	if (value == null || value === false) {
-		el.removeAttribute(attrName);
-		return;
+	const serialized = value == null || value === false ? null : value === true ? "" : String(value);
+	if (serialized === null ? !el.hasAttribute(attrName) : el.getAttribute(attrName) === serialized) {
+		if (!propName || !(el instanceof HTMLElement)) return;
+		if (Boolean(value) === Boolean(el[propName])) return;
 	}
-	if (value === true) {
-		el.setAttribute(attrName, "");
-		return;
-	}
-	el.setAttribute(attrName, String(value));
+	if (propName && el instanceof HTMLElement) el[propName] = Boolean(value);
+	if (serialized === null) el.removeAttribute(attrName);
+	else el.setAttribute(attrName, serialized);
 }
 function getBooleanDomPropertyName(name) {
 	return BOOLEAN_DOM_PROPERTY_NAME[name];
@@ -1864,9 +1858,7 @@ function normalizeAttrName(name) {
 	return name === "className" ? "class" : name;
 }
 function bindAttr(el, name, value, once = false) {
-	applyBinding(value, once, (next) => {
-		setAttr(el, name, next);
-	});
+	applyBinding(value, once, (next) => setAttr(el, name, next));
 }
 function bindProp(el, name, value, once = false) {
 	applyBinding(value, once, (next) => {
@@ -1900,42 +1892,45 @@ function bindStyle(el, value, once = false) {
 			prev = void 0;
 			return;
 		}
-		patchStyle(el, prev, next);
-		prev = next;
+		prev = patchStyle(el, prev, next);
 	});
 }
 function patchStyle(el, prev, next) {
 	const style = el.style;
-	if (prev) {
-		for (const key in prev) if (!(key in next)) style.setProperty(toKebabCase$2(key), "");
+	const values = prev ? prev[0] : Object.create(null);
+	const keys = Object.keys(next);
+	const state = style.cssText + keys.join(",");
+	const styleChanged = prev && state != prev[1];
+	let wrote = false;
+	for (const key in values) if (!(key in next)) {
+		style.setProperty(key.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`), "");
+		wrote = true;
+		delete values[key];
 	}
 	for (const key in next) {
 		const value = next[key];
-		const name = toKebabCase$2(key);
-		if (value == null) style.setProperty(name, "");
-		else style.setProperty(name, normalizeStyleValue(key, value));
+		const expected = value == null ? "" : normalizeStyleValue(key, value);
+		if (values[key] === expected && !styleChanged) continue;
+		style.setProperty(key.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`), expected);
+		wrote = true;
+		values[key] = expected;
 	}
+	return prev && !wrote ? prev : [values, style.cssText + keys.join(",")];
 }
 function normalizeStyleValue(key, value) {
-	if (typeof value === "number" && value !== 0 && !isUnitlessNumber(key)) return `${value}px`;
+	if (typeof value === "number" && value !== 0 && unitlessNumbers[key] !== true) return `${value}px`;
 	return String(value);
 }
-const unitlessNumbers = /* @__PURE__ */ new Set([
-	"opacity",
-	"zIndex",
-	"fontWeight",
-	"lineHeight",
-	"flex",
-	"flexGrow",
-	"flexShrink",
-	"order"
-]);
-function isUnitlessNumber(key) {
-	return unitlessNumbers.has(key);
-}
-function toKebabCase$2(value) {
-	return value.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
-}
+const unitlessNumbers = {
+	opacity: true,
+	zIndex: true,
+	fontWeight: true,
+	lineHeight: true,
+	flex: true,
+	flexGrow: true,
+	flexShrink: true,
+	order: true
+};
 //#endregion
 //#region packages/core/runtime-dom/src/events.ts
 const delegatedEvents = /* @__PURE__ */ new Set();
@@ -2139,7 +2134,9 @@ function mountIndexFor(parent, marker, each, render) {
 function mountKeyedFor(parent, marker, each, key, render) {
 	let records = [];
 	const subtreeContext = captureScopedSubtreeContext();
-	let latestEntries = [];
+	let latestItems = [];
+	const latestKeys = [];
+	let latestItemsUseFixedSlots = false;
 	let reconcileRequested = false;
 	let reconciling = false;
 	let disposed = false;
@@ -2153,7 +2150,7 @@ function mountKeyedFor(parent, marker, each, key, render) {
 		for (const record of currentRecords) disposeListRecord(record);
 	};
 	onScopeDispose(dispose, true);
-	const reconcile = (nextEntries) => {
+	const reconcileEntries = (nextEntries) => {
 		if (disposed) return;
 		const oldMap = /* @__PURE__ */ new Map();
 		for (const record of records) oldMap.set(record.key, record);
@@ -2166,7 +2163,10 @@ function mountKeyedFor(parent, marker, each, key, render) {
 					const oldRecord = oldMap.get(itemKey);
 					if (oldRecord) {
 						oldMap.delete(itemKey);
-						oldRecord.setItem(() => item);
+						if (!Object.is(oldRecord.item, item)) {
+							oldRecord.item = item;
+							oldRecord.setItem(() => item);
+						}
 						oldRecord.setIndex(i);
 						nextRecords.push(oldRecord);
 					} else {
@@ -2174,6 +2174,7 @@ function mountKeyedFor(parent, marker, each, key, render) {
 						const [readIndex, setIndex] = createSignal(i);
 						const subtree = new ScopedSubtree(parent, marker, subtreeContext);
 						const record = {
+							item,
 							key: itemKey,
 							setItem,
 							setIndex,
@@ -2230,13 +2231,48 @@ function mountKeyedFor(parent, marker, each, key, render) {
 			throw error;
 		}
 	};
+	const reconcileLatestItems = () => {
+		if (disposed) return;
+		if (latestItemsUseFixedSlots) {
+			const items = latestItems;
+			batch(() => {
+				for (let i = 0; i < items.length; i++) {
+					const item = items[i];
+					const record = records[i];
+					if (!Object.is(record.item, item)) {
+						record.item = item;
+						record.setItem(() => item);
+					}
+				}
+			});
+			if (!disposed) emitDevtoolsEvent({
+				type: "mount-for",
+				length: records.length
+			});
+			return;
+		}
+		const items = latestItems;
+		const nextEntries = [];
+		const nextKeys = /* @__PURE__ */ new Set();
+		for (let i = 0; i < items.length; i++) {
+			const item = items[i];
+			const itemKey = latestKeys[i];
+			if (nextKeys.has(itemKey)) throw duplicateKeyError(itemKey, i);
+			nextKeys.add(itemKey);
+			nextEntries.push({
+				item,
+				key: itemKey
+			});
+		}
+		reconcileEntries(nextEntries);
+	};
 	const drainReconciliations = () => {
 		if (reconciling) return;
 		reconciling = true;
 		try {
 			while (reconcileRequested) {
 				reconcileRequested = false;
-				untrack(() => reconcile(latestEntries));
+				untrack(reconcileLatestItems);
 			}
 		} finally {
 			reconciling = false;
@@ -2253,19 +2289,16 @@ function mountKeyedFor(parent, marker, each, key, render) {
 		runner = effect(() => {
 			var _each2;
 			const nextItems = (_each2 = each()) !== null && _each2 !== void 0 ? _each2 : [];
-			const nextEntries = [];
-			const nextKeys = /* @__PURE__ */ new Set();
+			let useFixedSlots = nextItems.length === records.length;
 			for (let i = 0; i < nextItems.length; i++) {
 				const item = nextItems[i];
 				const itemKey = key(item, i);
-				if (nextKeys.has(itemKey)) throw duplicateKeyError(itemKey, i);
-				nextKeys.add(itemKey);
-				nextEntries.push({
-					item,
-					key: itemKey
-				});
+				latestKeys[i] = itemKey;
+				if (useFixedSlots && !Object.is(itemKey, records[i].key)) useFixedSlots = false;
 			}
-			latestEntries = nextEntries;
+			latestKeys.length = nextItems.length;
+			latestItems = nextItems;
+			latestItemsUseFixedSlots = useFixedSlots;
 		}, { scheduler: scheduleReconciliation });
 	} catch (error) {
 		dispose();