v0.4.0

MeoNode UI v0.4.0 – Advanced Memoization & Caching System

Release Date: 2025-11-13

Features

• core: Implemented an advanced memoization and caching system to optimize rendering performance (3b0a110):
  • Dependency-Based Memoization: Nodes can now be created with a dependency array, similar to React's useMemo, to prevent unnecessary re-renders of the node and its entire subtree if dependencies have not changed.
  • Enhanced Prop Caching: The prop signature generation is now more robust, and the cache uses an advanced LRU eviction strategy to remain efficient.
  • API Updates: The Node, createNode, createChildrenFirstNode, and Component HOCs have been updated to accept an optional deps array to enable memoization.

Example Usage

const App = () => {
  const [state, setState] = useState({ user: 'John', role: 'Admin' })

  const updateUser = () => setState(s => ({ ...s, user: 'Jane' }))
  const updateRole = () => setState(s => ({ ...s, role: 'Editor' }))

  return Div({
    children: [
      Div({ onClick: updateUser, children: 'Update User' }),
      Div({ onClick: updateRole, children: 'Update Role' }),
      // Static: never re-renders, regardless of state changes
      Div({ children: `Initial User: ${state.user}` }, []),
      // Dependent: re-renders only when `state.user` changes
      Div({ children: `User: ${state.user}; Role: ${state.role}` }, [state.user]),
    ],
  }).render()
}

With dependency-based memoization, only nodes whose dependencies change are re-rendered — enabling fine-grained reactivity and significant performance improvements in large trees.

Tests

• core: Added a comprehensive suite of tests for the new memoization and caching system, covering dependency-based memoization, reactive and non-reactive children, complex state updates, and memoization of Higher-Order Components (HOCs) (6bcd1b1).

Version Update

• Current version: 0.4.0

Changelog & Commits

• View Full Changelog
• Browse All Commits