Issue link: https://read.uberflip.com/i/1146286
Revving Filenames | 27 Table 3-2 shows the median Last-Modified delta (the difference between the current date and the Last-Modified date) for all uncached components. In the case of cnn.com the median Last-Modified delta is 227 days. Half of the uncached components had not been modified in over 227 days, so image freshness is not the issue here. This was the case at Yahoo!, as well. In the past, Yahoo! did not make scripts, stylesheets, nor some images cacheable. The logic behind not caching these compo- nents was that the user should request them every time in order to get updates because they changed frequently. However, when we discovered how infrequently the files changed in practice, we realized that making them cacheable resulted in a better user experience. Yahoo! chose to make them cacheable even at the cost of additional development expense, as described in the next section. Revving Filenames If we configure components to be cached by browsers and proxies, how do users get updates when those components change? When an Expires header is present, the cached version is used until the expiration date. The browser doesn't check for any changes until after the expiration date has passed. That's why using the Expires header significantly reduces response times—browsers read the components straight from disk without generating any HTTP traffic. Thus, even if you update the compo- nent on your servers, users who have already been to your site will most likely not get the updated component (since the previous version is in their cache). To ensure users get the latest version of a component, change the component's file- name in all of your HTML pages. Mark Nottingham's web article "Caching Tutorial for Web Authors and Webmasters" says: The most effective solution is to change any links to them; that way, completely new representations will be loaded fresh from the origin server. Depending on how you construct your HTML pages, this practice may be either triv- ial or painful. If you generate your HTML pages dynamically using PHP, Perl, etc., a simple solution is to use variables for all your component filenames. With this approach, updating a filename across all your pages is as simple as changing the vari- able in one location. At Yahoo! we often make this step part of the build process: a version number is embedded in the component's filename (for example, yahoo_2.0. 6.js) and the revved filename is automatically updated in the global mapping. Embedding the version number not only changes the filename, it also makes it easier to find the exact source code files when debugging.