Javascript babel插件异步转换为模块方法,无需再生器
我的目标是将async/await编译为Bluebird承诺,并将性能影响降至最低 这似乎是将async/Wait编译为Bluebird最常用的方法,但是它会将我的应用程序的速度降低约10-20%,这是不可接受的。我怀疑这主要是因为再生器,它似乎是Javascript babel插件异步转换为模块方法,无需再生器,javascript,async-await,bluebird,babeljs,Javascript,Async Await,Bluebird,Babeljs,我的目标是将async/await编译为Bluebird承诺,并将性能影响降至最低 这似乎是将async/Wait编译为Bluebird最常用的方法,但是它会将我的应用程序的速度降低约10-20%,这是不可接受的。我怀疑这主要是因为再生器,它似乎是babel插件异步转换为模块方法所必需的 例如,我在index.js中有以下代码: var Promise = require('bluebird'); async function foo() { console.log('foo');
babel插件异步转换为模块方法所必需的
例如,我在index.js中有以下代码:
var Promise = require('bluebird');
async function foo() {
console.log('foo');
await Promise.delay(500);
console.log('bar');
}
foo();
还有这个package.json:
{
"name": "async-regenerator",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "browserify index.js -t babelify --outfile bundle.js"
},
"author": "",
"license": "ISC",
"devDependencies": {
"babel-plugin-transform-async-to-module-method": "^6.7.0",
"babel-preset-es2015": "^6.6.0",
"babelify": "^7.2.0",
"browserify": "^13.0.0"
},
"dependencies": {
"bluebird": "^3.3.5"
},
"browserify": {
"transform": [
"babelify"
]
},
"babel": {
"presets": [
"es2015"
],
"plugins": [
[
"transform-async-to-module-method",
{
"module": "bluebird",
"method": "coroutine"
}
]
]
}
}
使用npm run build
编译该文件确实有效,但运行bundle.js会产生错误:
ReferenceError: regeneratorRuntime is not defined
将再生器添加到package.json会修复以下错误:
{
"name": "async-regenerator",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "browserify index.js -t babelify --outfile bundle.js"
},
"author": "",
"license": "ISC",
"devDependencies": {
"babel-plugin-transform-async-to-module-method": "^6.7.0",
"babel-plugin-transform-runtime": "^6.7.5",
"babel-preset-es2015": "^6.6.0",
"babelify": "^7.2.0",
"browserify": "^13.0.0"
},
"dependencies": {
"babel-runtime": "^6.6.1",
"bluebird": "^3.3.5"
},
"browserify": {
"transform": [
"babelify"
]
},
"babel": {
"presets": [
"es2015"
],
"plugins": [
[
"transform-runtime",
{
"polyfill": false,
"regenerator": true
}
],
[
"transform-async-to-module-method",
{
"module": "bluebird",
"method": "coroutine"
}
]
]
}
}
然后bundle.js确实成功运行了,但是它使我的构建增加了100kb,并且可能会引入前面提到的性能问题
我的问题是,为什么需要再生器呢?我的目标浏览器(Chrome和Firefox)支持生成器,所以一定有办法只使用本机生成器,对吗?我不知道这是否能解决我的性能问题,但我想试试
我知道还有两种类似的异步/等待方法:
- 看起来它和我想要的也很相似,但是我在运行它时遇到了一些其他问题,也许这是后面的另一个问题的主题:)
如果我忽略了你认为值得尝试的其他方法,请告诉我
我把示例代码放在-PRs上,欢迎使用 您可以为此使用插件。但不幸的是,es2015预设仍将转换生成器,因此您必须修改es2015预设。你可以使用,或者只是在你的babel配置中展开预设
"babel": {
"plugins": [
"transform-es2015-template-literals",
"transform-es2015-literals",
"transform-es2015-function-name",
"transform-es2015-arrow-functions",
"transform-es2015-block-scoped-functions",
"transform-es2015-classes",
"transform-es2015-object-super",
"transform-es2015-shorthand-properties",
"transform-es2015-duplicate-keys",
"transform-es2015-computed-properties",
"transform-es2015-for-of",
"transform-es2015-sticky-regex",
"transform-es2015-unicode-regex",
"check-es2015-constants",
"transform-es2015-spread",
"transform-es2015-parameters",
"transform-es2015-destructuring",
"transform-es2015-block-scoping",
"transform-es2015-typeof-symbol",
"transform-es2015-modules-commonjs",
"transform-async-to-generator"
]
}
请参阅,似乎有相同的问题,关于再生器运行时的错误,除非我包括再生器。异步到生成器不应要求再生器运行时。你看过编译后的代码了吗?你删除了以前的插件吗?错误信息是什么?错误信息与我原来的帖子中的相同。这里是最小的巴别塔配置:这个捆绑包清楚地引用了再生器。问题是es2015预设仍然转换生成器,并且使用了再生器运行时间。请看我的答案。谢谢,这就是问题所在。出于某种原因,我认为应该先运行预设,将async/await保留在适当的位置,然后再运行插件并转换async/awaits。猜我对巴贝尔的心理模型不太正确:)这比再生器快得多,尽管仍然比根本不使用async/await慢一点。