FLUX

Make Client-Side Development Fun Again!

Brent Hosie

courtesy @jingc

courtesy @jingc

courtesy @jingc

courtesy @jingc

+

  • The "V" in MVC
  • A library for rendering user interfaces
  • Doesn't care where the data came from

What is React?

Re-Rendering Caveats

  • Lose Scroll Position
  • Screen Flickers
  • Slow

Virtual DOM

  • React builds a new virtual DOM subtree whenever data changes
  • diff it with the old one
  • computes the minimal set of DOM mutations and puts them in a queue
  • batch executes all changes to the actual DOM

Pros

  • Code is deterministic
  • Easy to trace bugs
  • Easy to test UI
  • Fast
  • Add features without worry

Cons

  • Doesn't solve every problem you'll encounter
  • None of this is a framework