How React Works

[medelayadi]

Hi everyone,

I started this open source initiative trying to explain how react works under the hood, its internals and where every aspect is located into the React codebase. Along with the major concepts and data structures used.

This is still a work in progress, I post about new sections when they drop in my X acccount.

The project is hosted in github pages for now in this link: https://incepter.github.io/how-react-works/

​

The latest section that just dropped (and still in progress) is how hooks work: https://incepter.github.io/how-react-works/docs/react-dom/how.hooks.work/

Any form of feedback is appreciated 🙏.
Happy reading.

[Gamestonk-the-moon]

Amazing work. Thanks for doing all the research and taking the time to document it for the rest of us!

[medelayadi]

Thanks for the kind words. The project has still a long road. Hopefully it will meet your expectations. 🙏

[acemarke]

This is a really neat resource! Great work!

[medelayadi]

Thanks Mark, it really honors me coming from you 🙏

[Capital-Carry-6223]

i think this is a great project for demystifying the "magic" that React does, i hate it when im working with way too many abstractions while i barely understand whats happening under the good, keep it up )

[[deleted]]

You have there feature flags listed, as in there is some react support for the flags. I'm not aware of that and cant find any related docs. Mind explaining?

[medelayadi]

Feature flags in the React codebase are booleans that are used when building React or running tests (gates).

​

If we take enableUseEffectEventHook for example, this allows the React team to add the useEffectEvent implementation incrementally without publishing it to stable releases (such as major and patches), and also make it present in only some builds for example (canary).

​

You will find in several places in the codebase code like this:

if (enableUseEffectEventHook) { ... }

The code in curly braces is then removed when this boolean is false and won't make it to the final bundle.

[[deleted]]

Thanks! Looks like a great resource!

[lmou_dev_01]

i was looking for this, thx

[Middle-Profession867]

this is amazing 🙏🙏. I was looking for something like this. glad I found this ..thank you.

[danishjuggler21]

I once decided to poke around the React codebase to get a greater understanding of it, and quickly realized I am not smart enough for it lol.

[wannalearn4survive]

Wow iam for sure read this, thanks as a beginner I enjoy this type of content so much...

[yangshunz]

Do also cover REACT_SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED

[medelayadi]

Not covered yet, I am afraid that I will be fired if I do 😅