4 ms·
React's technique is to break your view down into smaller, composable components. These components provide a render() method which specifies how the component w
by KaoruAoiShiho 13y ago
React's technique is to break your view down into smaller, composable components. These components provide a render() method which specifies how the component will generate its markup. render() can either return normal DOM elements (like <div>s) or can return other components.
When your data changes, the render() method is called again. We compare the old render()'d version with the new one and the framework determines the most efficient way to update the DOM. Often this will be faster than hand-coding it, as React knows about the entire state of the page and can do cool tricks like batching reads and writes.
The way we're able to pull this off is by constructing a very fast, lightweight representation of the DOM which knows which parts are dirtied and which parts are clean.
This describes angular, that's what angular does. Edit: Well it's similar to what angular does, the intent is the same, but it doesn't know the state of the DOM among other things.
Because this rerender is so fast (on the order of 1ms for TodoMVC), we don't need the end user to explicitly specify data bindings. We've found that this is an easy way to build apps.
Is this faster than angular? Benchmarks please!
- peterhunt 13y agoAngular's got a lot of great ideas, but the key difference is how you build with React. Angular's directives are pretty similar conceptually to React components, yes. But Angular requires you to imperatively manipulate the DOM in its linking functions, whereas with React you declaratively specify how you want your component to look and when it changes state the framework computes the fastest DOM manipulations for you, which we think saves you some work and is often more performant. If I had thorough benchmarks available I'd provide them, but sadly benchmarking things correctly is a lot of work and I just don't have time :/ You could try to play around with both frameworks' TodoMVC examples with Chrome's devtools to compare them, though.
- gregwebs 13y agoAngular douesn't require you to use linking functions. They aren't necessary for 90% of the time when you can just use a template and a controller. It would be interesting if you provided an example in React of something that did require a linking function in Angular.