JS minifyng

Web Performance Discuss Test Results
1

Hi,
I have a site and I made a webpagetest [url]http://www.webpagetest.org/result/111221_CT_2KCDS/1/details/[/url] and I realized that each JS file is wasting time because of the first time byte, I combined all the JS files together but most of the the combined JS files didn’t work. Is it because it wasn’t combined right or it can’t be combined? Either way, is there a program that combines it for you (by adding a script)?
Thanks,
Hersh

2

Wow, I don’t know that I’ve ever seen that many separate files. There are some fringe cases where you can’t combine but usually it’s a trivial effort of concatenating the files together. You just need to make sure that the order is maintained, the text encoding is the same (no unicode BOM’s) and that the relevant files are still loaded before any inline script that depends on it.

If the javascript modifies the DOM then you are best off only combining chunks of code that are referenced from the HTML right after each other and not pull in code files from later in the document in case they depend on something in the HTML in between.

3

Thank you for replying.
How can I know which of the files are possible to combine.
Thank you,
Hersh.

4

Best way is to look at the page source and just combine files that are referenced right after each other without anything in between.

This chunk for example:

  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/61zBQJTuojL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/11rTBaklV6L.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/11Wyia6dZRL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/11n18BfqlVL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/11hj0HzivoL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/518l61SpNVL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/01E7g5et9PL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/312PC%2BcCTSL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/41huVBHqHBL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/11CnqXAZA7L.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/21IDTX5GY4L.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/41QR2T0HdiL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/41VtLqPdPrL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/31fApiQ6hhL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/01YWXJhaWJL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/21IGgk7s%2BRL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/31LH4rzJ12L.js"></script>

and this one:

  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/61QHBVNqcDL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/315tCwFHHZL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/21-gGTHofsL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/218f3bhzaRL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/11C1XEsIUlL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/01yCpMcDHRL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/311-YvlDsKL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/61-W9Z2lPXL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/21qoawMSkrL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/11euNUoTo%2BL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/011AS2GSaIL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/01kHJKwYtSL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/01dxX9hAIZL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/01q40IxtMnL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/41eS7fKBzZL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/11XAT70TuIL.js"></script>
  <script type="text/djs" data-djssrc="http://z-ecx.images-amazon.com/images/I/41-0caYX8RL.js"></script>

Are you using cloudflare? It looks like those are all generated dynamically and are from their rocket loader: WordPress has changed my javascript code. | WordPress.org

You’d want to modify the page before the optimizations (turn off all cloudflare optimizations and re-run the test).

5

Thank you.
hersh.