Hey everyone.

Just wanted to get your opinions/expertise on this. I use Include Files as i am sure many of you do for my sites. I am fairly certain i understand the basic principle of HTTP Requests (so i tell myself!). My question is, does each one of these include files create an HTTP Request? If so, then does this negatively affect your load times? Should you keep includes to a minimum or is there no significant impact?

Hi,

by Include do you mean you use <% include YOURFILE %> in Templates to include other Template.ss files? Or do you mean real files like Images, Css and Javascript?

You don't have to worry about the templates. SilverStripe merges those to just one html file.
Images, CSS and Javascript on the other hand mean separate requests for each file. There are a couple of reasons why you should try to minimize the number of request for example:
- Older Browsers only issue 2 parallel request to a server. So if you have a lot of images only two of them will be loaded at the same time...
- Each Request creates overhead so less request means less overhead.

And yes it can have a huge effect if you optimise well.

Silverstripe can combine js and css files for you: http://doc.silverstripe.org/sapphire/en/reference/requirements#combining_files
For images you can use sprites.

A good way to see what request are done to load a page, and how long each of them takes checkout firebug (getfirebug.com) it has a network tab, there you can track each request.

Johannes

Hi Johannes

Thanks for this great breakdown. Yes, I was referring to the <% include %> files within Templates. I manage a couple large sites (both in pages and content), and am always looking for ways to keep my code clean but also efficient. I was not sure how the <% Include %> files reacted from a HTTP Request standpoint. Thanks so much for clarifying.

I use sprites in my navigation but dont typically do the larger sprite files where many different components are included in one image file. Have you or anyone done this before? I think I saw an example from Amazon.com where their entire site was one single sprite!

I didn't know about Requirement::combine option, so thanks for that golden nugget! I will most certainly use this for js heavy pages.

Thanks again for your detailed response. Hopefully this topic will help others as well.

J

Hi,

you are welcome :)

about large sprites for the entire site: I have worked on projects were this was used. It always depends on the situation. If some areas of your site will only be visited by a small portion of the users it might not be a good idea. On the other hand if you only have a couple on images and those get used everywhere it can speed up things. I would ensure that the sprites don't get to large. Browsers have maximum file sizes for files they keep in their cache. On a larger Site I normally try to create one sprite for the basic ui and then others for section specific stuff. If more optimisation is needed I link multiple subdomains to the same folder on the server and split the image urls to those to circumvent the browsers limitation of 2 requests per server. Also you can then use different expires headers for different subdomains to store static content in the users cache longer.
But it always depends on the needs (and budget) of the project. Firebug is a great help! If you can't decide which solution is better try both and track the load time...

Johannes