https://github.com/iggredible/virtual-dom-demo
Super basic virtualDom demo to show vdom and diffing in action
https://github.com/iggredible/virtual-dom-demo
demo example javascript vdom virtual-dom
Last synced: 4 months ago
JSON representation
Super basic virtualDom demo to show vdom and diffing in action
- Host: GitHub
- URL: https://github.com/iggredible/virtual-dom-demo
- Owner: iggredible
- Created: 2019-05-15T23:03:58.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2019-05-17T23:31:33.000Z (about 6 years ago)
- Last Synced: 2025-01-07T06:42:26.539Z (5 months ago)
- Topics: demo, example, javascript, vdom, virtual-dom
- Language: JavaScript
- Size: 66.4 KB
- Stars: 1
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# Virtual DOM Demo
Simple demo of virtual dom. By using virtual dom, we can target a specific component in DOM tree to update it without having to update the entire tree using diffing. I think good grasp of virtual dom is essential in modern frontend development (ie [React](https://reactjs.org/)).
# Starting Application
`npm run start`
# Resources
For more reading on virtual dom, check out these resources:
- [DOM Basics](https://www.youtube.com/watch?v=H63dVFDuJDM) (video)
- [How React.js works](https://www.youtube.com/watch?v=mLMfx8BEt8g) (video)
- [Building a Simple Virtual DOM from Scratch](https://www.youtube.com/watch?v=85gJMUEcnkc) (video)
- [How Virtual-DOM and diffing works in React](https://medium.com/@gethylgeorge/how-virtual-dom-and-diffing-works-in-react-6fc805f9f84e) (article)
- [Reconciliation in React](https://reactjs.org/docs/reconciliation.html) (React docs)
- [React: The Virtual DOM](https://www.codecademy.com/articles/react-virtual-dom) (article)
_This repo was inspired by Jason Yu's talk on [Building Simple Virtual Dom](https://www.youtube.com/watch?v=85gJMUEcnkc)_.