How To: Load Scripts Faster on Your Webpage

Load Scripts Faster on Your Webpage

This may be an old trick, but it is still very useful. Head.js proudly proclaims that it is the only script you need in your head. You can use it to parallel load all your scripts. This is much faster than loading them one by one.

Step 1: Download Head.js

It can be found at http://headjs.com. Save it to the same directory as the html file your working on is saved.

Step 2: Add This Between Your Head Tags!

<Script>

</script>

<script src="head.min.js"></script>

Step 3: Add This Between Your Script Tags.

head.js("file1.js", "file2.js", "file3.js");

Except replace the file names with the names of your js files.

Step 4: So Far It Should Look Like This:

<script src="head.min.js"></script>
<script>
head.js("less.js", "jquery.js");
</script>

Step 5: Style Sheets

If you are planning to link any external style sheets. Make sure you put it before script src. Otherwise it wont work, I had to learn this the hard way.

Step 6: Enjoy.

You should notice a considerable change in your sites performance. Other guides to speed up your site will be coming soon.

Image from Photobucket

It’s Black Friday week in the Gadget Hacks shop! Huge sales on Bluetooth speakers, phone mounts, online courses, and more. The biggest discounts are on online classes, and we’ve hand-picked our 10 favorites for you. Check them out!

See the 10 best BF deals for online courses (up to 99% off) >

Our Best Phone Hacks

Delivered daily to your inbox.

Be the First to Comment

Share Your Thoughts

  • Hot
  • Latest