使用 gulp 减少 google 关闭 运行 时间
Decreasing google closure run time using gulp
我在开发的时候正在尝试寻找plovr的替代品,因为plovr有点落后,每次升级google闭包在那里变得很麻烦。
所以我考虑使用 gulp。我使用 gulp 连接设置了一个 gulp 网络服务器,在回退时,它会触发 google 闭包编译,然后等待文件生成,然后将其提供给客户端。我面临的问题是编译时间比 plovr ~40s vs ~20s 大得多。对于前端开发人员来说,在进行小的更改后等待页面加载将需要很长时间。知道可以做些什么来优化闭包编译器的编译时间。这是我的 gulpfile.js 让您了解我的设置。
var gulp = require('gulp'),
closureCompiler = require('google-closure-compiler').gulp({
extraArguments: ['-Xms2048m']
}),
fs = require('fs-extra'),
grepit = require('grepit'),
connect = require('gulp-connect'),
sleep = require('system-sleep'),
outputPath = './target/js',
pathToJavascriptCode = './project/',
compilationLevel = 'ADVANCED',
entryPoint = undefined;
gulp.task('js-clean', function() {
fs.removeSync(outputPath);
});
gulp.task('js-compile', function() {
var outputFileName = entryPoint + '.' + compilationLevel.toLowerCase() + '.js.compiled';
return gulp.src([
pathToJavascriptCode + '/**/*.js',
'./node_modules/google-closure-library/closure/goog/**/*.js',
'!./node_modules/google-closure-library/closure/goog/**/*_test.js'],
{base: './'})
.pipe(closureCompiler({
closure_entry_point: entryPoint,
externs: [
'./public/javascripts/libs/jquery-1.7-externs.js'],
compilation_level: compilationLevel,
warning_level: 'VERBOSE',
js_output_file: './' + outputFileName,
manage_closure_dependencies: true,
language_in: 'ECMASCRIPT6',
language_out: 'ECMASCRIPT5'
}))
.pipe(gulp.dest(outputPath))
.pipe(connect.reload());
});
gulp.task('webserver', function () {
connect.server({
root: ['./target/js/'],
port: 8080,
livereload: true,
middleware: function() {
return [function(req, res, next) {
res.setHeader('Access-Control-Allow-Origin', '*');
next();
}];
},
fallback: function(req, res) {
var requestedFileName = req.url.replace('/', '');
var requestedFileNameParts = requestedFileName.split('.');
compilationLevel = requestedFileNameParts[3] === 'simple' ? 'SIMPLE' : 'ADVANCED';
entryPoint = requestedFileNameParts[2] !== 'all' ? requestedFileNameParts.splice(0, 3).join('.') : undefined;
gulp.start('js-compile');
var path = './target/js' + req.url;
while(fs.existsSync(path) !== true) {
console.log(path + ' does not exist yet, sleeping for 1 second');
sleep(1000)
}
return path;
}
})
});
gulp.task('watch', function() {
gulp.watch('./project/pauljs/**/*.js', ['js-clean']);
});
gulp.task('default', ['js-clean', 'webserver', 'watch']);
经过一些研究我猜问题是 jvm 的启动时间慢,我发现这个 https://www.npmjs.com/package/closure-gun 它使用 nailgun 来 运行 google 闭包编译器,但我不是确定如何将它与我当前的设置集成,任何指针将不胜感激 :)
我找到了答案并将解决方案添加到 google-closure-compiler npm repo 的自述文件中
https://github.com/google/closure-compiler-npm/pull/77/files
我在开发的时候正在尝试寻找plovr的替代品,因为plovr有点落后,每次升级google闭包在那里变得很麻烦。
所以我考虑使用 gulp。我使用 gulp 连接设置了一个 gulp 网络服务器,在回退时,它会触发 google 闭包编译,然后等待文件生成,然后将其提供给客户端。我面临的问题是编译时间比 plovr ~40s vs ~20s 大得多。对于前端开发人员来说,在进行小的更改后等待页面加载将需要很长时间。知道可以做些什么来优化闭包编译器的编译时间。这是我的 gulpfile.js 让您了解我的设置。
var gulp = require('gulp'),
closureCompiler = require('google-closure-compiler').gulp({
extraArguments: ['-Xms2048m']
}),
fs = require('fs-extra'),
grepit = require('grepit'),
connect = require('gulp-connect'),
sleep = require('system-sleep'),
outputPath = './target/js',
pathToJavascriptCode = './project/',
compilationLevel = 'ADVANCED',
entryPoint = undefined;
gulp.task('js-clean', function() {
fs.removeSync(outputPath);
});
gulp.task('js-compile', function() {
var outputFileName = entryPoint + '.' + compilationLevel.toLowerCase() + '.js.compiled';
return gulp.src([
pathToJavascriptCode + '/**/*.js',
'./node_modules/google-closure-library/closure/goog/**/*.js',
'!./node_modules/google-closure-library/closure/goog/**/*_test.js'],
{base: './'})
.pipe(closureCompiler({
closure_entry_point: entryPoint,
externs: [
'./public/javascripts/libs/jquery-1.7-externs.js'],
compilation_level: compilationLevel,
warning_level: 'VERBOSE',
js_output_file: './' + outputFileName,
manage_closure_dependencies: true,
language_in: 'ECMASCRIPT6',
language_out: 'ECMASCRIPT5'
}))
.pipe(gulp.dest(outputPath))
.pipe(connect.reload());
});
gulp.task('webserver', function () {
connect.server({
root: ['./target/js/'],
port: 8080,
livereload: true,
middleware: function() {
return [function(req, res, next) {
res.setHeader('Access-Control-Allow-Origin', '*');
next();
}];
},
fallback: function(req, res) {
var requestedFileName = req.url.replace('/', '');
var requestedFileNameParts = requestedFileName.split('.');
compilationLevel = requestedFileNameParts[3] === 'simple' ? 'SIMPLE' : 'ADVANCED';
entryPoint = requestedFileNameParts[2] !== 'all' ? requestedFileNameParts.splice(0, 3).join('.') : undefined;
gulp.start('js-compile');
var path = './target/js' + req.url;
while(fs.existsSync(path) !== true) {
console.log(path + ' does not exist yet, sleeping for 1 second');
sleep(1000)
}
return path;
}
})
});
gulp.task('watch', function() {
gulp.watch('./project/pauljs/**/*.js', ['js-clean']);
});
gulp.task('default', ['js-clean', 'webserver', 'watch']);
经过一些研究我猜问题是 jvm 的启动时间慢,我发现这个 https://www.npmjs.com/package/closure-gun 它使用 nailgun 来 运行 google 闭包编译器,但我不是确定如何将它与我当前的设置集成,任何指针将不胜感激 :)
我找到了答案并将解决方案添加到 google-closure-compiler npm repo 的自述文件中 https://github.com/google/closure-compiler-npm/pull/77/files