IE11 does not and will not implement ES2015 Proxy objects. Yet IE11's end of extended support is October 14, 2025.
Is there any way to polyfill Proxy objects for IE11? All other browsers support Proxy already.
If yes then we would all be able to use it in production today. If not then we'll have to wait almost a decade...
Edit: I'm asking specifically for IE11 as I know IE to usually have IE specific features that I'm often not aware of.
Edit2: I'm particularly interested in being able to implement a catch-all interceptor. Similar to __getattr__ in Python. It only has to work in IE11.
Best you can get is github: GoogleChrome/proxy-polyfill
According to Babel docs:
Due to the limitations of ES5, Proxies cannot be transpiled or polyfilled.
There's quite a concise answer for this question on Quora
Proxies require support on the engine level and it is not possible to polyfill Proxy.
Most major JS engines have yet to implement support. Check out the ECMAScript 6 compatibility table.
You may want to use Object.observe instead, possibly with polyfills for browsers other than Chrome, but even then the proposal has been withdrawn, and it has been announced it will be removed from Chrome in a future version.
I personally haven't tried the Object.observe solution but it might be a good place to start.
Good luck!
EDIT:
Thank you to Matt Jensen in the comments for pointing out there is infact a way to polyfill some parts of ES6 Proxy using this package: github.com/GoogleChrome/proxy-polyfill
AWESOME
Direct solution for polyfilling ES6 Proxy in environments without support this feature, of course is impossible - if storing some polyfill function info window.Proxy is meant. But if thinking this way, most modern features of ES6 can't be supported, because they will raise syntax error for old-version ECMAScript engine.
That's why you should use transpiler, which perform preceding wrapping ES6 code into specific constructions, and then evaluate transformed code on old engine. In current case, just use one Babel plugin: https://www.npmjs.com/package/babel-plugin-proxy
Of course, while using this solution, you should configure Webpack to segregate target bundles for different client agents / browsers, depending on it's feature set discovery. See details here: https://gist.github.com/newyankeecodeshop/79f3e1348a09583faf62ed55b58d09d9
Related
I understand the ES6 modules specification, the question is about its support. AFAIK, there are no browsers that implement this natively (see Browser compatibility here). Got a couple of questions about this:
ES6 modules is an ES6 feature, obviously. When I look at kangax compatibility table, I don't see such row (for ES6 modules) at all, why is that? It's a ES6 feature afterall...
hence, the only way to use ES6 right now is to use a build tool, such as babel, browserify or any other aternative, right?
how are the modules gonna be fetched, when they're natively supported - as async AJAX calls from the browser?
ES6 modules is an ES6 feature, obviously. When I look at kangax compatibility table, I don't see such row (for ES6 modules) at all, why is that?
There's an issue being discussed on kangax's github.
the only way to use ES6 right now is to use a build tool, such as babel, browserify or any other aternative, right?
No. There is also a polyfill by Guy Bedford at http://github.com/ModuleLoader/browser-es-module-loader.
And there's already the preview release of Edge that implements it natively.
how are the modules gonna be fetched, when they're natively supported - as async AJAX calls from the browser?
Yes but not exactly: they will be fetched when the are used for the first time, by a call to an object (a function or a property) on the imported library.
Native modules are available in the following versions of browsers:
Safari 10.1
Chrome Canary 60 – behind the Experimental Web Platform
flag in chrome:flags.
Firefox 54 – behind the dom.moduleScripts.enabled setting in about:config.
Edge 15 – behind
the Experimental JavaScript Features setting in about:flags.
source
I've integrated BabelJS into my workflow. This allows me to use ES6 features. I'm using gulp to convert my Javascript to ES5 Javascript.
I imagine that it would be better, though, to just use my ES6 code directly in newer browsers that support it. Is there a way to check for the availability of ES6 and use a BabelJS converted file only as a fallback?
Of course there is, but it's a lot of hard work. Similar approaches are being used to navigate a mobile client to a dedicated URL, but do you really want to start mapping each feature used in your code base, and then checking each and every feature in the client?
Stick with transpiling client code for now. It might be better in the future.
I don't understand the best way to use "let" keyword...
In IE11 and Chrome45 I can use it fine
In Safari8.0.4, like in older versions of Chrome, it gives the error "unexpected use of reserved word 'let'"
In Firefox the let keyword only works inside <script type="application/javascript;version=1.7"/>, but this script type isn't even recognized as Javascript in IE11, Chrome45, Safari8.
Here's a JSFiddle that shows it in action: https://jsfiddle.net/p6cgtyg6/1/
So -- I don't mind requiring users to use modern versions of their browsers.
And I don't mind excluding Safari if there honestly is no version of Safari that supports this keyword. (Is that really true? Why does everyone spend all their time griping about IE when Safari seems so much worse in ES6 terms? Have I missed something?).
But how should I allow "let" to work in Firefox while not preventing Chrome/IE? (I haven't yet found links from people griping about how Firefox script tag behaves differently from Chrome, and I'd have expected more complaints, so I figure I must have missed something obvious...)
Concerning Safari 8, it's just not supported ; for that browser, I'd recommend using Babel.
If you have the gut feeling that this bug won't be fixed anytime soon* then you could have a script that detect Firefox which would then inject your script(s) with the appropriate value for the type attribute.
As a side note, I would advise not to use let blocks—unless you wanna use this transpiler—nor let expressions which will be dropped.
* fixed in Firefox 44
let is a part of ECMAScript 6 specification, and ECMAScript 6 itself is in 'draft' status. Even in its incomplete form its features aren't supported fully by actual browser versions.
Since you want to dive into ES6 today for production, your best bet is to use ES6 to ES5 transpiler, most prominent ones are Babel and Traceur, which are available as both CLI and packages for the build system of your choice. There are online tools for Babel and Traceur to try them out. And Scratch JS extension for Chrome uses both Babel and Traceur and is excellent for developing and compiling ES6 scripts if the build system is not an option.
Here is up-to-date comparison table that embraces ES6 feature support in both browsers and ES6 compilers.
And here is a great collection of ES6-related tools.
See browser compatability of this ES6 keyword.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let#Browser_compatibility
Also see this SO post for ES6 feature detection.
I've been working with KoaJS for a while, and we can easily use the 'let' keyword and the generators when using the --harmony flag but I couldn't find how much support for does the node v0.11.x provides while using the same.
I tried using the default value argument initialization but couldn't succeed.
Is there any source available which can list the no of features of ECS 6 supported in node v0.11.x using the harmony flag? Or if there is any npm module available for node that might allow me to use the same?
Thanks in advance.
With regards to your second question, yes, there is es6-module-loader.
For a long list of transpilers, shims, and other tools for using full ES6 features now, see addyosmani's ECMAScript 6 Tools page.
As for native ES6 support in node.js, V8 officially implements "ECMAScript" but AFAIK the V8 project doesn't release a spec of their implementation.
However there are some sources of useful information out there.
Here's a brief overview of ES6 in node.js v0.11.6.
You may want to determine the version of V8 that your version of node.js uses.
See the node.js blog for recent changelog info.
It can also be useful to find the version of V8 used in a given Chromium release.
The Chrome release notes can be found here.
Keep in mind that different flags can be set for the same version of V8.
Chromium and node.js both have ways to set flags in V8 related to ES6 support.
Here are two tables that list ES(6) feature support across implementations:
http://pointedears.de/scripts/test/es-matrix/
http://kangax.github.io/compat-table/es6/
This MDN page lists a set of reference articles for ES6 language features.
At the bottom of each one you can see the status of Chrome support for that feature (and using V8 versions determine the support in node.js).
Finally, the V8 issue tracker
provides a list of issues related to ES6 features, many of which have been implemented and their issues closed.
You can use ~96% of ES6 features in Node.js 6. You can review support for all versions on http://node.green/
This does not concern node 0.11, but in the current 5.8.0, you can use --harmony_default_parameter.
It it scheduled to be included by default in v6.0.
Looking through the Mozilla JavaScript site, I see that JavaScript 1.8 has a lot of great functions. In most cases it has code you can add to extend prototypes of the basic types in the case that the function is not implemented on the user's browser. Is there a library that you can use to add all those functions and therefore use JavaScript 1.8 freely in your code?
You are probably looking for a shim.
Check out the es5-shim: https://github.com/kriskowal/es5-shim/
Modernizr has a pretty exhaustive list (wiki) of alternative polyfills or shims (look under ECMAScript 5 for your needs):
https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills
Also, not all features can be provided by shims or polyfills. You could start an issue (remember to search and read the README first) for a feature that you want but isn't provided and the developer might tell you if it's not possible.
Since this version has lots of syntax differences (mentioned by Rob W), there are only two way this can be done
Somebody would have to write a JS interpreter in JavaScript, which would be good awful slow.
Write a server side compiler that turns JavaScript 1.8 into EcmaScript.
No, there isn't one out there.