使用预取技术优化网站

预取的概念相当简单。我们通常能知道在浏览器运行之前可能需要的资源。预取技术包括将可能需要的页面或资源信息传达给浏览器以便其提前下载,或者在浏览器调用之前将资源下载到浏览器缓存里,这样请求和下载对象这些系统开销可以优先得到处理或以一个无阻碍的方式完成。

  预取内容有很多方法,这里有三个简单的选择。

  DNS预解析

  DNS是实现人类可读的域名(mysite.com)到计算机可读的IP(123.123.123.123)的映射的协议。DNS解析非常快,每次都在100毫秒内,它必须在任何请求发送到服务器之前进行,这就会引起一个对页面整体加载时间有实际影响的级联反应。我们都知道其他一些域名在随后的页面或者用户会话需要加载资源,例如静态内容的二级域名(images.mydomain.com)或第三方内容的域名。有一些浏览器支持使用meta标签来识别需要被解析的域名,这样一来浏览器可以提前解析它们。通过使用下列的标签做到这一点是十分简单的。

  
   <!– IE9+ –>

  添加这一标签使得浏览器可以提前解析DNS,而不是等到资源请求之后才开始解析。对网站上游客可能会访问的其他页面进行DNS预取可能是最有价值的一项技术。Chrome、Firefox以及9.0以上版本的IE浏览器都支持这一特性。

  尽管减少几百毫秒看起来微不足道,但汇总起来之后就是一个值得注意的收益。这也是一个安全的优化方法并且易于实现。我很好奇这种技术的使用率,于是我访问了Alexa网站上排名前十万的网站。事实表明只有552个网站(0.55%)目前正在使用DNS预解析技术。这只是成功的一小步,还有更多的网站需利用这种技术。

  资源预取

  现在,图像占据了很多主流网站总字节数的一大部分。通常,发出请求和下载图像这两个系统开销对性能有显著的影响。不过许多情况下,网站开发人员都知道在什么情况下图像需要不被浏览器过早地检测到,例如通过ajax请求或其他用户在页面操作而加载的图像。资源预取是提前将图像、脚本、样式表或其他资源加载进浏览器。这经常用来处理图像,但也可以处理其他可放在浏览器缓存的资源。

  我在这里所提到的三种技术目前为止都是最经典和最常用的。可惜我不能给出一个具体的使用数,因为通过我在访问Alexa时检测到有太多方法可以实现。然而,许多网站没有正确利用这种技术,甚至只预加载一些会引起巨大的用户体验差异的图像。

  页面预取/预渲染

  页面预取和资源预取十分相似,除了我们实际上让新页面提前自行加载这一点之外。Firefox是第一个使用此技术的浏览器。通过使用下列的标签,你可以提示浏览器预取某个页面(或个别资源)。

  

  在预渲染的情况下,浏览器不仅下载页面还下载页面所需的资源。它也开始在内存里渲染页面(用户不可见),如此一来当页面请求发出时,浏览器就能将页面瞬时呈现给用户。Chrome是首个采用这种技术的浏览器。通过使用下列的标签,你可以提示浏览器预渲染某个页面。

  

  目前为止,与另外两种技术相比,这一技术目是风险最高并最饱受争议的。只有在十分确定用户接下来将浏览哪一个页面的情况下才能进行预渲染。谷歌在这方面是最有名的例子,在有十足把握的情况下它将会预渲染第一个结果页。在我所访问Alexa排名前十万的网站中,我仅发现有95个这样做的网站。尽管这一技术显然不是针对每一个用例,但我认为更多的网站应充分利用这种技术以便改善用户体验。

  缺点

  通常情况下,预取往往是一个有争议的话题。很多人认为预取不仅效率低下,还导致了带宽的浪费。它还使用了不必要的客户端资源(特别是在移动设备上)。另外值得一提的是,在某些情况下,由于没有明显的方式去辨别是用户访问页面(并浏览它)还是浏览器在用户不知情的情况下预渲染的,预取或预渲染页面会对分析和日志跟踪造成不良影响。

  结论

  不管所有这些警告,预取可以算得上是一个巨大的胜利。我们永远不必追求最快,但通过将更多的数据储存在缓存里这一技术,我们能更接近这一目标。通过在用户操作之前发起这些巨量的请求,即使是用最慢的网络访问最慢的网站,我们也能大大提高它的感知性能。如果你尚未确定这样做,在你的网站使用这些技术是值得一试的。结果会有所不同,请确保使用真实的用户测量(如Torbit这一网站)找出你的网站还有多少改善预取的空间。

最新内容请见作者的GitHub页:http://qaseven.github.io/

时间: 2024-10-26 23:11:58

使用预取技术优化网站的相关文章

ASP.NET性能的优化:网站优化需要考虑的方面

导读:作者燕洋天写了一系列关于ASP.NET的文章.我有段时间没有写ASP.NET的东西了,心里总是觉得缺少了什么,毕竟自己对ASP.NET还是情有独钟的.在本系列文章中,准备比较全面的讲述ASP.NET的性能的优化,从前台到后台,以后本列文也看作为大家的一个手册来查询!以下是文章内容: 网站优化需要考虑的方面 在用ASP.NET开发网站的时候,性能是永远需要考虑和关注的问题,性能不仅仅只是程序代码执行时候的速度,而是涉及到方方面面的东西. 就拿ASP.NET的一个请求来讲,从浏览器向服务器的A

