Web Development

React Rally 2016: Conference Recap for Developers

blog-featured-image react-rally-2016 SH-510x296

React Rally is a two day, single track conference for developers of all stripes. Though the focus tends to be React.js and React-y things, speakers cover topics such as React Native, Flux, ES6, isomorphic universal JavaScript, functional programming, fringe languages, and much more.

In 2016 React Rally celebrated its second year, and it was amazing. The conversation has since moved past How-Tos and To-Dos. It has evolved. React Rally 2016 focused on improvements to performance, animation, accessibility, and the community as a whole.

Watch React Rally in its entirety or, if you just want the scoop, here are some of the highlights (but don’t take my word for it).

Day One

Animation

Sarah Drasner ( @sarah_edo) spoke about the importance of animations in applications. She contrasted the pros and cons between animating in SVG and Canvas. She also led the discussion in best practices and dished out her favorite tools for creating amazing animations.

Some of Sarah’s favorite tools:

This is one of the best talks I have seen about animation on the web.

Relay 2

Relay was announced shortly before React Rally 2015. A client-side compliment to GraphQL. Soon, the team at Facebook will release Relay 2.

Watch more about Relay 2.

Debugging

As developers, we spend a lot of time on tooling. Tools allow us to do more with less…with less bugs–yeah right. If you’re a web developer then you’re very familiar with debugging in the console. Some browsers are better than others (Chrome). However, browser makers are starting to catch on to the growing trend of catering to the “developer experience.”

The team at Mozilla has set out to rewrite the Firefox developer console using React and Redux. As James Long explained and demonstrated, this opens up a world of possibilities. Including:

  • Debugging Node.js applications using FireFox developer console
  • Adding debugging tools to your editor

Watch it.

Compose! Compose! Compose!

React is functional by design. And the drive to use and implement functional styles of programming continue to be a hot topic in the community.

The famous Dr. Boolean gracefully schooled the conference in all the wild and crazy things a dot (.) can do.

Going Serverless with GraphQl

Serverless architecture is hot-hot-hot. Amazon Web Services (AWS) and Lamda have given developers the ability to free themselves from intense server maintenance. Now, for pennies on the dollar, processes and services can run only when needed. It’s amazing!

Kevin Old ( @kevinold ) took it one step further and layered GraphQL on top to create an application dedicated to–best subject ever–dad jokes.

Watch it.

Multi-threaded Hybrid Apps

Kate Hudson ( @k88hudson ), an engineer at Mozilla, spoke about the real-world problems surrounding multithreaded Javascript applications. Because…thanks to web workers, Electron, and other platforms, Javascript apps no longer have to run on a single thread.

Great talk! Watch it.

App Performance & Benchmarking

React is fast. This is why we love developing with it. However, it can be faster. It’s easy to get stuck in a mind-set where every user has powerful devices with gobs of memory. This is just NOT true.

In order to monitor, test and benchmark web applications, Saif Hakim ( @saifelse ) introduced the community to several available tools to track, measure, and debug performance issues.

Watch it.

PureScript

Inspired by Haskell and Elm, PureScript is a functional, lightweight language that compiles to Javascript.

Watch it.

RethinkDB

The IoT is here. These new connected devices present a certain set of challenges when it comes to data, maintaining experiences across devices, etc.

The team at RethinkDB presented a great solution with their NoSQL document style database. By allowing applications to subscribe to database queries, applications no longer have to poll or ping for data updates. The database does it for you.

This does require web sockets, but the idea is cool and I’m looking forward to trying RethinkDB out. You should too.

Watch it.

Day Two

Accessibility

If you’re not on the Accessibility train - get on board. Marcy Sutton ( @marcysutton ), walked the community through what it takes to debug the accessibility layer of an application, how the Aria API can make this easy - or hard, and some neat tricks to make developing accessible web applications easier.

Really loved here Where in the World is Carmen San Diego metaphor.

The Guts

Paul O’Shannessy ( @zpao ), one the lead developers of React, opened the hood and walked us through the guts that make React such an amazing tool.

Binary Search Trees

Wow! I am excited. Aren’t you? If you enjoy thinking about data structures and ways to traverse data structures in the most efficient way possible don’t miss this talk by James Kyle ( @thejameskyle ).

James, one of the co-creators of Babel, spoke about the power of binary search trees. What? Imagine being able to search for a single value in thousands of other values without having to iterate one by one. Binary search trees allow us to do just that - way more efficiently.

Watch it.

RxJS & Redux

There is a lot of excitement in the community about RxJs and Observables. In essence, an Observable is a data type that allows an application to ‘subscribe’ to its stream. When the data represented by the Observable updates, the application or component ‘subscribed’ to that Observable will update with the new data. This is really powerful.

Ben Lesh ( @BenLesh ), one of the co-creators of RxJs, spoke about the use of RxJs with Redux async actions.

Web Workers Are Still Awesome!

Again. Wow! This was one of my favorite talks of the conference. Web Workers are a powerful browser API that sees widespread support across most browsers. Web Workers allow web applications to operate on multiple threads. This speeds up processing time and, wait for it, overall app performance.

Taking queues from Angular 2, Parashuram ( @nparashuram ), wondered if it would be possible to move the entire React Render cycle to a web worker, leaving only ReactDOM.render to do it’s thing, updating the DOM, in the main thread. By doing this, he essentially moved the entire application logic to another thread. Separating logic and data operations from UX operations. By doing so, he managed to increase the performance of data-intensive web application.

While he didn’t succeed 100% in his quest, his proposal community  was sound and I expect to see this conversation evolve.

Giving Back

Let’s use the platform we have been given to make positive change in our community and in the world. The world is connected and we, as developers, have a lot of power in knowledge. There are lots of communities and organizations that need our skills.

Devon Lindsey ( @devonbl ), developer at Apple, encouraged all of us think deeply about how we can contribute more than just code.

Building RPGs in React

This was cool. Just go check out the game, built with React and Redux.

Watch it.

Rethink

Ryan Florence ( @ryanflorence ) is one of the most outspoken members of the React Community. It’s also amazing to watch him live-code in Vim. For real. How does he do that?

Anyway, Ryan’s challenge the community was to rethink where we are at with regards to React and Redux. React was originally thought to be the V in MVC. However, we all quickly realized that model was totally thrown out the window because the idea of the Component is so powerful.

Then we adopted Redux with it’s Reducers to hold data and Actions to perform, well, actions. So now we’re in this work of RVA. RVA vs MVC…hmmmmm. I’ve been here before.

Ryan’s point was that Components are powerful. The fact that you can compose Components is even more powerful. Let’s not discard a brave new world for what’s comfortable and familiar. Most of his questions were rhetorical, but the point is clear.

There is always a better way.

To Wrap Up

As it grows, this community continues to amaze me. No longer is discussion centrally focused on syntax or tooling or even React for that matter; it’s broader. The conversation is about how, we as developers, using the tools available can make the web better. How can we make it faster, more performant, more beautiful, and more accessible.

React Rally is quickly becoming a platform where these conversations can take new forms and lead in new directions.

Stay tuned for next year.

1200x628-banners-Single-Page-Web-App

Single Page Web Apps: Why building a web app means less… and more than it used to

The number of modern web technologies available to software engineers is mind boggling....

Read the article