Anchor Docs

Appearance

Anchor Philosophy - The AX (All eXperience) Approach to State Management ​

Discover the foundational principles that guide Anchor's revolutionary approach to state management for modern web applications.

The AX Philosophy: All eXperience ​

At the heart of Anchor lies the AX (All eXperience) philosophy - a commitment to optimizing both Developer Experience (DX) and User Experience (UX) simultaneously. We believe that exceptional applications require exceptional tools that empower developers while delivering outstanding performance to users.

Developer Experience (DX) First ​

Traditional state management solutions often force developers to choose between ease of use and performance. Anchor eliminates this trade-off by providing:

  • Intuitive APIs: Write state.count++ instead of complex reducers or actions
  • Elimination of Boilerplate: No need for action creators, reducers, or complex context setups
  • Type Safety: Comprehensive TypeScript support with compile-time error checking
  • Framework Integration: Native support for React, Vue, Svelte, and vanilla JavaScript
  • Built-in Debugging: Visual tools and logging for easy state inspection

User Experience (UX) Optimization ​

While developer experience is crucial, it should never come at the expense of user experience. Anchor ensures optimal user experience through:

  • Blazing Performance: Fine-grained reactivity eliminates wasted renders
  • Instant Feedback: Optimistic UI updates provide immediate response to user actions
  • Memory Efficiency: Automatic cleanup prevents memory leaks and performance degradation
  • Consistent Behavior: Predictable state management reduces bugs and improves reliability

The DSV Model: Data-State-View ​

Anchor's revolutionary DSV (Data-State-View) model redefines how we think about application architecture:

Data Layer ​

The Data layer represents all external sources of information:

  • API responses
  • Database queries
  • User input
  • Third-party integrations

State Layer ​

The State layer is the single source of truth for your application:

  • Immutable by default
  • Reactive and observable
  • Validated through schemas
  • Centralized and predictable

View Layer ​

The View layer consists of components that:

  • Observe specific pieces of state
  • Automatically re-render when dependencies change
  • Remain decoupled from data fetching logic
  • Eliminate prop drilling and context hell

This separation of concerns creates clean, maintainable applications that scale gracefully.

Fine-Grained Reactivity Principles ​

Anchor's reactivity system is built on several core principles:

Precision Observation ​

Unlike traditional frameworks that re-render entire component trees, Anchor tracks dependencies at the property level. When state.user.name changes, only components that depend on that specific property re-render.

Lazy Initialization ​

Nested states are only made reactive when accessed, reducing initialization overhead and memory usage for unused parts of the state tree.

Automatic Cleanup ​

Observers are automatically cleaned up using weak references, preventing memory leaks while still allowing explicit cleanup for immediate resource release.

True Immutability Approach ​

Anchor's approach to immutability challenges conventional wisdom:

Direct Mutation Syntax ​

Write intuitive code like state.user.name = 'John' while maintaining immutability through proxy-based write contracts.

Controlled Mutations ​

Mutations are only allowed through explicitly created write contracts, providing compile-time and runtime safety without sacrificing developer ergonomics.

Performance Without Compromise ​

Eliminate the deep cloning overhead of traditional immutable patterns while maintaining all the benefits of immutable state.

Integrated Toolkit Philosophy ​

Rather than requiring multiple libraries for different concerns, Anchor provides an integrated toolkit:

Unified Solution ​

Handle state management, data fetching, storage, and history tracking with a consistent API.

Zero External Dependencies ​

Anchor's core functionality requires no external dependencies, reducing bundle size and potential compatibility issues.

Optional Extensions ​

Add functionality like devtools, advanced storage, or request handling as needed.

Performance Without Sacrifice ​

Anchor's performance philosophy centers on doing the minimum necessary work:

Efficient Change Detection ​

Only notify observers when their dependencies actually change.

Optimized Updates ​

Use proxy-based mutations to avoid expensive deep cloning operations.

Memory Conscious ​

Automatic cleanup and lazy initialization keep memory usage to a minimum.

Scalability Principles ​

Anchor is designed to scale from simple components to enterprise applications:

Modular Design ​

Components observe only the state they need, preventing coupling and improving maintainability.

Predictable Growth ​

Performance remains consistent as applications grow in complexity.

Team Collaboration ​

Clear separation of concerns and explicit contracts facilitate team development.

Next Steps ​

To dive deeper into Anchor's philosophy and approach: