React - Differential Loading (es5, es6, esnext, etc) based on browser

Question

I come from the Angular World. Angular 8 recently was released with a Differential Loading feature. This means that, depending on your browser, different compiled Javascript code will be served. So, let's say you are using Internet Explorer 11, the app will download ES5 javascript files, while if you are in an evergreen/new browser (chrome, firefox, etc), then your served Javascript will be ES6.

See this (https://blog.angular.io/version-8-of-angular-smaller-bundles-cli-apis-and-alignment-with-the-ecosystem-af0261112a27)

Is there anything like this in the React world?

Answer 1

It depends. If you're using CRA, there's an issue for exactly this use case.

However, what Angular's differential loading does, is just configure Webpack to build an ES5 and an ES6 version. These different outputs can then be loaded conditionally using nomodule and type="module".

A great article explaining how to do this with Webpack can be found here.