The code you want to write has jsDoc, meaningful and by extension long variable names and white space to make it a delight to read just to name a few.
The issue is that these things that make it easy for the code to be read and makes it larger and longer for a browser to download it, leading to slower code.
What we need to do is to have a build and deploy process, ideal one that integrates with our source control. Graham Robinson has explored some of these ideas in his blog, SAPUI5-Deployer Project. I had a couple of key conversations with Graham as he was putting this together.
Recently when I arrived on another client I realised that our needs were similar but different.
- We still need to get the code from the developer machine to gateway system efficiently.
- We need to minify the code to reduce load times
- We would like to have -dbg versions of the code so that we can toggle the debug mode in QA or Production systems.
- We would like to add a component-preload.js file as described by Mattius in Optimizing UI5 Apps
- I would like to make the command line build process as simple as possible.
In our situation our source code control is inside the firewall all this process needs to happen inside the firewall also.
There is too much here to cover in one blog so I am going to make this a series of blogs so that you can easily digest this.
Before we get to the next piece of the puzzle, let me introduce Grunt.
Grunt is a task runner. There is nothing new in this make, maven and ant are all examples of great task runners and they are all great tools.
I settled on grunt as it was tools that the UI5 team had also chosen. If you have a local clone of UI5, you will see how grunt is used to build UI5 itself.
In the next blog we will install node install grunt and get our first task running.