WEB优化Favicon请求

shinepaopao

浏览: 145280 次

最近访客更多访客>>

dong717

BobWaters

lxheyu

blue4wang

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

浏览器 firebug web access

关于Favicon

总是被命名为favicon.ico
默认存放在网站web根目录。我们常常看到这样的一个请求/favicon.ico
它总是显示在浏览器地址栏,网址的左边
当访问一个页面的时候，不管怎么样，浏览器都会请求这个文件，即/favicon.ico
可以通过在页面的<head>部分加入<link>元素来重新指定它的位置
<link rel=”shortcut icon” href=http://www.cctv.com/favicon.ico />
ico格式可以是不同分辨率的图像，比如16×16, 32×32等。

上图从客户端和服务端监测，可以知道每次访问页面的时候，都会访问/favicon.ico，不管该文件存不存在（一些工具像httpwatch、firebug不会将/favicon.ico请求罗列出来）。如果/favicon.ico文件不存在，则响应404错误。图-1和图-2比较而言，图-1(404响应)反倒花费的时间更少，这是图-2需要传输favicon.ico文件，http 200响应比http 404响应更大。通常在这种情况，我们应该减少对/favicon.ico请求来达到整体优化效果。

优化Favicon

确定文件/favicon.ico存在，不应该返回404错误。404错误意味着，每次访问浏览器都会重新请求一次/favicon.ico。我们应该减少这样的请求，将/favicon.ico缓存在客户端。减少不必要的http请求是web前端优化的一条重要准则

设置Expires头，将/favicon.ico缓存在客户端。比如，Apache可以通过mod_expires增加这样的设置。缓存时间可以是一个月，甚至可以是一年。

    <IfModule mod_expires.c>
      ExpiresActive On
      ExpiresByType image/ico "access plus 1 year"
      ExpiresByType image/icon "access plus 1 year"
    </IfModule>