Tuesday, 29 December, 2015 UTC


Summary

4 months ago I released a survey asking React developers about their community.

I did this to gauge the community and compare the findings on how similar they are to another Web Development community, Angular (where the idea for a survey was originally inspired from Jeff Whelpley and PatrickJS). What I found was a lot of trends with each section a battle of obtaining the opinion of the majority of how to do application development within React platform. As this year comes to a close it’s going to be interesting to see where the trends go from here here are the results of the React Developer Survey.
Transpilers
Which approach do you prefer when hacking ReactJS?

Analysis

The results were very clear the community seems to be more focused on Babel with 80.4% of developers for ES2015/ES2016 transpilation. ES5 has 9% of React developers perhaps for legacy reasons while Typed languages such as TypeScript (1.2%) and Flow (4.4%) isn’t popular. Personally I prefer TypeScript for optional types and JSX support but mostly because I don’t have to think about the presets I should add. I do have to admit that I wish TypeScript had better generator support. With the new direction that Babel 6 is going it we might be able to have TypeScript as a plugin which would make Babel everyone’s goto transpilers pipeline. Do you like the direction of Babel 6 and how complex our build systems are becoming?
Do you prefer to use JSX or JS?

Analysis

This question is one of the interesting ones since tutorials can write examples in both formats and they do in fact mention it each time. Perhaps it’s time to just assume that everyone will be using JSX. We’re past the point of questioning the adoption of JSX as it seems to be widely accepted by 92% of React Developers. There’s no question here everyone should be using JSX.
What application architecture do you prefer when using ReactJS?

Analysis

One of the most interesting, and arguably thehurtful, events in the React community was the explosion of Flux application architecture. After the introduction by Facebook it seems like a huge bikeshedding match and everyone had a their own version of Flux with their own spin off name (reflux, flummox, fluxible, fluxxor, fynx, fluxify). The common question of the day was “Which Flux implementation should I use?” since there are so many choices it was hard to determine what to start off with. A person I know even went so far as to suggest that making your own version of Flux was part of being a React developer. With 41.6% React developers choosing Redux by Dan Abramov (who now works at Facebook) because of the live reloading component tooling built-in to the architecture itself. We have 32.8% of React developers still on Flux perhaps for legacy or the abstraction level is good enough not to refactor. That leaves 19.2% of Other architecture which was a long list of: “will release soon”, “my own flux-like”, “Fluxish”, “Proprietary Solution”, and “backbone”. If the React community sticks with Redux and regular Flux then the resources shared between the community would benefit. For a time I still recall my friend saying to me “We use Flux it’s amazing” then 3 months later “We switched to flummox for better isomorphic support” then finally 2 months later “flummox was depreciated and they recommended Redux so now we’re making that our main framework” keep in mind the app still has legacy backbone which now has flux, flummox, and redux. It’s safe to say we should all start with Redux now.
Select any of the following data-related libraries that utilize on a majority of your React projects:

Analysis

Immutable-js is the clear winner here with 63.6% of React developers using it. While the 2nd most popular being Socket.IO with 29.1% of React developers. It seems like React developers prefer to manage their own models with libraries like RxJS, Socket.IO, and Immutable-js you can build your own data management depending on your app needs. I’m assuming React developers are using Immutable-js to hook into shouldComponentUpdate in order to improve rendering of their application. It’s also worth noting that Falcor/JSON Graph was released not too long before the survey and we can assume that 9.4% or 31 developers on this survey are probably Facebook employees with Relay/GraphQL being on the list so soon after release. With Flux Facebook said we should pass state to child component. With Relay Facebook said component should have their own state with queries. Do you think the community should decide on how they should manage data or do you think it’s highly dependent on the application? After Falcor and Relay released both advocating that REST isn’t the solution why do you think there wasn’t an explosive adoption of everyone’s own implementation?
When dealing with CSS which libraries do you use?

Analysis

It’s worth noting that free-style was surprisingly in the lead in the beginnig of the survey. It seems like a simple and more elegant way of managing CSS even André Staltz has been advocating it. “After being a bit disappointed with lack of JS-CSS constant sharing in css-modules, I’m quite happy lately with (free-style)”
After being a bit disappointed with lack of JS-CSS constant sharing in css-modules, I’m quite happy lately with https://t.co/MglQncbHIQ
— André Staltz (@andrestaltz) October 21, 2015
With that said it seems like the React community still prefers to roll their own even with developers creating many different ways to manage CSS. This could be due to a lack of resource sharing (the Flux explosion had many lists) or that we all still manage our CSS globally. The problem could also be due to React developers focusing on JavaScript and UX rather than UI with css. It could also be JSX where the designer doesn’t want to touch JSX so there is now a clear separation of who does what work (designer creates html/css components then the React developer makes it work). What do you think?
When talking about JavaScript that runs on the Server/Client/Mobile what term do you prefer?

Analysis

