Differences to React

Preact itself is not intended to be a reimplementation of React. There are differences. Many of these differences are trivial, or can be completely removed by using preact-compat, which is a thin layer over Preact that attempts to achieve 100% compatibility with React.

The reason Preact does not attempt to include every single feature of React is in order to remain small and focused - otherwise it would make more sense to simply submit optimizations to the React project, which is already a very complex and well-architected codebase.

What's Included?

• ES6 Class Components
  • classes provide an expressive way to define stateful components
• High-Order Components
  • components that return other components from render(), effectively wrappers
• Stateless Pure Functional Components
  • functions that receive props as arguments and return JSX/VDOM
• Contexts: Support for context was added in Preact 3.0.
  • Context is an experimental React feature, but has been adopted by some libraries.
• Refs: Support for function refs was added in Preact in 4.0. String refs are supported in preact-compat.
  • Refs provide a way to refer to rendered elements and child components.
• Virtual DOM Diffing
  • This is a given - Preact's diff is simple but effective, and extremely fast.
• h(), a more generalized version of React.createElement (read: why h()?)

What's Added?

Preact actually adds a few convenient features inspired by work in the React community:

• this.props and this.state are passed to render() for you
  • You can still reference them manually. This is just cleaner, particularly when destructuring
• Linked State updates state when inputs change automatically
• Batching of DOM updates, debounced/collated using setTimeout(1) (can also use requestAnimationFrame)
• You can just use class for CSS classes. className is still supported, but class is preferred.
• Component and element recycling/pooling.

What's Missing?

• PropType Validation: Not everyone uses PropTypes, so they aren't part of Preact's core.
  • PropTypes are fully supported in preact-compat, or you can use them manually.
• Children: Not necessary in Preact.
  • React.Children is fully supported in preact-compat.
• Synthetic Events: Preact's browser support target does not require this extra overhead.
  • A full events implementation would mean more maintenance and performance concerns, and a larger API.

What's Different?

There are currently a couple differences between Preact and React that are more subtle:

• render() accepts a third argument, which is the root node to replace, otherwise it appends. This may change slightly in a future version, perhaps auto-detecting that a replacement render is appropriate by inspecting the root node.
• setState() is asynchronous because of batching. This is intentional and does not affect the outward-facing API.