The mission was on to a) cut the bandwidth taken up in delivering these files to the users’ browsers b) reduce the number of HTTP requests and thereby improve page loading times and c) potentially help out with SEO by getting content closer to the top of the page. That last one is a bit of a reach, but it never does any harm for a page to have a higher proportion of real content nearer the top.
The strategy was;
3) Suture the files together into 1.
And this is where all my problems began.
The site stopped working. Or at least various bits of it did. I could often control which bits worked by swapping the order of the stitched files and then I twigged that perhaps the minimising or packing was failing in some way and that when the files were all together in one file, this was being highlighted.
So what to do … ?
After working through all the files and correcting all the faults as reported by JSLint (barring some stylistic ones I chose to ignore), the files are now all minified / packed and correctly sutured together into one large file. The site works as intended and page loading times have been plunged by almost 70% for new visitors on a decent connection.
JSLint might seem a bit pointless at first, all it does is nag you about lots of seemingly petty coding rules, but I would say BEAR WITH IT, learn why it is making the suggestions it is making and if needs be, turn off some of the stricter rules if you can justify why. Your patience will be rewarded as your files will now survive minifying and packing and you will be able to stitch them all together into one large file to dramatically improve your website performance.