HTML and CSS Reference
In-Depth Information
If Adobe Flash is not a part of your worklow, the spritesheet animaion or the tween-based
animaion, which we have discussed in earlier projects, sill apply.
For generated graphics, you can get the
assets.js
file and the graphics from the
code bundle.
Separating the JavaScript files into modules
At the ime of development, the code is more maintainable when separated into iles. Each
file takes one role. That's why, in this project, we will separate the JavaScript files. The logic
is a lot simpler when the code is separated this way.
In producion, loading one ile is much faster than loading several separated JavaScript iles.
So, in producion, we usually concatenate all the script iles back into one JavaScript ile.
To know the reason behind this, please check the Yahoo! Developer Network
for the
Minimize HTTP Requests
secion at
http://developer.yahoo.
com/performance/rules.html
.
There are several approaches through which we can merge the iles into one producion
JavaScript ile; some of these are menioned in the following bullet list:
F
We can use the terminal cat approach. In Linux or Mac, we can write a shell script
that concatenates all the files inside the project's
scripts
folder.
F
We can use a shell-based tool that processes the project's assets.
Grunt
and
Gulp
are some of the shell-based tools that you can use. You can specify how the assets'
processes work. For example, we can concatenate all the JavaScripts into one file
and compass it.
F
We can use GUI assets' processor applicaions such as
Codekit
or
LiveReload
.
With GUI, it is easy to manage how files are merged using simple drags and clicks.
The following screenshot shows the coniguraion of how the
game.js
ile
prepends all the other files during processing:
