React 16 is shipping with Fiber, the complete rewrite of React's core algorithm. After 18 months of development, the new reconciliation engine is production-ready. For most developers, upgrading means changing one line in package.json. That's the real achievement—rewriting the core without breaking the world.
React 16 brings several major features:
Fiber – The new reconciliation algorithm that enables:
React is undergoing a complete core rewrite called Fiber, and most developers won't notice. That's the point. Facebook is replacing React's reconciliation algorithm—the diff engine that makes React fast—without changing the public API. This is a remarkable engineering feat and a lesson in managing large-scale architectural changes.
Fiber is a complete rewrite of React's core algorithm. The current version (React 15) does reconciliation synchronously—when state changes, React computes the entire component tree diff in one uninterruptible block. If that takes 100ms, the main thread is blocked for 100ms. No user input, no animations, nothing.
Fiber breaks reconciliation into chunks. React can pause diff work, check if there's higher priority work (like user input), handle that, then resume diffing. The result: smoother user experiences, especially on slower devices.
CSS Grid just shipped in Chrome, Firefox, and Safari within weeks of each other. After years of spec work and browser implementation, we finally have a proper layout system for the web. No more floats-as-layout. No more clearfix hacks. No more flexbox contortions.
This should be a huge moment. But here's the uncomfortable truth: most developers won't use Grid for months or years, because unlearning decades of CSS hacks is harder than learning Grid itself.
CSS Grid lets you define two-dimensional layouts—rows and columns—explicitly. Place items in specific grid cells, span multiple cells, create gaps, and it just works.
.container {
display: grid;
grid-template-columns: 200px 1fr 200px;
grid-template-rows: auto 1fr auto;
gap: 20px;
height: 100vh;
}
.header {
grid-column: 1 / -1; /* span all columns */
}
.sidebar {
grid-column: 1;
grid-row: 2;
}
.main {
grid-column: 2;
grid-row: 2;
}This is what we should have had in 1998. Instead, we've spent 20 years stacking hacks on hacks because CSS wasn't designed for application layouts.
Bootstrap 3 shipped in August with a complete rewrite, and the most significant change wasn't technical—it was philosophical. Bootstrap finally embraced mobile-first design, which Foundation has championed from the start. Now that both frameworks share this foundation (pun intended), the differences are more interesting.