Meta Refresh 2015

The web in your pocket

Using ReactJS (with Flux) to boost performance for mobile webapps

Submitted by Rakesh Menon (@rakeshmenon13) on Monday, 12 January 2015

videocam_off

Technical level

Intermediate

Section

Application Design – full talk

Status

Submitted

Vote on this proposal

Login to vote

Total votes:  +14

Objective

  • Understand how the Flux architecture is different from MVC (Why did Facebook prefer Flux over MVC?)
  • Discuss “Unidirectional data flow”
  • Create a short application using React.js and Flux architecture!
  • Usage in the mobile environment

Description

ReactJS is not a full featured MVC framework and does not intend to be. It’s only the V in MV*. What differentiates React from other frameworks s it’s render approach. Since DOM manipulations are slow, React replicates the DOM virtually. Your application talks to the Virtual DOM which is really fast, and then React diffs the virtual DOM with the real DOM and applies all changes efficiently.

About Flux Architecture:

Flux is the application architecture that Facebook uses for building client-side web applications. It complements React’s composable view components by utilizing a unidirectional data flow. It’s more of a pattern rather than a formal framework, and you can start using Flux immediately without a lot of new code.

It’s based on one simple principle:
“Data moves in one direction through your application”.

Flux Application architecture

We’ll explore how all this translates to the real world scenario! :)

Requirements

An open mind and otherwise, a laptop (if you want to work with me as I create the application live!)

Speaker bio

  • Specialist, eXperience Technology - SapientNitro
  • JavaScript hacker / Proficient in creating real-time scalable web applications and performant websites using Angular, Backbone and Node.js + frameworks.
  • JS enthusiast from the dawn of the JS era! :)
  • Winner - Yahoo! Open Hack 2012, Bangalore

Links

Slides

http://fluxpres.sublimecoder.com/

Comments

  • 2
    Anoop Gupta (@guptaanoop2005) 3 years ago

    All the best Rakesh!! - Anoop

Login with Twitter or Google to leave a comment