Another debate within the React community is what we call the thing we do when we share code between two different environments. React initially started with isomorphic but then soon there was backlash within the community from Michael Jackson with the article Universal JavaScript and other member Kyle Simpson (getify) basically saying I called it Middle-End before it was cool. The bikeshedding wars may still continue but for the most part the community seems to have adopted Universal with Isomorphic in parentheses. For me personally I prefer Universal even though Isomorphic may sound more cool Universal is more correct. One problem with Universal is… well… it’s too universal at times. I work on the Universal project for Angular 2 so this question and the community response to it was particularly interesting for me. I can say that the Angular Team choose the term Universal because it’s more correct of a term. In the future we would just call it JavaScript but for right now when we say JavaScript there is still an association with the browser. Having something to call the thing we do normally help push the movement so it’s a natural concept for JavaScript developers in the future.
Do you use the server rendering features in your React project?

Analysis

Another way to look at this is that 50.6% of React Developer use or will try server rendering. The numbers seem to be consistent Angular 2 developers considering server-rendering. For 25-30% of developers both Angular 2 and React communities need to have server-rendering so it’s great to see the percentages are the same in both communities. Personally I care about server-rendering for perceived fast initial bootup time and mobile performance.
Which text editors or IDE do you use most often when hacking on React?

Analysis

Sublime Text seems to be winning here with 48.5% of React Developers using it with the runner up being Atom with 31.6%. Personally I switch between the two. I use Atom until I run into a problem or error then switch back to Submline until I miss Atom. Each time I’m wanting to like Atom but each time I also run into a problem. I’ve spoke with a few developers about this and they also feel the same why about Atom. It seems like Nuclide is the Hipster editor since no one really use it even after the release with features such as unified developer experience with React and Flow. Perhaps old we all have our own work flow that’s ingrained into us after we first picked an editor when we started.

Obviously I missed out on a huge opportunity by not including Window’s Notepad or Adobe Dreamweaver if anyone still can remember using them because I did. What was your first editor and how did you migrate to the one you have now? Did you take the huge initial investment in VIM and never looked back or do you have the same problem I do with Sublime Text and Atom?
Which build tools do you plan on using when hacking on React?

Analysis

Build tools build tools build tools. The JavaScript Fatigue is real. JavaScript seems to be the best at tooling yet the same strength may also be a weakness. The community seems to be adopting Webpack very well with 81% of React developers choosing it over others. Here’s another graph if you’re able to see it.

Most users using webpack, gulp+webpack, or webpack+browserify+gulp, then it’s browserify+gulp before we’re back to webpack with webpack+grunt. Without a doubt the community has chosen Webpack and with Webpack 2 coming making it’s way with ES2015 and Rollup built-in it seems like it’s here to stay. Do you think the solution for JavaScript Fatigue is a cli, command-line interface, or do you think we need more opinions in React development?
What other renderers do you use with React?

Analysis

The answer is clear cut here. Most 77.1% of React Developers use it react-dom while 23.1% use React Native. It’s interesting to see the other renderers aren’t as popular but more interesting to see React introducing developers to Native mobile applications. Do you think someone will release another renderer like WebWorkers or another DOM rendering support?
What frameworks other than React do you use regularly today?

Analysis

It’s interesting to see that we still haven’t killed off jQuery I heard jQuery was used in 80% of the web and recently heard it’s down to 60% and in our survey 45% of React developer still use it. The another interesting thing to take note of is how the data is nearly the same for Angular 2 where 25-ish% of developer only use the framework while nearly the same amount also use the other and at the same time jQuery is double the numbers for both surveys. Backbone seems to be everyone’s legacy code with the numbers reflecting about the same 12%-15%. Why do you think jQuery is still used so much today even though we have many different ways to construct components?
What is your React experience level?

Analysis

The spread of expert is pretty good and natural I would say. In the Angular 2 there were more experts rather than beginners because that framework has been out for 6 years. With React it seems like the community is slowly moving toward larger React Applications and soon we will start to see more advanced examples and topics. What’s your experienced been when developing React applications and how large is the codebase you have been working on?
Which React features do you love?

Analysis

One of the most interesting things I put of this list was Hype I added it half-jokingly as React is in the hype right now but it turns out 19.6% of React Developers agree they’re in it for the Hype so I’ll create a few hashtags for this #inb4hype #jsHype The results show what makes React and it’s React Components (86.1%), Unidirectional Data Flow (79.2%), Virtual DOM (81.9%), JSX (67.4%), and JavaScript Everything (64.8%) with Server-rendering following with (41.5%).
React Developer Survey Results
The results are extremely interesting and I hope that this blog post helps everyone in the community get a sense of what other developers are thinking about React development. With the call to solve JavaScript Fatigue in the air it would be even more interesting to see how much the efforts affect the community when everyone agrees on a workflow. It would be interesting to see the results of the next survey after ReactConf 2016 and keep in mind the Questions may change as do the trends in community. We all may end up using Elm
If you want to learn more you can read Angular 2 for React developers
If you want to make your own Lisp you can read Making a Mini-Lisp: Intro to Transpilers
If you’re the 25% that also use Angular here’s Angular 2 for AngularJS developers
Follow us on Twitter @AngularClass
Like us on Facebook AngularClass
Join our Slack chat room
Follow me on Twitter @gdi2290
The post React Developer Survey Results appeared first on AngularClass.