Forum Moderators: not2easy

Message Too Old, No Replies

Do Comments in CSS slow loading time?

         

Makaveli2007

10:21 am on Oct 19, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



If I'm using more than a few comments in my CSS file, will that slow down my page loading time? Does the browser only read /* */ without wasting any time for what's in between or does it actually read the whole comment, but just not do anything with it?

just wondering how to speed up my page loading time. It doesnt take long to load, but doesn't really load flawlessly (not sure how to describe it, but it seems like the whole design isn't there at once, but for a split second you see a not completely loaded version of the page)..which I find strange, because the design is as simple as can be.

Maybe I need to specify heights and widths for everything (sorry if this sounds like Im lazy lol, its just that Im a beginner (who is more into SEO/online marketing than development) and my design is working in all the main browsers right now so Im happy and if I dont need to specify heights and widths I'd do without that for now, becuase itll probably take some more time I dont have)?

BillyS

11:39 am on Oct 19, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



With a very slow connection, CSS bloat will slow loading time. If you're talking about the time to render a page (local CPU), I wouldn't think the comments make any difference.

What I've done is create two versions. One I use to document the CSS and this version has a lot of comments. The second version is cleaned up and used in production.

There are a lot of online tools that will analyze your CSS, you might want to play with those.

Makaveli2007

12:31 pm on Oct 19, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



thanks. Ill probably just do that..Keep one CSS with comments and one that Ill make as "lean" as possible.

alt131

12:29 am on Oct 20, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hi Makaveli2007,

It doesnt take long to load, but doesn't really load flawlessly (not sure how to describe it, but it seems like the whole design isn't there at once, but for a split second you see a not completely loaded version of the page)..which I find strange, because the design is as simple as can be.

Couple of immediate thoughts:

  • Validate [jigsaw.w3.org] css to check one of those comments isn't inadevertently malformed /other typos- and useful to test your html (link from the referenced page) as well.
  • Check images have a height and width specified. This is best practise, and although browsers can/do calulate without them, it can sometimes cause a "pause" as the browser shifts already displayed content to fit an image in.
  • If using tables, check they aren't really, really long. They should not be displayed until completely downloaded (hence best practise is to break long data tables in several smaller ones and style them to look connected), but drawing really long ones can sometimes cause visual oddities.
  • Check the code isn't triggering FOUC [webmasterworld.com]- follow the link in enclyclo's post to an explanantion/fix.
  • There are free online tools (g "optimisation"), but Firefox has an extension called Yslow (requires the extension firebug) that provides information about files being downloaded. Should allow you to identify which files is actually slow - the culprit might be the html, a script, swf, images etc rather than the css.

Makaveli2007

7:37 am on Oct 20, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Ah thanks for the great advice alt131! I can't do this right now (about to bounce (early in the morning here)), but I'll test these things later. My guess right now is that it might be FOUC - I dont see that problem in firefox, just in IE (havent tested it in other browsers personally, just asked people to do so with opera/etc. and they told me it looked alright)