 |
August 2007 Archives
Jazoon'07: Presentations published
Posted by felipegaucho on August 21, 2007 at 12:50 AM | Permalink
| Comments (1)
Jazoon'07 presentations
Jazoon organizers have prepared all presentations for download on jazoon.com. Go to
http://jazoon.com/en/conference.html and browse the website for the
talks you require.
Jazoon'07 videos
The first videos of Jazoon'07 keynote presentations are up and running
on parleys: http://parleys.com/label/PARLEYS/jazoon07
* More videos will follow.
Jazoon'08 contribute
Do you wish to have a presentation at Jazoon'08? We will publish the
call for paper in September. You can then submit your abstract on
jazoon.com until the end of November. We are looking forward to receive
your proposal. |  |
Mozilla about cache
Posted by felipegaucho on August 15, 2007 at 01:26 AM | Permalink
| Comments (1)
I continue my studies about web applications optimization focusing in the browser side. My previous blog was about YSlow, the excellent add on of Firebug. Now, I focused more to understand how browsers cache works and how to trace problems caused by its storage strategies.
The browser side was a great concern few years ago, when the power of the client machines and the available broadband were quite restricted. Nowadays, it really doesn't matter if you push 1 or 2 MB of data over the Internet because the most part of the users will not feel much difference. Despite that, as engineer I am always looking for an optimal configuration and dropping useless characters in the server response or simply ignoring the garbage around my site goes against my sense of quality.
Well, if you want to thing about old concerns, you must go old school and check the old books, so I found this very old and yet useful reference about using Mozilla to inspect the web pages contents. The most part of the text is already obsolete, but there is a forgotten pearl in the end of the page, it is about cache.
Mozilla Cache Manager
From the original page: The cache manager in Mozilla provides you with full access to see what's in the memory and disk cache.
The single step to inspect your browser cache is to load the following address in your browser:
about:cache. That's it, then you have access to all information about the objects in the memory and also in the disk cache. You can also include the type of device you want to inspect: about:cache?device=[memory|disk]
A friend of mine just notified me about other interesting tricks in the address bar of Mozilla, including the about:config
A new javascript minifier: YUI Compressor
Another good new for the web developers is the YUI Compressor, a javascript minifier that promises to work better than its predecessors. Thanks for Milfont for this last minute tip :). There is a lot of controversial on how much it impacts on web performance or how much is worth to spend time and money doing small optimizations, but for now I accept the thesis about quality as an overall concern - let's see.
Expires Http header: the magic number of YSlow
Posted by felipegaucho on August 08, 2007 at 11:29 AM | Permalink
| Comments (2)
A good way to reduce the number of Http Connections required to
load a web page is to store images and other resources in the browser cache. It is very
well presented in this other blog. The problem is to find a correct
configuration of the names and values used by different browsers to
optimize the cache usage. To help us to identify what is going on during
the communication between browsers and servers, we have a large set of
tools available on the internet. One of my recent discoveries and preferred
tool is YSlow.
YSlow for Firebug
YSlow is an easy-for-use plugin that allows you to inspect any
web page just clicking a button. For me, it is a preliminary step in
any web site optimization - an indicator about the site pitfalls.
For example: applying YSlow in the blog page you are reading right
now, I got the results presented in the right box (website grades go
from 1 to 99 and items values are from A to F). I will not depict
every small detail about the java.net blog evaluation, I strongly
recommend you to download and use YSlow by yourself before trying to
understand that information. I suggest you to apply YSlow against
the popular sites like google.com or against
your current web project.
For those familiar to sites optimization, I would like to talk about a minor and interesting detail
about the expiration header - item #3.
|
Performance Grade of this page: F (59)
- A 1. Make fewer HTTP requests
- F - Use a CDN
- F - Add an Expires header
- F - Gzip components
- B - Put CSS at the top
- A - Move scripts to the bottom
- A - Avoid CSS expressions
- n/a - Make JS and CSS external
- C - Reduce DNS lookups
- A - Minify JS
- A - Avoid redirects
- A - Remove duplicate scripts
- F - Configure ETags
|
|
How to setup Expires headers
|
Expires is a Http header that allows you to define
when a resource (image, css, ...) will need to be reloaded. It is a
String representation of a Date in the format EEE, dd MMM yyyy HH:mm:ss z. There is lots of Java code available on the internet to produce the Expires header, the most part is similar to the following code I used during my experiments:
public static void setCacheExpireDate(HttpServletResponse response,
int seconds) {
if (response != null) {
Calendar cal = new GregorianCalendar();
cal.roll(Calendar.SECOND, seconds);
response.setHeader("Cache-Control", "PUBLIC, max-age=" + seconds + ", must-revalidate");
response.setHeader("Expires", htmlExpiresDateFormat().format(cal.getTime()));
}
}
public static DateFormat htmlExpiresDateFormat() {
DateFormat httpDateFormat = new SimpleDateFormat("EEE, dd MMM yyyy HH:mm:ss z", Locale.US);
httpDateFormat.setTimeZone(TimeZone.getTimeZone("GMT"));
return httpDateFormat;
}
With the code, the browser started receiving headers like these:
Last-Modified: Sun, 19 Sep 2004 22:06:49 GMT
Cache-Control: PUBLIC, max-age=57600, must-revalidate
Expires: Thu, 09 Aug 2007 05:22:55 GMT
Content-Type: image/gif
Content-Length: 377
Date: Wed, 08 Aug 2007 13:22:55 GMT
Server: Apache-Coyote/1.1
It was supposed to be a simple configuration step of my website optimization, but - after trying different values for the headers, including Expires header, Cache-Control and Last-Modified - the YSlow was still saying the Expires header was not
present. I got confused and started to navigate on discussions lists and
blogs when I finally figured out the problem: YSlow uses the idea of
a far future.
A far future Expires header
Well, far future seems to be one of that relatives measures,
when for a butterfly it could be 23 hours and for a mountain it could
be one million years. So, I suppose the far notion should be
pre-defined some way. I didn't find and I confess didn't search too
much about the standard values adopted by YSlow, but from my desktop
experiences I found it: The YSlow magic number far future is
172801 seconds = 48 hours + 1 second
That's it, everything more than two days seems to be far enough to YSlow - a minor detail in this complex task of websites tunning. And it is not an official information, just an empirical observation. If you need more precise guidance about YSlow, the Chief Performance Yahoo!, Steve Souders, is launching a book entirely dedicated to website optimization - a promising publishing from a company that serves millions of users every day :) A last and very important advise: don't take decisions based only on YSlow. It is just an indicator, a tool created for Yahoo site optimization that can give you a glimpse about the quality of your web site - a helpful tool that should evolve from now on to become part of the arsenal of tips and tricks for websites tunning.
|
|