@kudzujs/core 0.16.28 → 0.16.30

package/README.md

@@ -14,7 +14,7 @@ Kudzu compiles ordinary React-shaped TypeScript and TSX into complete static HTM
 
 > Experimental `0.16.x`: the compiler API and supported TSX surface may change.
 
-**Current release: [0.16.28](https://github.com/kudzujs/kudzu/releases/tag/v0.16.28).** Write reusable components, native event handlers, and pure collection expressions; Kudzu specializes supported source into static content and direct browser updates.
+**Current release: [0.16.30](https://github.com/kudzujs/kudzu/releases/tag/v0.16.30).** Write reusable components, native event handlers, and pure collection expressions; Kudzu specializes supported source into static content and direct browser updates, retaining only required binding targets and capabilities.
 
 - [Documentation](https://kudzujs.cloud/docs)
 - [Installation guide](https://kudzujs.cloud/docs#install)

package/framework/binding-runtime.js

@@ -4,11 +4,11 @@ import { serializeStyle } from "./style.js"
 
 const imports = new Map()
 const bindingTargets = new Map()
-const conditionTargets = new Map()
+const conditionTargets = globalThis.__KUDZU_CONDITIONS__ && new Map()
 const mountedBindings = new WeakSet()
-const mountedConditions = new WeakSet()
+const mountedConditions = globalThis.__KUDZU_CONDITIONS__ && new WeakSet()
 const bindingRegistrations = new WeakMap()
-const conditionRegistrations = new WeakMap()
+const conditionRegistrations = globalThis.__KUDZU_CONDITIONS__ && new WeakMap()
 const textDescriptors = globalThis.__KUDZU_TEXT_BINDINGS__ && typeof document !== "undefined" ? JSON.parse(document.body.dataset.kTextBindings ?? "[]") : []
 const bindingTypes = ["class", "disabled", "value", "checked", "style"]
 const bindingSelector = [...bindingTypes.map(target => `[data-k-bind-${target}]`), "[data-k-bind-attrs]"].join(",")
@@ -16,25 +16,25 @@ const bindingSelector = [...bindingTypes.map(target => `[data-k-bind-${target}]`
 export function patchBinding(node, target, value) {
   if (globalThis.__KUDZU_TEXT_BINDINGS__ && target === "text") {
     patchText(node, value)
-  } else if (target === "disabled") {
+  } else if (globalThis.__KUDZU_DISABLED_BINDINGS__ !== false && target === "disabled") {
     node.toggleAttribute("disabled", Boolean(value))
-  } else if (target === "checked") {
+  } else if (globalThis.__KUDZU_CHECKED_BINDINGS__ !== false && target === "checked") {
     node.checked = Boolean(value)
-  } else if (target === "value") {
+  } else if (globalThis.__KUDZU_VALUE_BINDINGS__ !== false && target === "value") {
     const next = value == null ? "" : String(value)
     if (node.value !== next) node.value = next
   } else if (target === "style") {
     const style = serializeStyle(value)
     if (style) node.setAttribute("style", style)
     else node.removeAttribute("style")
-  } else if (target === "class" && (value == null || value === false)) {
+  } else if (globalThis.__KUDZU_CLASS_BINDINGS__ !== false && target === "class" && (value == null || value === false)) {
     node.removeAttribute("class")
-  } else if (target === "class") {
+  } else if (globalThis.__KUDZU_CLASS_BINDINGS__ !== false && target === "class") {
     if (node.namespaceURI === "http://www.w3.org/1999/xhtml") node.className = String(value)
     else node.setAttribute("class", String(value))
-  } else if (value == null || (value === false && !isStringBooleanAttribute(target))) {
+  } else if (globalThis.__KUDZU_ATTRIBUTE_BINDINGS__ !== false && (value == null || (value === false && !isStringBooleanAttribute(target)))) {
     node.removeAttribute(target)
-  } else {
+  } else if (globalThis.__KUDZU_ATTRIBUTE_BINDINGS__ !== false) {
     node.setAttribute(target, value === true && !isStringBooleanAttribute(target) ? "" : String(value))
   }
 }
@@ -47,6 +47,7 @@ function commitBindings(id) {
       else patchBinding(binding.node, binding.target, binding.read())
     }
   }
+  if (!globalThis.__KUDZU_CONDITIONS__) return
   const conditions = conditionTargets.get(id)
   if (!conditions) return
   for (const condition of conditions) {
@@ -57,23 +58,23 @@ function commitBindings(id) {
 
 registerCommitter(commitBindings)
 registerMountHook(mountBindings, "bindings")
-registerMountHook(mountConditions, "conditions")
+if (globalThis.__KUDZU_CONDITIONS__) registerMountHook(mountConditions, "conditions")
 registerUnmountHook(unmountBindings, "bindings")
-registerUnmountHook(unmountConditions, "conditions")
+if (globalThis.__KUDZU_CONDITIONS__) registerUnmountHook(unmountConditions, "conditions")
 registerStateReleaseHook(releaseBindings)
 
 if (typeof document !== "undefined") mountDom(document)
 
 function mountBindings(root) {
-  for (const node of matching(root, bindingSelector)) {
+  if (globalThis.__KUDZU_ELEMENT_BINDINGS__ !== false) for (const node of matching(root, bindingSelector)) {
     if (mountedBindings.has(node)) continue
     mountedBindings.add(node)
     const registrations = []
     bindingRegistrations.set(node, registrations)
-    const descriptors = bindingTypes.flatMap(target => node.hasAttribute(`data-k-bind-${target}`)
+    const descriptors = globalThis.__KUDZU_PROPERTY_BINDINGS__ !== false ? bindingTypes.flatMap(target => node.hasAttribute(`data-k-bind-${target}`)
       ? [[target, JSON.parse(node.dataset[`kBind${capitalize(target)}`])]]
-      : [])
-    if (node.dataset.kBindAttrs) descriptors.push(...JSON.parse(node.dataset.kBindAttrs).map(({ target, ...descriptor }) => [target, descriptor]))
+      : []) : []
+    if (globalThis.__KUDZU_ATTRIBUTE_BINDINGS__ !== false && node.dataset.kBindAttrs) descriptors.push(...JSON.parse(node.dataset.kBindAttrs).map(({ target, ...descriptor }) => [target, descriptor]))
     for (const [target, descriptor] of descriptors) {
       if (descriptor.state) {
         const binding = { node, target, read: Object.hasOwn(descriptor, "truthy") ? () => browserState.get(descriptor.state) ? descriptor.truthy : descriptor.falsy : () => browserState.get(descriptor.state) }
@@ -167,7 +168,7 @@ function updateCondition(condition) {
   condition.end.parentNode.insertBefore(fragment, condition.end)
   condition.current = next
   if (condition.mount) for (const node of nodes) mountDom(node)
-  const select = condition.start.closest("select[data-k-bind-value]")
+  const select = globalThis.__KUDZU_VALUE_BINDINGS__ !== false && condition.start.closest("select[data-k-bind-value]")
   if (select) {
     for (const binding of new Set((bindingRegistrations.get(select) ?? []).map(([, entry]) => entry))) {
       patchBinding(binding.node, binding.target, binding.read())
@@ -176,7 +177,7 @@ function updateCondition(condition) {
 }
 
 function unmountBindings(root) {
-  for (const node of matching(root, bindingSelector)) {
+  if (globalThis.__KUDZU_ELEMENT_BINDINGS__ !== false) for (const node of matching(root, bindingSelector)) {
     for (const [id, binding] of bindingRegistrations.get(node) ?? []) bindingTargets.get(id)?.delete(binding)
     bindingRegistrations.delete(node)
     mountedBindings.delete(node)
@@ -206,6 +207,7 @@ function releaseBindings(id) {
     bindingRegistrations.delete(binding.node)
   }
   bindingTargets.delete(id)
+  if (!globalThis.__KUDZU_CONDITIONS__) return
   for (const condition of conditionTargets.get(id) ?? []) {
     const registration = conditionRegistrations.get(condition.start)
     for (const [conditionId, entry] of registration?.registrations ?? []) conditionTargets.get(conditionId)?.delete(entry)

package/framework/build.mjs

@@ -461,7 +461,7 @@ async function buildInto(project, outputDirectory, { changedFiles, minify, quiet
       const generated = generateEffectRuntime(await readFile(new URL("./effect-runtime.js", import.meta.url), "utf8"), capabilityIR)
       await writeBundledJavaScript(join(familyDirectory, "kudzu-effect.js"), generated.source, minify, generated.define)
     }
-    if (bindings.count || lists.styleCount) await writeJavaScript(join(familyDirectory, "kudzu-style.js"), await readFile(new URL("./style.js", import.meta.url), "utf8"), minify)
+    if (bindings.style || lists.styleCount) await writeJavaScript(join(familyDirectory, "kudzu-style.js"), await readFile(new URL("./style.js", import.meta.url), "utf8"), minify)
     if (bindings.count) {
       const generated = generateBindingRuntime(await readFile(new URL("./binding-runtime.js", import.meta.url), "utf8"), capabilityIR, family.navigation)
       await writeBundledJavaScript(join(familyDirectory, "kudzu-binding.js"), generated.source, minify, generated.define)

package/framework/compiler/route-capability-planner.mjs

@@ -1,6 +1,8 @@
 import { assertRouteBuildRecord } from "./route-build-record.mjs"
 import { assertJsonSafe, assertRouteIR } from "./route-ir.mjs"
 
+const propertyBindings = ["class", "disabled", "value", "checked", "style"]
+
 export function usesRouteDependencyRuntime({ plan, navigable, hasBindings, hasLists }, validate = true) {
   if (validate) assertRouteIR(plan)
   const hasDependencies = plan.effects.some(effect => effect.dependencies?.length)
@@ -13,7 +15,7 @@ export function planRouteCapabilities(records, { navigationRouteCount = 0 } = {}
   for (const plan of plans) assertRouteIR(plan, { concrete: true })
   const commandEvents = new Set()
   const nativeEvents = new Set()
-  const bindings = { count: 0, text: false, svgConditions: false }
+  const bindings = { count: 0, text: false, style: false, conditions: false, svgConditions: false }
   const lists = {
     count: 0,
     styleCount: 0,
@@ -50,6 +52,8 @@ export function planRouteCapabilities(records, { navigationRouteCount = 0 } = {}
       if (event.native) nativeEvents.add(event.event)
     }
     bindings.text ||= plan.bindings.some(binding => binding.target === "text")
+    bindings.style ||= plan.bindings.some(binding => binding.target === "style")
+    bindings.conditions ||= plan.conditions.length > 0
     bindings.svgConditions ||= plan.conditions.some(condition => condition.svg)
     effects.any ||= plan.effects.length > 0
     effects.derivedDependencies ||= plan.effects.some(effect => effect.dependencyExpressions?.length)
@@ -90,6 +94,9 @@ export function planRouteCapabilities(records, { navigationRouteCount = 0 } = {}
     dependencyStateSeeds: routeEntries.filter(route => route.hasStateSeed && route.usesDependencyRuntime).length
   }
   bindings.count = routeEntries.filter(route => route.hasBindings).length
+  const bindingTargets = new Set(plans.flatMap(plan => plan.bindings.map(binding => binding.target)))
+  bindings.properties = propertyBindings.filter(target => bindingTargets.has(target))
+  bindings.attributes = [...bindingTargets].some(target => target !== "text" && !propertyBindings.includes(target))
   lists.count = routeEntries.filter(route => route.hasLists).length
   lists.styleCount = routeEntries.filter(route => route.hasListStyles).length
   lists.generalRowHooks ||= lists.rowRefs || lists.complexRowState
@@ -118,7 +125,9 @@ export function assertCapabilityIR(capabilityIR, records, options = {}) {
   if (!sections.every(name => isRecord(capabilityIR[name]))) throw new Error("Invalid CapabilityIR v1 structure")
   if (!["behaviors", "regularBehaviors", "regularStateSeeds", "dependencyStateSeeds"].every(name => isCount(capabilityIR.routes[name]))) throw new Error("Invalid CapabilityIR v1 route counts")
   if (!["command", "native"].every(name => Array.isArray(capabilityIR.events[name]) && capabilityIR.events[name].every(event => typeof event === "string")) || typeof capabilityIR.events.hasNativeHandlers !== "boolean") throw new Error("Invalid CapabilityIR v1 events")
-  if (!isCount(capabilityIR.bindings.count) || !["text", "svgConditions"].every(name => typeof capabilityIR.bindings[name] === "boolean")) throw new Error("Invalid CapabilityIR v1 bindings")
+  if (!isCount(capabilityIR.bindings.count) || !["text", "style", "conditions", "svgConditions", "attributes"].every(name => typeof capabilityIR.bindings[name] === "boolean")) throw new Error("Invalid CapabilityIR v1 bindings")
+  if (!Array.isArray(capabilityIR.bindings.properties) || capabilityIR.bindings.properties.some(target => !propertyBindings.includes(target)) || new Set(capabilityIR.bindings.properties).size !== capabilityIR.bindings.properties.length) throw new Error("Invalid CapabilityIR v1 binding properties")
+  if (capabilityIR.bindings.style !== capabilityIR.bindings.properties.includes("style")) throw new Error("CapabilityIR binding style flag does not match its properties")
   const listFlags = ["conditions", "svg", "deepConditions", "textRanges", "attributes", "events", "expressions", "expressionAttributes", "seeds", "effects", "rowHooks", "rowRefs", "complexRowState", "nested", "selectors", "calculated", "static", "indexes", "stableFastPaths", "generalRowHooks", "asyncParts", "mounts"]
   if (!isCount(capabilityIR.lists.count) || !isCount(capabilityIR.lists.styleCount) || !listFlags.every(name => typeof capabilityIR.lists[name] === "boolean")) throw new Error("Invalid CapabilityIR v1 lists")
   if (!["any", "derivedDependencies", "itemDependencies", "captures", "navigable", "navigableOwners"].every(name => typeof capabilityIR.effects[name] === "boolean") || !["nestedState", "setter"].every(name => typeof capabilityIR.captures[name] === "boolean") || !["shared", "dependency"].every(name => typeof capabilityIR.runtime[name] === "boolean")) throw new Error("Invalid CapabilityIR v1 effect, capture, or runtime flags")

package/framework/compiler/runtime-codegen.mjs

@@ -27,14 +27,32 @@ export function generateEffectRuntime(source, capabilityIR) {
 
 export function generateBindingRuntime(source, capabilityIR, navigable) {
   assertCapabilityIR(capabilityIR)
+  const { properties, attributes } = capabilityIR.bindings
   let runtime = replaceRequired(source, '"./shared-runtime.js"', '"./kudzu.js"', "shared runtime import", "binding-runtime.js")
   runtime = replaceRequired(runtime, '"./serialization.js"', '"./kudzu-serialization.js"', "serialization import", "binding-runtime.js")
-  runtime = replaceRequired(runtime, '"./style.js"', '"./kudzu-style.js"', "style import", "binding-runtime.js")
+  runtime = replaceRequired(runtime, /const bindingTypes = \[[^\n]+\]/, `const bindingTypes = ${JSON.stringify(properties)}`, "binding properties", "binding-runtime.js")
+  const selectors = [...properties.map(target => `[data-k-bind-${target}]`), ...(attributes ? ["[data-k-bind-attrs]"] : [])]
+  // The existing generic selector is smaller when all five property kinds are used.
+  if (properties.length !== 5 || !attributes) runtime = replaceRequired(runtime, /^const bindingSelector = .*$/m, `const bindingSelector = ${JSON.stringify(selectors.join(","))}`, "binding selectors", "binding-runtime.js")
+  runtime = capabilityIR.bindings.style
+    ? replaceRequired(runtime, '"./style.js"', '"./kudzu-style.js"', "style import", "binding-runtime.js")
+    : replaceSequenceRequired(runtime, [
+      ['import { serializeStyle } from "./style.js"\n', "", "unused style import"],
+      ['  } else if (target === "style") {\n    const style = serializeStyle(value)\n    if (style) node.setAttribute("style", style)\n    else node.removeAttribute("style")\n', "", "unused style branch"]
+    ], "binding-runtime.js")
   if (navigable) runtime = specializeNavigationTextDescriptors(runtime)
   return {
     source: runtime,
     define: {
       "globalThis.__KUDZU_TEXT_BINDINGS__": String(capabilityIR.bindings.text),
+      "globalThis.__KUDZU_ELEMENT_BINDINGS__": String(selectors.length > 0),
+      "globalThis.__KUDZU_PROPERTY_BINDINGS__": String(properties.length > 0),
+      "globalThis.__KUDZU_ATTRIBUTE_BINDINGS__": String(attributes),
+      "globalThis.__KUDZU_CLASS_BINDINGS__": String(properties.includes("class")),
+      "globalThis.__KUDZU_DISABLED_BINDINGS__": String(properties.includes("disabled")),
+      "globalThis.__KUDZU_CHECKED_BINDINGS__": String(properties.includes("checked")),
+      "globalThis.__KUDZU_VALUE_BINDINGS__": String(properties.includes("value")),
+      "globalThis.__KUDZU_CONDITIONS__": String(capabilityIR.bindings.conditions),
       "globalThis.__KUDZU_SVG_CONDITIONS__": String(capabilityIR.bindings.svgConditions),
       "globalThis.__KUDZU_CAPTURE_STATE__": String(capabilityIR.captures.nestedState)
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kudzujs/core",
-  "version": "0.16.28",
+  "version": "0.16.30",
   "description": "HTML-first TSX framework with synchronous state semantics and no virtual DOM",
   "type": "module",
   "license": "MIT",