Topics

  1. Enter “Build Tools”
  2. Why Gulp?

The Starbright Development Team prides itself on building first-class websites. With the increasing number of websites going out annually, the dev team needed to conjure up a winning recipe to speed up production whilst maintaining website quality. Challenge accepted!

Enter “Build Tools”

Powered by JavaScript and crammed full of awesomeness, build tools are used to compile and organise program source code into binary code. Our dev team uses them for multiple different processes to ensure the best results. It can be quite a challenge to choose one application framework that every developer is happy with.

Why Gulp?

Our dev team chose Gulp because of its speed and power; also because of its impressive industry adoption rate, and the buzz around it. Having community support and contributions is also extremely valuable and helpful.

Gulp runs on Node.js, the massively popular Server Side JavaScript engine – (Node.js has amazing technical power, but that detail can be discussed in another article). The point is that it provides many people with the tools, framework and community resources, which helps improve a developer’s skillset on all levels! Problem solved.

We have set up our Gulp pipeline to be flexible. Each part or function can be switched on or off accordingly. Let’s look at two of these parts as examples to explain what kind of functions Gulp offers:

ScriptsScripts can be found everywhere on websites before it reaches a browser. Each script is isolated and discrete from every other functionality (which is important to know from a developer’s point of view). That does, however, make for slow loading times and on-page performance. You might notice some lagging frames on videos or jagged scrolling. The function runs through every script across the site and collects them all into one unified script file. While busy, it pipes this file to an application that minifies and compresses it – super slick and lightweight. StylesCopy the concept of how the scripts got squished into an efficient package here, but add post-processing. Being graceful in degradation also means your handwritten style sheets should be spiced up automatically, so to support various (and sometimes older) browsers. It’s basically smart enough to know which version prior to the major release you want covered, and runs off the caniuse.org website’s always-up-to-date feed, so you’re still trending on the screens of the technologically less-fortunate.

 

Have a Gulp and a smile! The effects we achieve using Gulp returns more rewards than ever thought possible at offset. It did take time to research, test, and with patience, implement it into production – but for the rewards achieved, we would do it all over again!