提拔网站页面速率的14条最好实践(二)

本篇是对《高机能网站建立指南》一书的后7种划定规矩举行梳理。

八、运用外部Jacascript和css

1.假如须要显现给用户的页面能够完成完整缓存,那末运用外部Jacascript和css会进步网站机能。
2.在运用运用外部Jacascript和css时,能够设置页面加载完成后下载,如许可保证页面也首屏效果。

九、削减DNS查询

1.Internet是经由过程IP地点来查找服务器的。因为IP地点很难影象,一般运用包括主机名的URL来庖代它,然则浏览器发送请求时,IP地点依然是必需的。这就是Domain Name System(DNS)所处的角色,DNS将主机名映射到IP地点上。当你输入一个网址时,链接到服务器的DNS解析器会返回服务器的IP地点。
2.DNS开支:一般浏览器查找的一个给定的主机名的IP地点要花费20-120毫秒,在完成查找之前,浏览器不能从主机那边下载任何的东西。
3.运用Keep-Alive和较少的域名来削减DNS查询

十、精简JavaScript

精简是从代码中移除没必要要的字符,比方空白符(空格、换行、制表符)等以削减文件大小,进而改良加载时候。

十一、防止重定向

1.重定向用于将用户从一个url从新路由到另一个url。重定向有很多种:301和302是罕见的两种
2.当Web服务器向浏览器返回一个重定向时,相应中就会具有一个范围在3xx的状况码(注重:”304 Not Modeified”并非真的重定向-他是用来相应GET请求,防止下载已存在于浏览器缓存中的数据。)。
3.重定向的毁伤:在重定向终了而且HTML文档下载完成之前,没有任何东西显现给用户。

十二、移除反复剧本

反复性剧本毁伤机能的体式格局有两种:没必要要的HTTP要乞降实行JavsScript所糟蹋的时候。

十三、设置或移除ETag

1.Etag是什么?
实体标签(Entity Tag ETag)是Web服务器和浏览器用于确认缓存组件的有用性的一种机制。
2.浏览器的缓存与确认?
步骤一:Expires头:浏览器在下载组件时,会将它存储到缓存中。再次请求改组件时,会确认改组件是不是逾期来决议是不是从新请求改组件,而这个逾期时候是由Expires头的值来决议。当请求一个组件时,服务器会根据其选项在相应中返回一个Expires头。
步骤二:前提GET请求:假如缓存的组件逾期了(或许用户明确地从新记载了页面),浏览器在重用它之前必需起首搜检它是不是依然有用,这称作前提GET请求。假如组件有用,原始服务器会返回一个”304 Not Modified”状况码。

服务器在检测缓存的组件是不是有用时有两种体式格局:
1.比较最新修正日期
2.比较实体标签

2.1 最新修正时候:

 原始服务器经由过程Last-Modified相应头来返回组件的最新修正时候,它请求服务器端和客户端时候完整一致的状况下才有意义。

2.1 实体标签:

 ETag供应了另一种体式格局,用于检测浏览器缓存中的组件与原始服务器上的组件是不是婚配。ETag在HTTP1.1中援用。ETag是唯一标识了一个组件的一个特定版本的字符串。唯一的花样束缚是该字符串必需用引号引起来。原始服务器运用ETag来相应指定组件的Etag。
 Etag为考证实体供应了比修正最新日期更加天真的机制,比方,假如实体根据User-Agent或许Accept-Language头而转变,实体的状况能够反应在ETag中。今后,假如浏览器必需考证一个组件,它会运用If-None-Match头将ETag传回原始服务器。假如ETag是婚配的,就会返回304状况吗。
 
 

3.ETag带来的题目
ETag的题目在于,一般运用的组件的某些属性来组织它,这些属性关于特定的,寄宿了网站的服务器来讲是唯一的。当浏览器从一台服务器获取了原始组件,以后,又向别的一台差别的服务器提议前提GET请求时,ETag是不会婚配的——关于运用服务器集群来处置惩罚请求的网站来讲,这是很罕见的一种状况。默许状况下,关于具有多台的服务器网站,APache和IIS中嵌入的数据都邑大大地下降有用性考证的成功率。

3.1 Apache1.3和2.X的ETag花样是inode-size-timestamp,纵然文件体系的一切信息都是一致的,然则差别服务器上的inode依然是差别的。

3.2 IIS5.0和6.0在ETag上有着相似的题目。IIS上ETag的花样是Fletimestamp:ChangNumber。ChangNumber适用于跟踪IIS设置变化的计数器。关于网站背地的服务器来讲,ChangNumber不大雷同。
3.3 末了效果,关于完整雷同的组件,从一台服务器到另一台Apache和 IIS发生的ETag是差别的,假如你运用了服务器集群,运用ETag会形成组件没必要要的反复加载并影响服务器的机能、增添宽带的开支。

4.ETag用照样没必要?
假如你运用的是服务器集群,且运用默许的ETag设置,你的用户将面临迟缓的页面,你的服务器会有很高的负载,你会斲丧大批的带宽,而且代办也不能有用地缓存你的内容。

为了运用ETag的天真性的考证才能而又要消弭其所带来的题目,有一种挑选是对ETag举行自定的设置。比方能够运用一段根据浏览器是不是为Internet Explorer而变化的剧本。假如运用PHP来天生剧本,你能够经由过程设置ETag头来反应浏览器的状况。
假如你的组件必需经由过程最新修正日期以外的一些东西来举行考证,则自定义ETag是一种壮大的要领。假如你不能自定义ETag,发起你移除ETag。

十四、运用Ajax可缓存

公所周知,主动的Ajax请求时异步的,用户能够依然须要守候相应。不过用户没必要忍耐全部页面的从新加载了,而且用户在守候时,UI依然能够相应。
因为Ajax毕竟是一个请求,一切为更好的用户体验,我们仍需连系上面其他的机能优化条例来运用,比方缓存等。

    原文作者:alisa
    原文地址: https://segmentfault.com/a/1190000019235155
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