Recomposing your React application
summary
Claim: small reusable higher‑order components (HOCs) improve modularity and keep presentational components pure. Implementation: an open source library Recompose provides utilities like createEagerElement to inline stateless functions and an RX‑style mapPropStream to compose prop transforms, letting many HOCs squash into a single container. Evidence: library sees 55,000 downloads/month, is used in production, and a PR for broader class‑squashing optimization is pending, showing measurable reduction in extra React component instances.
AI-written summary · about
chapters (14)
- 0:00Intro
- 1:53What are higherorder components
- 3:55How do they work
- 7:37Higherorder components
- 13:49The core idea
- 16:25The name
- 16:47Concerns
- 21:41CreateEagerElement
- 22:21Technic Component Squash
- 22:37Flattened Component Squash
- 22:54Classbased Container Squash
- 23:55MattPropStream
- 27:45UpdateMiddleware
- 29:13Recap
related talks
42mUnderstanding Recompose through examples
50mWriting React Components: The Functional Way
20mManaging Reusable Logic in React
36mReusing Stateful Logic in React: HOC vs Render Props vs Hooks
25mSimply React
38mUnleash the power of the higher-order components
06mReconceptualize your entire app as a function
33mComposition