Making sub-headings into chapters.

This commit is contained in:
2020-08-02 13:49:40 -07:00
parent 3b4a988ae3
commit 5e4c6557ec
11 changed files with 457 additions and 13 deletions
+32 -12
View File
@@ -33,10 +33,6 @@ applications with it.
:EXPORT_FILE_NAME: manuscript/introduction.markua
:END:
* Foundations: Building our own React
:PROPERTIES:
:EXPORT_FILE_NAME: manuscript/fundamentals--building-our-own-react.markua
:END:
Baking bread. When I first began to learn how to bake bread the recipe
told me what to do. It listed some ingredients and told me how to
combine them and prescribed times of rest. It gave me an oven
@@ -74,7 +70,10 @@ our recipes would fall out-of-date. So like the bread, to produce
consistently good results we need to understand how React does what it
does.
** Components of React
* Components of React
:PROPERTIES:
:EXPORT_FILE_NAME: manuscript/components-of-react.markua
:END:
Conceptually React is very simple. It starts by walking a tree of
components and building up a tree of their output. Then it compares
@@ -102,7 +101,10 @@ complete picture of the entire process. The more black-boxes we have
in our mental model the harder it will be for us to diagnose
performance problems.
** Markup in JavaScript: ~JSX~
* Markup in JavaScript: ~JSX~
:PROPERTIES:
:EXPORT_FILE_NAME: manuscript/markup-in-javascript---jsx-.markua
:END:
~createElement~, however, takes as input something that is probably
not familiar to us since we usually work in JSX, which is the last
@@ -222,7 +224,10 @@ by leaving those aspects of the JSX compiler out.
So now that we've worked through JSX we're ready to tackle
~createElement~, the next item on our way to building our own React.
** Getting Ready to Render with ~createElement~
* Getting Ready to Render with ~createElement~
:PROPERTIES:
:EXPORT_FILE_NAME: manuscript/getting-ready-to-render-with--createelement-.markua
:END:
React's ~render~ expects to consume a tree of element objects in a
specific, uniform format. ~createElement~ is the method by which we
@@ -286,7 +291,10 @@ of ~elements~ (surprise).
That's it. Now we have everything we need to actually begin the
process of rendering our tree to the DOM!
** Render
* Render
:PROPERTIES:
:EXPORT_FILE_NAME: manuscript/render.markua
:END:
There are now only two major puzzles remaining in our quest for our
own React. The next piece is: ~render~. How do we go from our JSM tree
@@ -359,7 +367,10 @@ tree in the browser's DOM! But so far we can only add things to our
tree. To be able to remove and modify the tree we need one more part:
reconciliation.
** Reconciliation
* Reconciliation
:PROPERTIES:
:EXPORT_FILE_NAME: manuscript/reconciliation.markua
:END:
A tale of two trees. These are the two trees that people most often
talk about when talking about React's "secret sauce": the virtual DOM
and the browser's DOM tree. This idea is what originally set React
@@ -634,7 +645,10 @@ simulates, you'll be hitting a major performance bottleneck since
React will not only be replacing DOM elements in the browser but also
tearing down and rebuilding the trees of child components.
** Fibers
* Fibers
:PROPERTIES:
:EXPORT_FILE_NAME: manuscript/fibers.markua
:END:
The actual React implementation used to look very similar to what
we've built so far, but with React 16 this has changed dramatically
@@ -659,7 +673,10 @@ likely to occur from the underlying algorithms and not from the Fiber
specific details. In the chapter on Concurrent Mode we will learn more
about Fibers.
** Putting it all together
* Putting it all together
:PROPERTIES:
:EXPORT_FILE_NAME: manuscript/putting-it-all-together.markua
:END:
Throughout the rest of the book we will be building on and using our
React implementation so it would be helpful to see it all put together
@@ -711,7 +728,10 @@ wanted to use it in a more production setting it would take a lot more
development.
#+end_note
** Conclusion
* Conclusion
:PROPERTIES:
:EXPORT_FILE_NAME: manuscript/conclusion.markua
:END:
Of course our version of React elides over many details that React
must contend with, like starting a re-render from where state changes