asyncredux-connector-pattern

Decouple Flutter UI from AsyncRedux state management with StoreConnector and VmFactory.

238|39|Updated Aug 4, 2019
One-click install
npx skills add https://github.com/marcglasberg/async_redux --skill asyncredux-connector-pattern
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: asyncredux-connector-pattern
Source: https://github.com/marcglasberg/async_redux/tree/main/.claude/skills/asyncredux-connector-pattern
Command: npx skills add https://github.com/marcglasberg/async_redux --skill asyncredux-connector-pattern

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The Connector pattern helps separate business logic from UI, enabling clean, testable Flutter widgets by moving data access and dispatch logic into "smart" connectors and keeping presentational widgets lightweight.

Core Features & Use Cases

  • Split UI and state management with StoreConnector and VmFactory to produce minimal view models.
  • Improve testability by swapping real store with mock data in connector widgets.
  • Reuse presentational widgets across screens by decoupling them from store access.
  • Use advanced patterns to optimize rebuilds and share code using connector properties.

Quick Start

Use the asyncredux-connector-pattern skill to implement a CounterConnector that maps AppState to CounterViewModel and connects to a CounterWidget.

Frequently Asked Questions about asyncredux-connector-pattern

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I decouple Flutter UI from AsyncRedux state management?

Decouple Flutter UI from AsyncRedux by introducing a StoreConnector and VmFactory to create smart connector widgets that map AppState into minimal view-models, keeping presentational widgets lightweight and separate from dispatch logic.

What is the StoreConnector pattern in Flutter for separating business logic?

The StoreConnector pattern in Flutter separates business logic by moving data access and dispatching into smart connector widgets, while dumb widgets only render the view-model, improving testability and allowing widget reuse across screens.

How do I optimize Flutter widget rebuilds when using AsyncRedux connectors?

Optimize Flutter widget rebuilds with AsyncRedux connectors by implementing view-model equality checks within your VmFactory, ensuring the StoreConnector only triggers rebuilds when the mapped view-model data actually changes.

Can I mock the Redux store to test Flutter connector widgets?

Yes, you can test Flutter connector widgets by swapping the real AsyncRedux store with mock data. Because the connector pattern isolates state access, presentational widgets remain clean and easily testable with injected view-models.

Do I need to use VmFactory to wire actions through view-models in Flutter?

Yes, using VmFactory is required to wire actions through view-models in Flutter. It creates the view-model that maps the AppState and contains the dispatch functions, keeping action triggering out of the UI layer.

When should I not use the connector pattern for Flutter state management?

You should avoid the connector pattern for Flutter state management when your app has very simple state requirements that do not justify the overhead of creating smart/dumb widget pairs and VmFactory view-models for basic data passing.