/flʌks/
noun … “flow that carries change.”
Flux is a concept used in multiple scientific and technical contexts to describe the rate of flow or transfer of a quantity through a surface or system. In physics and engineering, flux often refers to the amount of a field (such as electromagnetic, heat, or fluid flow) passing through a given area per unit time. In computer science, particularly in the context of frontend development, Flux is a pattern for managing application state, emphasizing unidirectional data flow to maintain predictable and testable state changes.
In physics and engineering, flux is typically represented mathematically as:
Φ = ∫∫_S F · dAwhere Φ is the flux, F is a vector field (e.g., electric or fluid velocity field), and dA is a differential element of the surface S. This formulation measures how much of the vector field passes through the surface. For example, in electromagnetism, the magnetic flux through a loop is proportional to the number of magnetic field lines passing through it.
In computer science, the Flux pattern, introduced by Facebook, structures applications around a unidirectional data flow:
- Actions: Describe events triggered by user interactions or system events.
- Dispatcher: Central hub that dispatches actions to registered stores.
- Stores: Hold application state and business logic, updating state based on actions.
- Views: React components or UI elements that render data from stores.
The unidirectional flow ensures consistency, prevents circular dependencies, and makes debugging and testing more straightforward. It is often used with React.js to manage complex state in web applications.
Flux is linked to several key concepts depending on context. In physics, it relates to Electromagnetic Fields, Vector Fields, and Surface Integrals. In software, it interacts with React.js, State Management, and unidirectional data flow principles. Its versatility allows it to model movement, change, and information flow across disciplines.
Example conceptual workflow for using Flux in software:
user triggers an action (e.g., clicks a button)
action is dispatched through the central dispatcher
stores receive the action and update their state accordingly
views listen to store changes and re-render the UI
repeat as users interact with the applicationIntuitively, Flux is like a river: whether carrying water, energy, or information, it moves in a defined direction, shaping the environment it passes through while maintaining a coherent, predictable flow. It transforms dynamic systems into analyzable, controlled processes.