Gulp scripts slow

sage
1

I’m experiencing a slow build time on the scripts task (~ 15s) due to bower dependencies. To work around I compiled them, saved them outside of the ./dist/scripts directory, and reference separately from main.js.

Any suggests on why it might be so slow or a better way to manage this situation?

Thx in advance!

Here is a list of my current bower dependencies:
“modernizr”: “2.8.2”,
“jquery”: “1.11.2”,
“bootstrap-sass-official”: “~3.3.4”,
“jasny-bootstrap”: “3.1.3”,
“lightbox2”: “2.7.1”,
“angular”: “1.3.14”,
“ngInfiniteScroll”: “1.0.0”,
“bootstrap-tabcollapse”: “~0.2.4”

2

Not sure how this is a Sage issue? Adding dependencies is going to increase the build time.

3

I was hoping to separate out the dependencies from main.js and only rebuild them if those files are altered or added to.

I feel it’s part of the Sage “discourse” because I think it could benefit Sage as that’s what I’m using and where I’m experiencing this issue. To me, the use of Discourse for the name of this forum means more than issues or bugs.

Anyway thx for a great project. bkc

4

One thing you could do is leave out modernizr until production. Modernizr is quite slow to run.

5

You can set up new files to be compiled. Not everything has to go into main.js.

Of course, that won’t necessarily cut down on your compile times since all scripts will still be compiled.

You have a pretty good amount of large dependencies. Especially something like angular, you could probably benefit from keeping that excluded from main.js and loading that directly on the page

6

Could prolly

  • check to see if a file is already minified and do not uglify it if it already is
  • play with uglify options to see if there is a speed increase
7

Yeah seeing same issues here… including bootstrap automatically makes the build go up to 16s on my MBP… it’s strange because it seems to happen before any of the css tasks even run… sourcemaps also take a while

8

I had this issue to with both scripts and styles…
It took like 14 seconds to gulp styles with bootstrap and font awesome. So when i am developing now with gulp and sage i comment out sourcemaps and cssNano. After commenting out this, the complie time with gulp styles is around 600 ms. And for scripts i comment out sourcemaps, uglify and rev. And the complie time on scripts is around 10 to 20 ms.

So it looks like this the style & scripts task.

var cssTasks = function(filename) {
return lazypipe()
.pipe(function() {
return gulpif(!enabled.failStyleTask, plumber());
})
// .pipe(function() {
// return gulpif(enabled.maps, sourcemaps.init());
// })
.pipe(function() {
return gulpif(’.less’, less());
})
.pipe(function() {
return gulpif(’.scss’, sass({
outputStyle: ‘nested’, // libsass doesn’t support expanded yet
precision: 10,
includePaths: [’.’],
errLogToConsole: !enabled.failStyleTask
}));
})
.pipe(concat, filename)
.pipe(autoprefixer, {
browsers: [
‘last 2 versions’,
‘android 4’,
‘opera 12’
]
})
// .pipe(cssNano, {
// safe: true
// })
.pipe(function() {
return gulpif(enabled.rev, rev());
})
.pipe(function() {
return gulpif(enabled.maps, sourcemaps.write(’.’, {
sourceRoot: ‘assets/styles/’
}));
})();
};

var jsTasks = function(filename) {
return lazypipe()
//GF REMOVE
// .pipe(function() {
// return gulpif(enabled.maps, sourcemaps.init());
// })
.pipe(concat, filename)
//GF REMOVE
// .pipe(uglify, {
// compress: {
// ‘drop_debugger’: enabled.stripJSDebug
// }
// })
// .pipe(function() {
// return gulpif(enabled.rev, rev());
// })
.pipe(function() {
return gulpif(enabled.maps, sourcemaps.write(’.’, {
sourceRoot: ‘assets/scripts/’
}));
})();
};

1 Like