Java Reference
In-Depth Information
Deploying JavaScript
When it comes to deploying your JavaScript program, it's time to think about optimizing
the code. If you've used multiple external libraries and lots of modules, you might have a
large number of files that need to be included in your HTML file. One way of doing this is
to simply include a different
<script>
tag for each JavaScript file; however, this is not
optimal for a number of reasons:
• the scripts must be included in the correct order
• each file represents a separate request to the server
• the files will be large
The solution is to combine all the scripts into a single minified and compressed file. There
are a number ways to achieve this, some of which we have already looked at in this chapter.
You can use a package manager such as Bower, Ender, or Browserify to deal with dependen-
cy management; Browserify will also bundle everything together into a single file for you.
Alternatively, you can use Grunt or Gulp to automate the process of bundling the files to-
gether and minifying them at the same time. There are a number of options that will do this
for you on the server side as well.
Once you've combined all the files into a single file, then minified and compressed it, adding
it to the HTML file is the next step. The optimal position for the
<script>
tag is right
at the end of the page just before the closing
<body>
tag, which we have used in all our
examples:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Ninja JavaScript</title>
</head>
<body>
...
