Web application optimization skills for developers of Flickr

Cal Henderson is one of the developers of the famous Flickr website. in an article titled serving JavaScript fast, he introduced the techniques used to optimize the applications of the Flickr site, which has benefited a lot after reading it. "chew on others' Tips" to summarize the main content of this article.

Flickr is a representative site of Web 2.0. In addition to content Optimization for general web sites, the network problems must be handled flexibly by JavaScript and "> CSSDeployment and distribution complexity after frequent changes.

Set the File Size PolicyOne of the first challenges is to integrate all JavaScript with "> CSSPut it in one file, or split it into multiple files? From the perspective of reducing network requests, the former is better than the latter. But from the perspective of parallelism, "> IEBy default, both Firefox and Firefox can only request two resources from one domain at the same time. this will bring a poor user experience in many cases-you must download all the files before you can see a decent page. flickr adopts a compromise-JavaScript and "> CSSDivided into multiple sub-files. This brings complexity in development, but the performance gains are huge.

Compression OptimizationThere is no doubt that the compression of site content is a common web optimization method, but it may not always achieve the desired effect. The reason is that the mod-gzip module not only consumes the server end "> CPUResources, also consume the client "> CPUResources. In addition, the temporary files created after the mod_gzip file is compressed are put on the disk, which also gives the disk "> IoIt brings about serious problems. flickr uses the mod_deflate module supported by httpd 2.x and later. all compression operations are performed in the memory. mod_deflate is unavailable in httpd 1.x, but you can create a ramDisk to indirectly improve the performance.

Of course, mod_gzip is not useless. It is good for pre-compressed files. in addition, when using compression, you should also pay attention to the policy. there is no need to compress image files (there are a lot of Flickr images, and compression is not good ). only JavaScript and "> CSSThe new version of mod_gzip can automatically process pre-compressed files by configuring the mod_gzip_update_static option. Cal also points out that this feature may cause problems in earlier versions of browsers.

Another major means of compression is content compression. for JavaScript, you can use tips such as reducing comments, combining spaces, and using compact syntaxes (all Google scripts are very hard to read and compact, with similar ideas ). of course, the Javascript processed in this way may contain a lot of parentheses that are not easy to parse. Flickr uses the dojo compressor to build the parsing tree. Dojo compressor has low overhead and is transparent to end users. the JavaScript processing method has been introduced, while CSS processing is relatively simple. A simple regular expression is used to replace multiple spaces with a single space character. A maximum compression ratio of 50% is obtained.

Caching OptimizationDevelopers of Flickr make full use of the etag and last-modified mechanisms defined in the HTTP 1.1 Standard to Improve the caching efficiency. it is worth noting that Cal introduces an e-tag tips for Server Load balancer. you can set Apache to get the e-tag through the file adjustment time and file size. By default, Apache obtains the e-tag through the file node. Of course, this is not perfect, because it will affect if-modified-since.

Flexible Use of mod_rewriteIt is said that the applications on the Flickr website are constructed daily (daily build ). I am afraid this is unimaginable if there is no flexible mechanism. In addition, content modification and synchronization at sites such as Flickr are a headache. Their powerful tool is the flexible use of mod_rewrite. By configuring "> URLRewrite Rules to easily switch to different environments. It sounds simple, but it's easy to do without some Web technical skills ?!

Through the use of these main methods, we can see the high performance of the network.

"> BTW: Because there are no servers in China, the speed of access by users in mainland China should not be mentioned.