Class Config Atoms

Neo.mjs v10.0.0-beta.4 Release Notes

This beta release introduces a powerful, opt-in Reactive Config System, a foundational architectural enhancement that enables fine-grained, cross-instance state management and significantly improves the developer experience for building complex, interactive applications.

Core Framework & Features

The centerpiece of this release is the new reactive config system, internally named "Config Atoms". This system is fully opt-in and backward compatible, ensuring that existing applications continue to work without any changes.

• New Reactive Config System ("Config Atoms"):
  • Opt-in Reactivity: By adding a trailing underscore (_) to a config property in its static config block (e.g., myValue_), the property becomes "reactive." It is automatically wrapped in a Neo.core.Config instance, which acts as an observable container for its value.
  • Cross-Instance State Sharing: The new system exposes a subscribe() method on each reactive config, allowing components to listen for changes to a config on any other component instance. This enables a clean, decoupled, and highly efficient way to implement cross-component state synchronization.

            // In ComponentA
    const componentB = Neo.get('b');
    
    // Subscribe to changes in componentB's 'text' config
    this.cleanup = componentB.getConfig('text').subscribe((newValue, oldValue) => {
        this.someOtherProperty = newValue; // Reactively update
    });
    
    // In ComponentA's destroy() method:
    this.cleanup?.(); // Simple, clean, and prevents memory leaks.

  • Fine-Grained Control (Future Foundation): While not fully implemented in this beta, the groundwork is laid for using config descriptors to define custom mergeStrategy and isEqual functions, which will provide even more control over config behavior in a future release.
  • Transactional Consistency: The new system fully integrates with Neo.mjs's existing transactional update mechanism (set()), ensuring that afterSet hooks always have a consistent view of all pending config changes within a single operation.

Developer Experience

• Simplified State Management: The subscribe() API drastically simplifies the logic required for components to react to state changes in other parts of the application, reducing boilerplate and the need for complex event chains.
• Improved Debugging: The observable nature of reactive configs makes it easier to trace how and when state changes occur throughout your application.

This release marks a significant step forward in the evolution of the Neo.mjs architecture. The new reactive config system provides a robust foundation for building the next generation of highly interactive and state-driven web applications.

Call To Action

We are incredibly excited for you to start experimenting with this powerful new feature!

• Try Reactive Configs: Start by making a config reactive by adding a _ to its name in the static config block and explore the new possibilities with getConfig().subscribe().
• Share Your Feedback: This is a foundational change, and your feedback is more critical than ever. Please share your experiences, report any issues, or suggest improvements via GitHub Issues or our Slack Channel.