Tip: Shrink Your sIFR

Filed under “Software” and “Web Design & Development
by Adam at 2:01 PM

Permalink :: Make a Comment

Important Update: Since this tip was posted, Microsoft has released a required patch for Internet Explorer that forces web users to “click to activate” Active-X objects such as Flash. This was done to comply with the ridiculous patent infringement suit from Eolas Technologies, and it will cause your sIFR text to display confusing behavior if you’ve compressed the JavaScript with Packer.

The reason this happens: Packer uses JavaScript’s eval() function to parse the complex regular expression that represents your condensed script, then execute the un-packed script code. Something about the use of eval() causes the patched Internet Explorer to display the “click to activate” message, which has the effect of making your sIFRed text look like a link.

Whether this represents a bug in the Eolas patch or not is still up in the air until word comes down from Microsoft. The eval() function is used for more than just Packer, however, so I hope this will be fixed soon. Meanwhile, don’t follow the advice given below.

You can keep up with this issue, and others involving sIFR, in the sIFR forum or by following the sIFR category of Mark Wubben’s weblog.

Although the JavaScript source code for the sIFR font replacement technique is already stripped-down and compacted by its creator, it still adds a hefty 9 KB download to the first page on your site that a visitor sees (after that, it’s cached). While 9 KB is nothing to those of us lucky enough to have a broadband Internet connection, for the 45% of Americans still on dial-up modems every kilobyte counts. Dean Edwards’s JavaScript packer can help make sIFR a lighter load for your dial-up visitors.

Packer is simple to use, and produces fully-functional, but completely obfuscated, JavaScript code. The full, uncompacted sIFR source can be found as sifr.js in the folder titled “uncompressed js source (do not use)” from the official sIFR 2.0 RC 4 download.

Run the contents of this file through Packer by pasting it into the bottom textarea and clicking the “Pack” button. Be sure that “Encoding” is set to Normal and that the “Fast Decode” checkbox is ticked.

The 19.3 KB script will shrink down to 7.8 KB, versus the 9 KB of the compacted source that comes with the download. Better still, the latest version of Dean’s packer doesn’t require high ASCII characters, so you probably won’t have to worry about what character set it gets served up in.

Click the “Save” button to save the compressed JavaScript as sifr.js, then upload it to your site in place of the existing sIFR script. Congratulations, you’ve just saved 45% of your audience a little bit of time. :)