butterfly
hook-flow
Our great sponsors
| butterfly | hook-flow | |
|---|---|---|
| 2 | 7 | |
| 4,158 | 2,102 | |
| 1.9% | - | |
| 4.1 | 0.0 | |
| 7 days ago | over 1 year ago | |
| JavaScript | Shell | |
| MIT License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
butterfly
- FLaNK AI Weekly 25 March 2025
-
Show HN: React Flow – library for creating node based editors and apps
Butterfly [1] by alibaba has a vue wrapper (along with a React one) over a framework independent core.
It is not as well documented though.
[1] https://github.com/alibaba/butterfly
hook-flow
- Experienced Devs, what's something that frustrates you about working with React that's not a simple "you'll know how to do it better once you've enough experience"?
-
Potential bug in "official" useInterval example
To further illustrate this, here's a diagram showing React's Life Cycle with hooks:
-
Does setState schedule the state update until right before the component rerenders?
Here's a cheatsheet: https://github.com/donavon/hook-flow If you want a complete explanation, watch this video by Kent Dodds: https://egghead.io/lessons/react-understand-the-react-hook-flow
-
I made an app to visualize React Hooks flow
The app is based on Donavon West's React hooks flow diagram.
-
React useEffect Hook Flow
The full picture of the flow of hooks can be understood from this flow-chart by donavon
- Understanding React Hooks Flow
-
Understanding Rendering in React ♻ ⚛️
To explain the lifecycles method part a little bit more, I bring to you this wonderful graph that Donavon West and his contributors created. This is the project repo, check it out!
What are some alternatives?
react-flow - React Flow | Svelte Flow - Powerful open source libraries for building node-based UIs with React (https://reactflow.dev) or Svelte (https://svelteflow.dev). Ready out-of-the-box and infinitely customizable. [Moved to: https://github.com/xyflow/xyflow]
Flowgorithm-macOS - Flowgorithm for Mac OS
Drawflow - Simple flow library 🖥️🖱️
beautiful-react-diagrams - 💎 A collection of lightweight React components and hooks to build diagrams with ease 💎
jsplumb - Visual connectivity for webapps
react-diagrams - a super simple, no-nonsense diagramming library written in react that just works
vite-svg-loader - Vite plugin to load SVG files as Vue components
react-hooks-flow
X6 - 🚀 JavaScript diagramming library that uses SVG and HTML for rendering.
Yup - Dead simple Object schema validation
wavedrom - :ocean: Digital timing diagram rendering engine
react-merge-refs - React utility to merge refs 🖇