Fish Redux vs Redux: What are the differences?

Introduction

Fish Redux and Redux are both popular state management libraries used in web development. While they share similarities in their core concepts and architecture, there are several key differences between the two.

1. Data Structure: In Redux, the state is stored in a single JavaScript object, often referred to as a "store." On the other hand, Fish Redux divides the state into multiple modules, allowing for a more modular and scalable approach to state management.

2. Component Hierarchy: Redux follows a hierarchical component structure, where components are divided into containers and presentational components. In Fish Redux, the component hierarchy is represented using a nested structure called a "page," with the top-level page acting as the container and nested pages acting as sub-containers.

3. Action Dispatch: In Redux, actions are dispatched using action creators, which are plain JavaScript functions. Fish Redux introduces the concept of "intents," which are typically defined as classes that wrap the actions and provide additional functionalities like action filtering and event-driven interactions.

4. Model-View-Binder: Redux doesn't provide a built-in structure for data binding and view updating. In contrast, Fish Redux includes a "model-view-binder" architecture, where the model represents the state, the view represents the UI components, and the binder acts as the bridge between the two, ensuring data synchronization and updating the UI.

5. Dependency Injection: While Redux does not have native support for dependency injection, Fish Redux integrates the concept of dependency injection through the use of "connector" components. These connectors allow for the injection of dependencies into a component, providing more flexibility and modularity in the code structure.

6. Middleware Support: One notable difference between Fish Redux and Redux is their approach to middleware. While Redux has a rich ecosystem of middleware libraries, Fish Redux has a built-in middleware system called "effect middleware." This middleware system simplifies the handling of side effects and asynchronous operations in the state management flow.

In summary, Fish Redux and Redux differ in their data structure, component hierarchy, action dispatch, model-view-binder architecture, dependency injection support, and middleware system.