React 2018 in review

React Downloads

React Native goes MIT

React v16.3.0: New lifecycles and context API

1. React.createContext()
2. React.createRef()
3. React.forwardRef()
4. getDerivedStateFromProps()
5. getSnapshotBeforeUpdate()
6. StrictMode

React's Lifecycle methods

Gatsby forms Gatsby Inc, raises 3.8M seed round

Material-UI v1 is out 🎉

You Probably Don't Need Derived State

React 16.4 included a bugfix for getDerivedStateFromProps which caused some existing bugs in React components to reproduce more consistently.

• Fully Controlled or Uncontrolled
• Memoization

🔥 React Fire

Announcing styled-components v4: Better, Faster, Stronger 💅

1. Smaller (from 16.1kB to <15kB)
2. Faster (mounting: +25%, re-rendering: +7.5%)
3. createGlobalStyle API (hot-reloadable and themable)
4. "as" prop (replaces .withComponent()
5. StrictMode compliance for React v16
6. Native ref on any styled component (no more innerRef)

React Profiler

Gatsby v2

1. Reduced build times by up to 75%
2. Shrunk JavaScript client runtime by 31%
3. Webpack 4, Babel 7, React 16.5

Framer X released

Next.js v7

1. 57% faster bootup, 42% faster re-compilation
2. react-error-overlay
3. Webpack 4 and Babel 7
4. Standardized Dynamic Imports
5. Static CDN support
6. Smaller initial HTML payload
7. React Context with SSR between App and Pages

Create React App v2

1. 🎉 Use Sass and CSS Modules out of the box.
2. 🐠 Babel 7
3. 📦 Webpack 4
4. 🃏 Jest 23
5. 💄 Added PostCSS
6. 💎 Babel Macros support (Apollo, Relay Modern, MDX)
7. 🌠 Import an SVG as a React component
8. 🐈 Yarn Plug’n’Play mode that removes node_modules.
9. 👷‍♀️ Opt-in service workers with Google’s Workbox.

React v16.6.0

1. React.memo
2. React.lazy: Code-Splitting with Suspense
3. Code-Splitting with Suspense
4. static getDerivedStateFromError()

RFC: React Hooks

react-beautiful-dnd 10.0: faster, more powerful

1. 🚀 30% faster
2. 💥 Smarter collision engine
3. 🎹 More robust keyboard movement system
4. 🌲 New: tree library @atlaskit/tree by @Confluence
5. 🎳 New: combine items
6. 🐣 New: add and remove items during a drag

React 16.x Roadmap

• React 16.6 with Suspense for Code Splitting (already shipped)
• A minor 16.x release with React Hooks (~Q1 2019)
• A minor 16.x release with Concurrent Mode (~Q2 2019)
• A minor 16.x release with Suspense for Data Fetching (~mid 2019)