3 ms·

So, today I'm using babel to transpile my code to es5. Anyone know of any good tooling to use transpiled code for older browsers and es6 for newer?

t1amat 10y ago
What you are describing is serving up different assets based on user agent detection. The "tool" in this case would be the application responsible for serving it, most likely either your custom server-side web app code, or your web server itself. You should continue to use the transpilers for some time though. It has been reported that many ES6 features run quite a bit faster as transpiled ES5 than natively as ES6.
- Cthulhu_ 10y ago
  It should be possible to do so client-side by having a bit of loading / bootstrapping JS that does the feature detection.
  - t1amat 10y ago
    While technically feasible that is a low quality solution for the sake of keeping the solution space in JavaScript. JavaScript-based feature detection is one thing but conditionally loading the entire application is another. It is wholly pointless if you are already transpiling to ES5, and as mentioned numerous times, a performance problem in at least the short term.
saidajigumi 10y ago
It'd be nice to see support similar to Autoprefixer[1]'s use of Browserlist queries[2]. Those let the developer to specify the desired target platforms by browser versions, by global usage stats (e.g. '> 5%'), or by custom usage stats ('> 5% in my stats') etc., and derive the correct prefixes needed to deploy to those targets. EDIT (for clarity): It'd be great to see similar query support to derive a "lowest common denominator" Babel preset for an intended ES generation vs. browser profile set. [1] https://github.com/postcss/autoprefixer https://github.com/postcss/autoprefixer [2] https://github.com/ai/browserslist#queries https://github.com/ai/browserslist#queries
- hzoo 10y ago
  Yep, it's our plan to do something like that with community help - have a PR open for discussion at https://github.com/babel/babel/pull/3476 https://github.com/babel/babel/pull/3476. Also https://twitter.com/samccone/status/722826060161617923 https://twitter.com/samccone/status/722826060161617923.

t1amat 10y ago

What you are describing is serving up different assets based on user agent detection. The "tool" in this case would be the application responsible for serving it, most likely either your custom server-side web app code, or your web server itself. You should continue to use the transpilers for some time though. It has been reported that many ES6 features run quite a bit faster as transpiled ES5 than natively as ES6.

Cthulhu_ 10y ago
It should be possible to do so client-side by having a bit of loading / bootstrapping JS that does the feature detection.
- t1amat 10y ago
  While technically feasible that is a low quality solution for the sake of keeping the solution space in JavaScript. JavaScript-based feature detection is one thing but conditionally loading the entire application is another. It is wholly pointless if you are already transpiling to ES5, and as mentioned numerous times, a performance problem in at least the short term.

saidajigumi 10y ago

It'd be nice to see support similar to Autoprefixer[1]'s use of Browserlist queries[2]. Those let the developer to specify the desired target platforms by browser versions, by global usage stats (e.g. '> 5%'), or by custom usage stats ('> 5% in my stats') etc., and derive the correct prefixes needed to deploy to those targets. EDIT (for clarity): It'd be great to see similar query support to derive a "lowest common denominator" Babel preset for an intended ES generation vs. browser profile set. [1] https://github.com/postcss/autoprefixer https://github.com/postcss/autoprefixer [2] https://github.com/ai/browserslist#queries https://github.com/ai/browserslist#queries

hzoo 10y ago
Yep, it's our plan to do something like that with community help - have a PR open for discussion at https://github.com/babel/babel/pull/3476 https://github.com/babel/babel/pull/3476. Also https://twitter.com/samccone/status/722826060161617923 https://twitter.com/samccone/status/722826060161617923.