0

I have to combine all the script tag to one for page speed purpose. I tried merging all the js files but its causing errors with jquery. Following are few scripts i have used.

<script src="/index_files/jquery_002.js" type="text/javascript"></script>
<script src="/index_files/jquery_003.js" type="text/javascript"></script>
<script src="/index_files/mootools-core.js" type="text/javascript"></script>
<script src="/index_files/core.js" type="text/javascript"></script>
<script src="/index_files/respond.js" type="text/javascript"></script>  

Please can anyone help me with this.

Target
  • 199
  • 4
  • 19

2 Answers2

0

There are many ways to go about this...

Google's closure compiler is a nice online version http://closure-compiler.appspot.com/home

If you use Grunt there are many modules for you, I always use requireJS so I use the JS optimizer that comes with it.

Some Name: Yui compressor Google Closure compiler UlgifyJS (pretty sure it combines files too)

If you give me some more info about your project I could help you further.

Shan Robertson
  • 2,742
  • 3
  • 25
  • 43
0

You could do this multiple ways:

  1. Combine the files using some sort of tool. Closure Compiler is great, or look at something like webpack or rollup for more complex applications
  2. Utilize HTTP/2 to make it equivalent. All modern browsers support HTTP/2 out of the box. You can use this to your advantage by doing server push, which will reduce the number of requests made to the server. Read more here. Note that while this doesn't technically combine the files, it combines them into one request.
  3. Inline them into your body. This would make them one file, but it's generally a bad idea. (looking at you AMP) As for why see #4
  4. Don't! As caching becomes more and more common, combining scripts, especially library scripts, together, can be wasted bandwidth, as User Agents will likely already have jQuery cached. This can be used in conjunction with HTTP/2 for great effect
bren
  • 4,176
  • 3
  • 28
  • 43