in Basset, Laravel, Our Authors

85% Faster Gulp Builds with Laravel Basset

That’s it! As promised in status update, the latest 1.5 version of Laravel Basset delivers from 85% to 90% improvement in production/optimized/minified build times for your scripts and styles.

Anatomy of a Collection

In the simplest form a collection contains stylesheets and javascripts, which can be CSS, SCSS, LESS or JavaScript, ES6, CoffeeScript, and can also contain vendor styles and scripts contained in bower_components.

In the world of Single Page Applications and JavaScript frameworks this can be hundreds of files in a single collection, and when production build is run all these files are concatenated and minified to produce a single JavaScript and a single CSS file.

Between two application releases not all files are changed and not all files require optimization process to be run on every build, and specially vendor files which change maybe once between several releases.

Most Gulp recepies and plugins can check which files are newer or are changed so that Gulp can run only on changed files which can improve development/watch mode builds but not for production/optimization mode, because for production build you still have to have all files concatinated and minified together to get a single small JavaScript or CSS file for browser.

The new build process can recognize parts in big production files which already have been optimized in a previous build.

That means that if you have changed 20% of files in a collection, and optimization step has been run on the remaining 80% of files, those optimizations will not run again, and you will still get one JavaScript/CSS file in the end.

Measurements/Comparisons

Now because the explanation above reads like any other Gulp changed/incremental plugins description we’ll use speed measurements to show how these improvements are different from others you’ve probably seen.

So here we have a real world application with a collection with 80 JavaScript and 30 CSS files, when built/optimized/minified these files end up as two files:

CSS         145KB
JavaScript  1.5MB

This gets built/optimized/minified in 5.57 min, so that’s a normal build time.

Now I changed 10 CoffeeScript (which build slower) files and run build again, and now we have a build time of 20 s !

So in this case we have 94% faster build!

And if I were to change more files we could probably get slower then this.

This is one example, but depending on your application you will probably see improvement of around 85% and more in build speeds.

This also means that your CI builds can run much faster, deployment can be much faster, and many other possibilities can be open (like watch mode with production settings, or streaming updates to production).

We will call this feature “swaped-incremental builds“.

As with previous releases, there are no breaking changes. Just go ahead and run:

npm install laravel-basset@~1.5.0
Share this ...Tweet about this on TwitterShare on FacebookEmail this to someoneShare on RedditShare on Google+Share on LinkedInPin on Pinterest