At Sparkbox we love our tools! We’re constantly seeking to replace or upgrade our existing tools with new or better ones. In fact, we’re downright foamy. Since our tools have changed significantly since we last wrote about our build process, it’s time to share where we are currently.
Gulp Joins the Team
Our biggest shift has been welcoming Gulp to the party. We’ve turned to Gulp in places largely to address speed issues in big projects that utilize Grunt + Assemble. Aside from being incredibly quick, Gulp is also more flexible compared to Grunt. It can quickly integrate vanilla NPM packages without needing a wrapper plugin like Grunt does. Now, Gulp’s versatility doesn’t nullify Grunt or make it redundant. Reality is that we still use Grunt for some things, and we’ve actually used Grunt within Gulp (yes, the mythical build tool turducken configuration!). We have come to realize that Gulp and Grunt are both quality tools and they both offer benefits. We’d be hurting ourselves to spurn one in favor of the other just to be homogenous.
Why Gulp?
@markdalgleish has a great slide deck breaking down the difference between Gulp and Grunt, which is a great high-level overview.
Our experience with Gulp has been really positive, and we’re excited to continue to put it through its paces as it matures. We especially love Gulp’s use of streams and its code over configuration model. Its code model is especially nice as it opens up the entire NPM package library for use in our build process! We also love Gulp’s speed—it runs laps around Grunt for some tasks.
Gulp’s code over configuration model is not without drawbacks though. Using Gulp brings with it the cost of having more code to maintain per project, which isn’t a bad thing per se, but it’s a factor to consider. Gulp also lacks a dedicated plugin community like Grunt, and we still rely on some of those missing plugins (e.g. Grunticon) in our build process.
Goodbye Compass, Hello libsass
We’ve also moved to libsass from Compass. We made this move strictly for the speed difference because libsass is really really fast. Moving to libsass means we no longer have Ruby as a build dependency; it’s always a nice bonus to drop a dependency, especially a super slow one. Along with libsass, we’ve taken the transition as an opportunity to experiment with Bourbon and Autoprefixer. Bourbon is an excellent replacement for Compass. Autoprefixer, though, is more interesting and seems to be gaining traction among our devs, as it enables us to write normal CSS3 instead of writing mixins.
Performance Testing and Workshop Goodness
We have also started automating our performance testing via the WebPageTest NPM module (our new friend Gulp lets us easily integrate directly with the package). There is a Grunt plugin that offers the same functionality, but using the NPM module gives us access to the entire API (e.g. scripting for authenticated pages) instead of just the subset that the Grunt plugin offers. And we do have a new Frontend Testing Workshop (details coming soon to buildright.io) that offers an in-depth dive on all things related to frontend testing.
Stay Tuned
That’s where we are right now. Who knows where we will end up in the coming months, but we will be sure to continue to document our tools as they evolve.
