Book Image

React.js Essentials

By : Artemij Fedosejev
Book Image

React.js Essentials

By: Artemij Fedosejev

Overview of this book

Table of Contents (18 chapters)
React.js Essentials
Credits
Foreword
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Rendering React Elements


The ReactDOM.render() method takes three parameters: ReactElement, a regular DOMElement, and a callback function:

ReactDOM.render(ReactElement, DOMElement, callback);

ReactElement is a root element in the tree of ReactNodes that you've created. A regular DOMElement is a container DOM node for that tree. The callback is a function executed after the tree is rendered or updated. It's important to note that if this ReactElement was previously rendered to a parent DOM Element, then ReactDOM.render() will perform an update on the already rendered DOM tree and only mutate the DOM as it is necessary to reflect the latest version of the ReactElement. This is why a virtual DOM requires fewer DOM mutations.

So far, we've assumed that we're always creating our virtual DOM in a web browser. This is understandable because, after all, React is a user interface library, and all the user interfaces are rendered in a web browser. Can you think of a case when rendering a user interface...