beer2beer

We’ve already talked about serving static files in a good way. This post can be read as a follow-up to the Particletree article “Automatically Version Your CSS and JavaScript Files“.

A little excerpt of the article (read it!): When serving static files like .js or .css, the idea is having them cached by the client (a.k.a. browser) for a very long time (let’s say 10 years). But if we modify one of this static files, we need a way for the client to get the new version downloaded again. With that in mind we introduce the “version” of the file in the name, either with mod_rewrite (or similar), either in the querystring as a parameter. Changing the version number will get the browser think is a new file, and get it downloaded again.

But as said, read the Particletree article, is a lot better explained there.

Version

Now the thing is how to determine that version number for each static file. Obviously the idea is not having it done by hand, and that’s why in the Particletree article they use the filemtime() function, to get the last modification timestamp for the file.

Although it’s a first option, personally I don’t like it so much. That would imply a disk access each time an uncached static file is requested, and even we can avoid that disk access saving the timestamps in a include file… Why not use the repository version itself?

The staticVersions.py script

And here’s my humbly contribution. Is a Python script that scans the specified folders for static files (js and css), and returns a PHP array with the name of the files and its version in the Subversion repository, that is, when the last change happened.
[...]

Loading an external javascript file from a bookmarklet is a good way to give superpowers to your favelet, and achieve what we really want, without care about the stupid 512 characters limit Internet Explorer has or without write all the code as an ugly one liner. And not to mention other advantages like server compression (i.e. js chunked and minified, gzip, …), PHP pre-processing and so on, that makes this technique in a very powerful resource when developing bookmarklets.

This post is because I recently discovered that Safari browser is a little picky when using this technique.

For example, what in other browsers (Firefox, Opera and IE) works like a charm, in Safari does not:

Note: Examples are really one liners but presented multiline for better reading.

<a href="javascript:void(
        z = document.body.appendChild(document.createElement('script'));
    );
    void( z.language = 'javascript' );
    void( z.type = 'text/javascript' );
    void( z.src = 'http://blabla.com/test.js' );
    void( z.id = 'testScript' );
">

To make Safari happy we have to polish it a little bit:
[...]

O también “Cómo abrir un Popup con una URL “escapada” en el GET y no morir en el intento”

Escenario de la catástrofe

Imaginad que queréis llamar a un script servidor desde Javascript, y que una de las variables que se le pasa vía GET es una URL. Nada del otro mundo:

<a href="http://server.com/script.php?url=' + varUrl + '">

Lo normal y que a más de uno se le habrá ocurrido ya, es escapar la url para no tener problemas. Escapar no es más que convertir los caracteres conflictivos (“:”,”?”,”&”,”/”…) a sus correspondientes representaciones hexadecimales (más sobre escapar en js). [...]

El gran descubrimiento del fin de semana: minify, una librería PHP para acelerar la descarga de ficheros .js y .css.
[...]