Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript

Lars Wettmann
Lars Wettmann
15,376 Points

Best practice for optimized javascript-inclusion for speedy websites

Hey guys,

I wonder what's the/a best practise to include javascript files/jquery plugins into a big php webproject.

There are severel plugins I don't need on all the pages. I came up with the solution to only include the scripts I need for every specific website, so there are as little http-requests as possible for speed enhancement.

But I also know that it's sometimes better to just cache the files and include all the scripts on all sites. Or would it be better to minimize all the scripts' code and inject it modularily (is this an english word?) via php into the website-code itself when needed? Or should I minimize all the js-code into one file (for one http-request only) and include that one in each site? Or.. You get the point.

What is the best way for speedy websites in your experience? Or do you have tutorials or pages who give a great explanation to it? Thanks in Advance for your time and help.

2 Answers

Ian Svoboda
Ian Svoboda
16,639 Points

While i'm not a PHP developer, I would tell you that your focus should be to minify your payload. Now, semantics aside that is kind of similar to your above ideas of what you should be doing (the two suggestions you put forth) but the wording is important to your mindset when coding this stuff.

Essentially, its a game of how small can you make the script(s) you need to call and the number thereof. So that being said you'd want to try to not only minimize your scripts but if possible dynamically load plugins based on the pages being viewed.

An great example of this is an Ecommerce Website. Say you have magiczoom (great plugin) in use for the product page images. You wouldn't need to have that script firing on every page since you'd 1.) get scripting errors and/or 2.) performance would suffer because the page is loading a script that it doesn't need.

If you're saying to yourself: I have plugins that I need to use on over 3/4 of my pages, it might be better to include them into a single file and minify. If you have alot of " situational use" plugins, you can try grouping those similar ones together on specific plugin scripts and call those dynamically.

Lars Wettmann
Lars Wettmann
15,376 Points

Thanks for your answer, Ian. I did not group the plugins yet, but I'll do that once my page is live.