Results: yes. Solutions: no?

Web Performance Discuss Test Results
1

First of all: thank you for this tool! Really useful!

However… I see what is wrong with my page/site ([url]http://www.webpagetest.org/result/110701_SG_Z484/1/pagespeed/[/url]), but it is extremely difficult to fix things - simply as I can not find related solutions…

What I need is, per error/warning, a link to a solution:

  • how do I compress text?
  • “compressible resources should have a “Vary: Accept-Encoding” header” - where?
  • “Minifying the following HTML” - how?
    and…

Maybe this tool is for PhP-developers only? I know HTML and CSS and use PhP to piece my site together - also using . js scripts - but I’m not versed in it, so I need to see examples… Just searching for it results in endless debates among specialists, (too) specific suggestions etc.

I don’t have direct access to my server settings, although I could ask my host to change something if it is really hampering - but so far Apache seems ok to me… I want to fix things on the front-end.

I found here this for the .htaccess file (only in the forum, not on the page-speed page itself):

<FilesMatch "\.(jpg|jpeg|png|gif|ico|css|js)$"> Header set Cache-Control "max-age=31530000" Header unset Vary Header unset ETag FileETag None </FilesMatch> <FilesMatch "\.(html|htm|php)$"> Header unset Etag Header set Cache-control "max-age=600" Header unset Last-Modified </FilesMatch>

I’m not even sure what it exactly does, but it helped improve the score… however, I have no idea if it will work once the complete site is up - right now I’m building the framework first - using Blueprint CSS etc.

Also, I tried CDN for jQuery (via Google), but it actually slowed down the loading time, so I now load it locally again.

In general, how good/bad is a 86/100 score: I would think fairly good, but how does it compare to other sites? When is it considered ‘acceptable’; is 100 realistic or is say 95 the highest ever reached?

Anyway, thanks again - great tool, but I could use some better hands-on solutions - any help is welcome!

2

Here is the information from the Page Speed team on the checks that they are done: Performance audits

Also worth reading is the information from the YSlow team: Best Practices for Speeding Up Your Web Site - Yahoo Developer Network

It’s difficult to have a simple explanation for how to fix them all because more often than not it depends on a LOT of different things. Compression for example (which is one of the easiest) is implemented differently for Apache, IIS, Nginx and may or may not be possible to control if you are on shared hosting.

The cache control changes you referenced above are REALLY dangerous to implement if you don’t understand the implications (you can never change the content of your css/js without changing the actual file name now that you turned it on because users will use the version in their browser cache for the next year regardless of what you change on the server).

The tool is language-agnostic and does not target PHP implementations. A lot of the basic (and more important checks) are basic HTTP capabilities while some focus on the front-end resulting html. I strongly recommend reading up on the fundamentals of how browsers, HTTP and servers interact to deliver a full page. The foundational knowledge will be exceptionally helpful no matter what you are building for the web.

3

btw, looking at your test result, it looks like you are being bit by the blocking behavior of conditional comments in IE: Conditional comments block downloads / Stoyan's phpied.com

If you put an empty conditional comment before you load your first css file you will get rid of the blocking behavior in the waterfall (where the second css file doesn’t start loading until the first completes) and you’ll get them loading in parallel (and improve performance a fair bit).

-Pat

4

Thanks Patrick!

Yes, the cache-control I disabled already as I’m working on my site: each time I upload a new version, I wouldn’t be able to view it myself, unless I empty my cache all the time - too clumsy… But, the site will be pretty static once released, so I will be not too worried from then on.

I got those conditions from an (older) ‘framework’ (that incorporates Blueprint CSS), but it seems not totally optimised. I read the conditional downloads article you link to - in the comments, someone mentioned [url=http://html5boilerplate.com/]http://html5boilerplate.com/[/url] - I might switch to that, as it addresses the issue that you pointed out as well.

In general, it is suggested to combine all CSS and JS into 2 separate files - what would be the best way, as in development I prefer to keep files separate, as to be able to find individual code (eg, my menu comes with its own css and js, so does Blueprint etc.). Before uploading (to test online), I would have to combine all those files? Rather time-consuming…

Anyway, back to the drawing-board - thanks for the pointers!

5

Yep, there is a tradeoff on the combining side. Optimally you would be able to do development with separate files and then as part of your release process you would run a “build” that would minify and merge the files and patch the necessary references in the code.

You could also keep them as separate files but use a “merge script” at runtime that can concatenate the files on the fly (so you would call it with something like /combine?mycss1.css&mycss2.css…)

Otherwise you could also use an accelerator (like mod_pagespeed) and have it do it for you but you usually need admin access to the server to install that kind of thing.

6

Right - [url=http://html5boilerplate.com/docs/#Build-script]http://html5boilerplate.com/docs/#Build-script[/url] is such a script, but it requires additional installs - I was hoping there would be some simpler solution.
Also, I now update perhaps 2 lines in one file, ftp it and then refresh - I could/should develop locally (WAMP), but somehow I ‘manage’ FTP-ing - probably a not so efficient quirk…
For the speed testing, the files should be combined as well - hm, maybe I can create something in VB, as I can’t work on the server (shared hosting) - or could one run mod_pagespeed on WAMP as well?

7

You can’t run mod_pagespeed on WAMP but something like this would work: Make your pages load faster by combining and compressing javascript and css files | rakaz