ansaurus

Question

How much multiple style sheets slow down to website?

Answer 1

+5 A:

Combining them into a single stylesheet reduces the number of HTTP requests a browser needs to make to load a page. However, after the first time a stylesheet is requested, assuming you've configured your cache directives correctly, the browser should have it cached and thus subsequent page loads won't see much of a difference.

Use a tool like Google's PageSpeed plugin or Yahoo's YSlow to figure out what's actually causing performance issues once you have most of the site in place, and optimize the things that matter. Don't worry about it before then.

Amber 2010-05-01 01:11:12

This answer is spot-on, but I would like to wave the Firebug flag on this one. Using Firebug's Net tab, you get a tremendously useful break-down of every single resource, including an indication of the overhead of an additional DNS lookup. Get it here: https://addons.mozilla.org/en-US/firefox/addon/1843

David Foster 2010-05-01 01:16:09

Yep. Don't start trying to fix performance problems before you know what the major contributing factors are. This particular difference is fairly minimal, but it will add up over hundreds of pages.

Paul McMillan 2010-05-01 01:21:13

@David Foster: Google PageSpeed and Yahoo YSlow are actually *plugins for FireBug*, so I figured that I wouldn't explicitly mention FireBug itself, since the ones I mentioned cover that and add even more analysis of load time issues.

Amber 2010-05-01 01:24:53

so it's only a matter of reducing http request, bandwidth use will be the same and it will only affect to home page of the site.

metal-gear-solid 2010-05-01 01:39:38

and what would be ur answer if i ask same question for javascript? other than to put javascript at bottom.

metal-gear-solid 2010-05-01 01:40:50

and it is mentioned "Reducing the number of HTTP requests in your page is the place to start. This is the most important guideline for improving performance for first time visitors. As described in Tenni Theurer's blog post Browser Cache Usage - Exposed!, 40-60% of daily visitors to your site come in with an empty cache. Making your page fast for these first time visitors is key to a better user experience." at http://developer.yahoo.com/performance/rules.html

metal-gear-solid 2010-05-01 01:45:44

In general, bandwidth usage will be approximately the same, yes - the bandwidth overhead per HTTP request isn't that high relative to the content generally being served. Yes, the same answer applies to Javascript, it's simply another textual resource being transferred over HTTP. In regards to the blog post, there is no single "catch all" place to start for improving performance on every site; you really need to look at the profiler results for *your* site and figure out what that particular situation needs addressed.

Amber 2010-05-01 02:48:12

but here is mentioned for javascript "Note that while JavaScript files are not reliably cached by browsers, CSS files are." http://www.websiteoptimization.com/speed/tweak/http/

metal-gear-solid 2010-05-01 03:10:25

The technique described there is generally overkill.

Amber 2010-05-01 03:29:13

@Dav: Of course, silly me. Though, last time I used Google PageSpeed I did so separately of Firebug. Nonetheless, there's still something to be said for Firebug's default functionality, specifically the Net tab. If all you're looking for is an indication of how much an additional DNS lookup will delay your page load time, then it's really all you need.

David Foster 2010-05-01 13:34:28

If the question is just about multiple files being served from the same domain, though, there isn't any additional DNS lookup occurring - only another HTTP request.

Amber 2010-05-01 19:57:51

ansaurus

tags:

views:

answers:

How much multiple style sheets slow down to website?

related questions