reworked mounting for more performance

Benchmarks/SwiftBenchmarks/Benchmarks/SwiftBenchmarks/SwiftBenchmarks.swift

@@ -3,7 +3,7 @@ import Benchmark
 import Reactivity
 
 struct BenchRow: Equatable {
-    let id: Int
+    let id: String
     var label: String
 }
 
@@ -44,7 +44,7 @@ struct BenchRowView {
 
     var body: some View {
         tr {
-            td(.class("id")) { "\(row.id)" }
+            td(.class("id")) { row.id }
             td(.class("label")) { row.label }
         }
     }
@@ -117,7 +117,7 @@ private func makeRows(startID: Int, count: Int, labelPrefix: String) -> [BenchRo
     var rows: [BenchRow] = []
     rows.reserveCapacity(count)
     for i in 0..<count {
-        rows.append(.init(id: startID + i, label: "\(labelPrefix)-\(i)"))
+        rows.append(.init(id: "\(startID + i)", label: "\(labelPrefix)-\(i)"))
     }
     return rows
 }

Sources/ElementaryUI/Animation/View+Animation.swift

@@ -14,9 +14,9 @@ struct _TransactionModifierView<Wrapped: View, Value: Equatable>: View {
     public static func _makeNode(
         _ view: consuming Self,
         context: borrowing _ViewContext,
-        tx: inout _TransactionContext
+        ctx: inout _MountContext
     ) -> _MountedNode {
-        let node = Wrapped._makeNode(view.view, context: context, tx: &tx)
+        let node = Wrapped._makeNode(view.view, context: context, ctx: &ctx)
         return .init(state: .init(value: view.value), child: node)
     }
 

Sources/ElementaryUI/Data/Environment/View+Envionment.swift

@@ -132,13 +132,13 @@ public struct _EnvironmentView<V, Wrapped: View>: View {
     public static func _makeNode(
         _ view: consuming Self,
         context: borrowing _ViewContext,
-        tx: inout _TransactionContext
+        ctx: inout _MountContext
     ) -> _MountedNode {
         var context = copy context
         let box = EnvironmentValues._Box<V>(view.value)
         context.environment.boxes[view.key.propertyID] = box
 
-        return .init(state: box, child: Wrapped._makeNode(view.wrapped, context: context, tx: &tx))
+        return .init(state: box, child: Wrapped._makeNode(view.wrapped, context: context, ctx: &ctx))
     }
 
     public static func _patchNode(

Sources/ElementaryUI/Data/Lifecycle/View+LifecycleEvents.swift

@@ -105,15 +105,15 @@ struct _LifecycleEventView<Wrapped: View>: View {
     final class LifecycleState: Unmountable {
         var onUnmount: (() -> Void)?
 
-        init(hook: LifecycleHook, tx: borrowing _TransactionContext) {
+        init(hook: LifecycleHook, scheduler: Scheduler) {
 
             switch hook {
             case .onAppear(let onAppear):
-                tx.scheduler.addEffect { onAppear() }
+                scheduler.addEffect { onAppear() }
             case .onDisappear(let callback):
                 self.onUnmount = callback
             case .onAppearReturningCancelFunction(let onAppearReturningCancelFunction):
-                tx.scheduler.addEffect {
+                scheduler.addEffect {
                     let cancelFunc = onAppearReturningCancelFunction()
                     self.onUnmount = cancelFunc
                 }
@@ -131,10 +131,10 @@ struct _LifecycleEventView<Wrapped: View>: View {
     static func _makeNode(
         _ view: consuming Self,
         context: borrowing _ViewContext,
-        tx: inout _TransactionContext
+        ctx: inout _MountContext
     ) -> _MountedNode {
-        let state = LifecycleState(hook: view.listener, tx: tx)
-        let child = Wrapped._makeNode(view.wrapped, context: context, tx: &tx)
+        let state = LifecycleState(hook: view.listener, scheduler: ctx.scheduler)
+        let child = Wrapped._makeNode(view.wrapped, context: context, ctx: &ctx)
 
         let node = _StatefulNode(state: state, child: child)
         return node

Sources/ElementaryUI/Data/Lifecycle/View+OnChange.swift

@@ -52,15 +52,15 @@ struct _OnChangeView<Wrapped: View, Value: Equatable>: View {
     static func _makeNode(
         _ view: consuming Self,
         context: borrowing _ViewContext,
-        tx: inout _TransactionContext
+        ctx: inout _MountContext
     ) -> _MountedNode {
         let state = State(value: view.value, action: view.action)
-        let child = Wrapped._makeNode(view.wrapped, context: context, tx: &tx)
+        let child = Wrapped._makeNode(view.wrapped, context: context, ctx: &ctx)
 
         if view.initial {
             let initialValue = view.value
             let action = view.action
-            tx.scheduler.addEffect {
+            ctx.scheduler.addEffect {
                 action(initialValue, initialValue)
             }
         }

Sources/ElementaryUI/Data/Lifecycle/_StatefulNode.swift

@@ -20,14 +20,6 @@ public struct _StatefulNode<State, Child: _Reconcilable> {
 }
 
 extension _StatefulNode: _Reconcilable {
-    public mutating func collectChildren(_ ops: inout _ContainerLayoutPass, _ context: inout _CommitContext) {
-        child.collectChildren(&ops, &context)
-    }
-
-    public mutating func apply(_ op: _ReconcileOp, _ tx: inout _TransactionContext) {
-        child.apply(op, &tx)
-    }
-
     public consuming func unmount(_ context: inout _CommitContext) {
         child.unmount(&context)
         onUnmount?(&context)

Sources/ElementaryUI/FLIP/FLIPLayoutObserver.swift

@@ -32,7 +32,7 @@ final class FLIPLayoutObserver: DOMLayoutObserver {
         }
     }
 
-    func didLayoutChildren(parent: DOM.Node, entries: [_ContainerLayoutPass.Entry], context: inout _CommitContext) {
+    func didLayoutChildren(parent: DOM.Node, entries: [LayoutPass.Entry], context: inout _CommitContext) {
         childNodes.removeAll(keepingCapacity: true)
         childNodes.reserveCapacity(entries.count)
 

Sources/ElementaryUI/HTMLViews/ElementModifiers/AnimateChildrenView.swift

@@ -8,7 +8,7 @@ struct AnimateContainerLayoutView<Wrapped: View>: View {
     static func _makeNode(
         _ view: consuming Self,
         context: borrowing _ViewContext,
-        tx: inout _TransactionContext
+        ctx: inout _MountContext
     ) -> _MountedNode {
 
         let observer = FLIPLayoutObserver(
@@ -20,7 +20,7 @@ struct AnimateContainerLayoutView<Wrapped: View>: View {
 
         return _MountedNode(
             state: observer,
-            child: Wrapped._makeNode(view.wrapped, context: context, tx: &tx)
+            child: Wrapped._makeNode(view.wrapped, context: context, ctx: &ctx)
         )
     }
 

Sources/ElementaryUI/HTMLViews/ElementModifiers/AttributeModifier.swift

@@ -14,7 +14,7 @@ public final class _AttributeModifier: DOMElementModifier, Invalidateable {
         return combined
     }
 
-    init(value: consuming Value, upstream: borrowing DOMElementModifiers, _ context: inout _TransactionContext) {
+    init(value: consuming Value, upstream: borrowing DOMElementModifiers) {
         self.lastValue = value
         self.upstream = upstream[_AttributeModifier.key]
         self.upstream?.tracker.addDependency(self)
@@ -38,7 +38,7 @@ public final class _AttributeModifier: DOMElementModifier, Invalidateable {
         }
     }
 
-    func mount(_ node: DOM.Node, _ context: inout _CommitContext) -> AnyUnmountable {
+    func mount(_ node: DOM.Node, _ context: inout _MountContext) -> AnyUnmountable {
         logTrace("mounting attribute modifier")
         return AnyUnmountable(MountedInstance(node, self, &context))
     }
@@ -58,11 +58,11 @@ extension _AttributeModifier {
         var isDirty: Bool = false
         var previousAttributes: _AttributeStorage = .none
 
-        init(_ node: DOM.Node, _ modifier: _AttributeModifier, _ context: inout _CommitContext) {
+        init(_ node: DOM.Node, _ modifier: _AttributeModifier, _ context: inout _MountContext) {
             self.node = node
             self.modifier = modifier
             self.modifier.tracker.addDependency(self)
-            updateDOMNode(&context)
+            patchAttributes(with: modifier.value, on: context.dom)
         }
 
         func invalidate(_ context: inout _TransactionContext) {

Sources/ElementaryUI/HTMLViews/ElementModifiers/BindingModifiers.swift

@@ -9,7 +9,7 @@ final class BindingModifier<Configuration>: DOMElementModifier, Unmountable wher
     var accessor: DOM.PropertyAccessor?
     var isDirty: Bool = false
 
-    init(value: consuming Value, upstream: borrowing DOMElementModifiers, _ context: inout _TransactionContext) {
+    init(value: consuming Value, upstream: borrowing DOMElementModifiers) {
         self.lastValue = value.wrappedValue
         self.binding = value
     }
@@ -43,10 +43,14 @@ final class BindingModifier<Configuration>: DOMElementModifier, Unmountable wher
         isDirty = false
     }
 
-    func mount(_ node: DOM.Node, _ context: inout _CommitContext) -> AnyUnmountable {
+    func mount(_ node: DOM.Node, _ context: inout _MountContext) -> AnyUnmountable {
         if mountedNode != nil {
             assertionFailure("Binding effect can only be mounted on a single element")
-            self.unmount(&context)
+            if let sink = self.sink, let node = self.mountedNode {
+                context.dom.removeEventListener(node, event: Configuration.eventName, sink: sink)
+                self.mountedNode = nil
+                self.sink = nil
+            }
         }
 
         self.mountedNode = node

Sources/ElementaryUI/HTMLViews/ElementModifiers/DOMElementModifier.swift

@@ -3,10 +3,10 @@ protocol DOMElementModifier: AnyObject {
 
     static var key: DOMElementModifiers.Key<Self> { get }
 
-    init(value: consuming Value, upstream: borrowing DOMElementModifiers, _ context: inout _TransactionContext)
+    init(value: consuming Value, upstream: borrowing DOMElementModifiers)
     func updateValue(_ value: consuming Value, _ context: inout _TransactionContext)
 
-    func mount(_ node: DOM.Node, _ context: inout _CommitContext) -> AnyUnmountable
+    func mount(_ node: DOM.Node, _ context: inout _MountContext) -> AnyUnmountable
 }
 
 protocol Unmountable: AnyObject {

Sources/ElementaryUI/HTMLViews/ElementModifiers/EventModifier.swift

@@ -11,7 +11,7 @@ final class EventModifier<Config: _DOMEventHandlerConfig>: DOMElementModifier {
 
     private var value: Value
 
-    init(value: consuming @escaping Value, upstream: borrowing DOMElementModifiers, _ context: inout _TransactionContext) {
+    init(value: consuming @escaping Value, upstream: borrowing DOMElementModifiers) {
         self.value = value
         self.upstream = upstream[EventModifier.key]
     }
@@ -20,7 +20,7 @@ final class EventModifier<Config: _DOMEventHandlerConfig>: DOMElementModifier {
         self.value = value
     }
 
-    func mount(_ node: DOM.Node, _ context: inout _CommitContext) -> AnyUnmountable {
+    func mount(_ node: DOM.Node, _ context: inout _MountContext) -> AnyUnmountable {
         logTrace("mounting event modifier")
         return AnyUnmountable(MountedInstance(node, self, &context))
     }
@@ -45,7 +45,7 @@ extension EventModifier {
 
         var isDirty: Bool = false
 
-        init(_ node: DOM.Node, _ modifier: EventModifier, _ context: inout _CommitContext) {
+        init(_ node: DOM.Node, _ modifier: EventModifier, _ context: inout _MountContext) {
             self.node = node
             self.modifier = modifier
 

Sources/ElementaryUI/HTMLViews/ElementModifiers/FocusModifier.swift

@@ -2,7 +2,7 @@ final class FocusModifier<FocusValue: Hashable>: DOMElementModifier, Unmountable
     private var binding: Binding
     private var focusAccessor: DOM.FocusAccessor?
 
-    init(value: consuming Binding, upstream: borrowing DOMElementModifiers, _ context: inout _TransactionContext) {
+    init(value: consuming Binding, upstream: borrowing DOMElementModifiers) {
         self.binding = value
     }
 
@@ -15,11 +15,12 @@ final class FocusModifier<FocusValue: Hashable>: DOMElementModifier, Unmountable
         self.binding = value
     }
 
-    func mount(_ node: DOM.Node, _ context: inout _CommitContext) -> AnyUnmountable {
+    func mount(_ node: DOM.Node, _ context: inout _MountContext) -> AnyUnmountable {
         if focusAccessor != nil {
             assertionFailure("FocusModifier can only be mounted on a single element")
             logWarning("FocusModifier can only be mounted on a single element")
-            self.unmount(&context)
+            binding.unregister(focusable: self)
+            self.focusAccessor.take()?.unmount()
         }
 
         binding.register(focusable: self)

Sources/ElementaryUI/HTMLViews/ElementModifiers/LayoutObserver.swift

@@ -1,7 +1,7 @@
 protocol DOMLayoutObserver: Unmountable {
     func willLayoutChildren(parent: DOM.Node, context: inout _TransactionContext)
     func setLeaveStatus(_ node: DOM.Node, isLeaving: Bool, context: inout _TransactionContext)
-    func didLayoutChildren(parent: DOM.Node, entries: [_ContainerLayoutPass.Entry], context: inout _CommitContext)
+    func didLayoutChildren(parent: DOM.Node, entries: [LayoutPass.Entry], context: inout _CommitContext)
 }
 
 struct DOMLayoutObservers {

Sources/ElementaryUI/HTMLViews/HTMLElement+Mountable.swift

@@ -1,12 +1,12 @@
 extension HTMLElement: _Mountable, View where Content: _Mountable {
-    public typealias _MountedNode = _StatefulNode<_AttributeModifier, _ElementNode>
+    public typealias _MountedNode = _StatefulNode<_AttributeModifier, _ElementNode<Content._MountedNode>>
 
     public static func _makeNode(
         _ view: consuming Self,
         context: borrowing _ViewContext,
-        tx: inout _TransactionContext
+        ctx: inout _MountContext
     ) -> _MountedNode {
-        let attributeModifier = _AttributeModifier(value: view._attributes, upstream: context.modifiers, &tx)
+        let attributeModifier = _AttributeModifier(value: view._attributes, upstream: context.modifiers)
 
         var context = copy context
         context.modifiers[_AttributeModifier.key] = attributeModifier
@@ -16,8 +16,8 @@ extension HTMLElement: _Mountable, View where Content: _Mountable {
             child: _ElementNode(
                 tag: self.Tag.name,
                 viewContext: context,
-                tx: &tx,
-                makeChild: { viewContext, r in AnyReconcilable(Content._makeNode(view.content, context: viewContext, tx: &r)) }
+                ctx: &ctx,
+                makeChild: { viewContext, c in Content._makeNode(view.content, context: viewContext, ctx: &c) }
             )
         )
     }
@@ -29,7 +29,7 @@ extension HTMLElement: _Mountable, View where Content: _Mountable {
     ) {
         node.state.updateValue(view._attributes, &tx)
 
-        node.child.updateChild(&tx, as: Content._MountedNode.self) { child, r in
+        node.child.updateChild(&tx) { child, r in
             Content._patchNode(
                 view.content,
                 node: &child,

Sources/ElementaryUI/HTMLViews/HTMLText+Mountable.swift

@@ -4,16 +4,16 @@ extension HTMLText: _Mountable, View {
     public static func _makeNode(
         _ view: consuming Self,
         context: borrowing _ViewContext,
-        tx: inout _TransactionContext
+        ctx: inout _MountContext
     ) -> _MountedNode {
-        _MountedNode(view.text, viewContext: context, context: &tx)
+        _MountedNode(view.text, ctx: &ctx)
     }
 
     public static func _patchNode(
         _ view: consuming Self,
         node: inout _MountedNode,
         tx: inout _TransactionContext
     ) {
-        node.patch(view.text, context: &tx)
+        node.patch(view.text, tx: &tx)
     }
 }

Sources/ElementaryUI/HTMLViews/HTMLVoidElement+Mountable.swift

@@ -1,12 +1,12 @@
 extension HTMLVoidElement: _Mountable, View {
-    public typealias _MountedNode = _StatefulNode<_AttributeModifier, _ElementNode>
+    public typealias _MountedNode = _StatefulNode<_AttributeModifier, _ElementNode<_EmptyNode>>
 
     public static func _makeNode(
         _ view: consuming Self,
         context: borrowing _ViewContext,
-        tx: inout _TransactionContext
+        ctx: inout _MountContext
     ) -> _MountedNode {
-        let attributeModifier = _AttributeModifier(value: view._attributes, upstream: context.modifiers, &tx)
+        let attributeModifier = _AttributeModifier(value: view._attributes, upstream: context.modifiers)
 
         var context = copy context
         context.modifiers[_AttributeModifier.key] = attributeModifier
@@ -16,8 +16,8 @@ extension HTMLVoidElement: _Mountable, View {
             child: _ElementNode(
                 tag: self.Tag.name,
                 viewContext: context,
-                tx: &tx,
-                makeChild: { _, _ in AnyReconcilable(_EmptyNode()) }
+                ctx: &ctx,
+                makeChild: { _, _ in _EmptyNode() }
             )
         )
     }

Sources/ElementaryUI/HTMLViews/StyleModifiers/FilterModifier.swift

@@ -6,7 +6,7 @@ final class FilterModifier: DOMElementModifier {
 
     var value: CSSFilter.AnyFunction.ValueSource
 
-    init(value: consuming Value, upstream: borrowing DOMElementModifiers, _ context: inout _TransactionContext) {
+    init(value: consuming Value, upstream: borrowing DOMElementModifiers) {
         self.value = value.makeSource()
         self.upstream = upstream[FilterModifier.key]
         self.layerNumber = (self.upstream?.layerNumber ?? 0) + 1
@@ -25,11 +25,11 @@ final class FilterModifier: DOMElementModifier {
         }
     }
 
-    func mount(_ node: DOM.Node, _ context: inout _CommitContext) -> AnyUnmountable {
+    func mount(_ node: DOM.Node, _ context: inout _MountContext) -> AnyUnmountable {
         AnyUnmountable(MountedStyleModifier(node, makeLayers(&context), &context))
     }
 
-    private func makeLayers(_ context: inout _CommitContext) -> [AnyCSSAnimatedValueInstance<CSSFilter>] {
+    private func makeLayers(_ context: inout _MountContext) -> [AnyCSSAnimatedValueInstance<CSSFilter>] {
         if var layers = upstream.map({ $0.makeLayers(&context) }) {
             layers.append(AnyCSSAnimatedValueInstance(value.makeInstance()))
             return layers