Journey towards upgrading to React-16

This began an year back when Andrew Clark fascinated all of us by architecting React-Fiber.
We all waited for this major change to come alive.

On April 8th 2017, React v15.5.0 was released and which deprecated:

`React.createClass` and `React.PropTypes`

We started migrating our codebase to get rid of the deprecation warnings and waited for other libraries to migrate to latest version too.

React had a critical bug from v15.5.0 — v15.5.3, we directly migrated to stable v15.6.1 when we were ready with the changes, it was a lot of work since it involved changes in almost every other React Component with PropTypes defined.

On 26th Sep 2017, v16.0.0 was released, it was 33% smaller and performant than v15.6.1.

We were excited to do this migration, and we updated to v16.2.0. Since we had already fixed all files wherever deprecation warning was thrown earlier, we found the migration very easy. But we saw a lot of npm warning while installing packages which was due to version incompatibility with React v16.0.0 and above.

We also upgraded a lot of libraries and pushed React v16.2.0 to production.

The Error:

At we support a wide range of browsers, older browsers such as IE10 as well. Within 4 hours of release, we started receiving error-logs from clients at Sentry, we quickly reverted back to old v15.6.1
Upon investigating we found “only the browsers which doesn’t support ES6” were failing. This was very strange because we used Babel to transpile our code to ES5. 
We investigated further and found that in our webpack config babel-loader has excluded node_modules from being transpiled, and that is the correct behaviour because as a standard all the libraries publish in ES5.

We were using sanitize-html, newer version(1.16+) of it was using ES6 without transpiling to ES5. I reverted back to older version of sanitize-html and pushed React v16.2.0 to production again.

We saw multiple developers complaining about the same issue, so we raised a PR to Babelify the library. Thanks to Tom Boutell for quickly merging and publishing the changes.


This time it was stable and is currently running on the latest v16.2.0.

A special thanks to Aakash Goel for helping me throughout.