Slow loading site: CI or bad coding?

[eluser]Michael Wales[/eluser]

Total HTTP Requests: 74

HOLY S@#T! [edited... play nice ]

The total number of external CSS files on this page is 29

29 CSS files... wtf?

The total size of this page is 445635 bytes

The home page (and all dependencies) is half a meg... holy s@#t.

The total size of your images is 194186 bytes

194kb in images - not to bad, due to the nature of the site... but maybe bumping down the JPG quality could help

[eluser]codex[/eluser]
[quote author="walesmd" date="1193224849"]

Total HTTP Requests: 74

HOLY S@#T!

The total number of external CSS files on this page is 29

29 CSS files... wtf?

The total size of this page is 445635 bytes

The home page (and all dependencies) is half a meg... holy s@#t.

The total size of your images is 194186 bytes

194kb in images - not to bad, due to the nature of the site... but maybe bumping down the JPG quality could help[/quote]

CSS: Um, 29 css files. Yes, I use one file per controller because it makes it easier to make changes. I know exactly where to look and I don't have to search for stuff. But this is just for development stage. I plan to put it in 1-2 files and optimize that.

JPG quality: I've already done some tests. Initially I didn't even use jpg compression, and some files were 3-4 times the size they are now. This setting (85%) produces good results and relatively small sizes.

But indeed, I need to optimize more.

[eluser]codex[/eluser]
[quote author="walesmd" date="1193215216"]The js could definitely slow things down a bit...[/quote]

[quote author="rick jolly" date="1193215216"]It’s probably the javascript. The signup page is loading scriptaculous and jquery.[/quote]

Yeah, but I have already tried to run the scripts without js, but I saw no real change.

[eluser]codex[/eluser]
[quote author="gops" date="1193221595"]I had a similar problem when I was using lots of jquery plugins with bunch of css files.

Try to combine those files in one single file.

Don't include the files which you are not using in a page. Like , you are using jquery UI plugin in signup page , draggable and droppables , there ain't any need for them there.

Also pack javascript with packer such as ,

http://www.google.com/search?q=javascrip...IN244IN244[/quote]

I would like to load the js only on pages where needed, but how do I do that? I have 1 main layout file and load the views dynamically into that. Could you just load the js with the view, which is an option, but it wouldn't be loaded into the HEAD section since that is generated before the view.

[eluser]gops[/eluser]
The easiest way is to make if statements in main view file.
Although it adds more lines , it is really fast option.

something like

if($controller == "main")
{
/*add main javascript files*/
}
else if($controller == "bla")
{
/* add another javascripts*/
}

And make sure that caching is enable.

There are php packers are also available, which actually combined all the javascript in to one,on the fly. google for them.

[eluser]codex[/eluser]
Ok, as a test I've completely removed all JS and CSS and the thing FLIES! I think it is safe to conclude that I have to look into optimizing those.

Thanks guys!

[eluser]Derek Allard[/eluser]
You might find Firebug useful here. For example, check this out.

[eluser]codex[/eluser]
[quote author="Derek Allard" date="1193255320"]You might find Firebug useful here. For example, check this out.[/quote]

Yes, I use firebug too. It's pretty handy. But how do you sort the data to display like yours? (from less to more, vertical).

[eluser]gops[/eluser]
Its in NET tab. There is also yahoo performance plugin for Firebug.

[eluser]codex[/eluser]
I *think* I have tackled the main problem. There were requests for non existent CSS files which I guess is pretty bad. I've removed those requests and also I am calling the Javascripts only on the pages where they are actually needed, which are only a few. The site is so much faster now.

While quite logical (now), I didn't really realise that everything has an effect. I thought that lots of small files were the same as one large one. After all, the overall size will still be the same, right? Didn't think of the amount of requests though.

It now works as it should and I've learned an important lesson

Thank you guys so much for the help!


Oh yeah, I've enabled Gzip compression. Good or bad idea?