Differences
This shows you the differences between two versions of the page.
Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
courses:cs397:winter2017:react [2017/04/06 14:54] – [Virtual DOM] jonesr | courses:cs397:winter2017:react [2017/05/05 16:10] (current) – [Presentation Slides] admin | ||
---|---|---|---|
Line 7: | Line 7: | ||
React is a Javascript library for frontend development that allows for greater flexibility and fluidity when developing widgets and web apps. React uses a virtual DOM (document object model) to update its UI elements, then compares the virtual DOM with its current DOM, then renders the changes. Furthermore, | React is a Javascript library for frontend development that allows for greater flexibility and fluidity when developing widgets and web apps. React uses a virtual DOM (document object model) to update its UI elements, then compares the virtual DOM with its current DOM, then renders the changes. Furthermore, | ||
- | ===== Virtual DOM ===== | + | ====== Virtual DOM ====== |
The use of the virtual DOM is one of the most important features of React. For large websites whenever a change is made, the DOM has to be manipulated. Most javascript frameworks update the entire DOM with every change, regardless of how small. This is a very slow process. React makes a copy of the DOM, the virtual DOM, which updates much faster. When a change is made to the website the entire virtual DOM updates, the changes are compared to the real DOM, then only the changed aspects of the real DOM are updated. | The use of the virtual DOM is one of the most important features of React. For large websites whenever a change is made, the DOM has to be manipulated. Most javascript frameworks update the entire DOM with every change, regardless of how small. This is a very slow process. React makes a copy of the DOM, the virtual DOM, which updates much faster. When a change is made to the website the entire virtual DOM updates, the changes are compared to the real DOM, then only the changed aspects of the real DOM are updated. | ||
====== Helpful Links ====== | ====== Helpful Links ====== | ||
- | * Official React page: https:// | + | * [[https:// |
- | * Official React tutorial: | + | * [[https:// |
- | * LearnCode.academy video series: | + | * [[https:// |
- | * Wes Bos Reduxstagram tutorial: | + | * [[https:// |
- | * Codecademy React tutorials: | + | * [[https:// |
+ | * [[https:// | ||
====== Presentation Slides ====== | ====== Presentation Slides ====== | ||
- | https:// | + | [[https:// |