优化网站的20条重要体会

优化 1. 尽量不要把整个页面都用Flash或者图片来实现, 这样SE无法找到页面的有用信息 7. 给所有<mg>加上alt属性, 这个一个好的习惯, 尤其是指向一个连接的图片一定要加上要连接网址的关键信息, SE会对有连接指向的图片的ALT属性进行识别, 但对无连接的图片不作处理. 8. <h1> 9. 尽量不要用mouseovers, 最好在css里用hover来实现 10. 尽量不要套用多层次的<table>, SE一般最多只能读取3个<table>的

Minify优化网站:合并多个CSS或者js文件

文章简介:用Minify优化网站性能 合并多个CSS或者js文件. Minify 是用PHP5开发的应用,通过遵循一些Yahoo的优化规则来提高网站的性能.它会合并多个CSS或者JavaScript文件,移除一些不必要的空格和注释,进行gzip压缩,并且会设置浏览器的缓存头.Minify 在设计上和Yahoo的 Combo Handler Service非常像,不过Minify可以合并任何你想要合并的JavaScript和CSS文件. 一般情况下,网站速度的瓶颈都在前端,而最关键的就是资源的加载

A5营销:浅谈企业站长胡乱优化网站所造成的降权或K站的原因

如今,中小型企业网站被降权已经见怪不怪的现象了,几乎每天都可以看到一些企业网站被百度惩罚,当面对这些时会有很多企业站长在埋怨百度,为什么我所优化的企业网站是按照正规手段优化的,却还要把我的企业网站给降权.当然,越是有这样的现象发生越是有人埋怨百度,可以说这是一个很正常的现象.现象大家也应该知道,目前中小型企业都在通过企业网站在互联网上传递信息.产品.服务等,因为企业知道网站可以在互联网上与更多的潜在客户联系,所以企业也把网站看的非常重要.可是很多企业的站长胡乱优化网站,导致网站被降权被K站,这是

大连网站优化分享优化网站省时省力的好方法

1.在对大连网站优化时,要去发布外链,这时就需要我们去寻找外链.那么怎么才能找到高质量的外链资源呢?目前做网站优化的网络公司非常的多,有很多的网络公司对自家网站的优化做的都很不错,我们可以去看看其他优秀的网站的外链是在什么网站上做的,大家可以在百度搜索框中输入domain:域名,这样下面显示的外链资源我们就可以去收集下了.这些外链资源都是百度收录进缓存中,权重也是很高的,所以我们可以利用这些高权重的外链资源去发布外链了,省时又省力. 2.其实软文也是可以为网站带来很多流量的,大家可以把自己写的软

SEO技巧分析:如何优化网站结构

优化网站结构有两方面的意思,一是物理结构,二是逻辑结构. 网站物理结构指的是网站真实的目录及文件所存储的位置所决定的结构. 一般来说比较好的物理结构可以有两种,一是扁平式的,也就是所有网页都存在网站根目录下.像这样: http://www.domain.com/pageA.html http://www.domain.com/pageB.html http://www.domain.com/pageC.html --. 所有这些页都是在根目录这一级别,形成一个扁平的物理结构. 这比较适合于小型的

优化网站服务器里的那些小秘密

应该很奇怪为什么藤设计拿这个来说事,一般情况下做网站不就是将发发外链.写原创软文.关键词配比.长尾关键词等问题吗?网站优化还和服务器有关系? 是的,服务器其实也是一个优化网站的最大杀手也是最大帮手,现今万网与阿里云合并导致更多空间商压力剧增那么我们幻想下,现在服务器那么透明的情况下到底到家买的是服务还是技术?因为我们做为北京网站设计工作室,更多时候也常常和服务器打交道,客服为了避开备案我们会给与配国外服务器或一些业内隐蔽性网站服务器.因为与我们合作的很多客户都属于中小型企业,对网站的需求起初是朦

网站导航的分析:优化网站导航的设计

--让用户更容易地找到需要的信息3 之前已经介绍过为了让用户更容易地找到需要的信息,可以对网站的信息架构和站内搜索进行分析和优化,而另一个能对用户起到很好引导作用的就是网站的导航功能,所以这篇文章主要分析用户对网站导航功能的使用情况,并在此基础上合理地优化网站的导航设计. 网站导航的作用 网站导航的最终目的就是帮助用户找到他们需要的信息,如果说得详细点,那么可以概括为下面3个用处: 1. 引导用户完成网站各内容页面间的跳转.这个是最常见的,全局导航.局部导航和辅助导航等都是为了引导用户浏览相关的

如何优化网站标签让其更有价值

网站标签对于一个网站非常重要,当网站页面被搜索引擎收录时.网站metal标签和descriptions标签都会被显示在搜索结果页上,引起用户有欲望点击进入.但是网站标签不能随便写写就了事,是需要有一定的技巧,通过我个人的经验,今天和大家分享如何优化网站标签. (1)网页标题里包含关键词 网页标题出现在网站顶端,是网站关键词优化中最重要的一部分.搜索引擎看到的网站内容的第一部分就是网页标题.搜索引擎收录后,网站标题就会显示在搜索引擎结果页面上.因此网页标题中包含关键词能让搜索引擎和搜索用户对于网站