互联网高速发展当今,用户对快速访问网页需求愈来愈高,作为网站建设者,如何提升网站性能,成为煊赫一时的问题,本课程让你清楚影响网站性能的缘由,从而避免不利于网站性能的因素,借助Yslow工具快速找到问题所在,提升网站性能,让提升网站性能、快速访问网站不在是梦想。
yahoo军规
javascript
一共有35条,这次讲解其中的14条。css
http请求的定义:从客户端到服务器端的请求消息。包括消息首航中,对资源的请求方法,资源的标识符及使用的协议。
http请求的菜鸟概论:
当你在网页中看到的文字,图片都是你从服务器获取的,每个内容的获取,都是一个http的请求;每个内容(如文字、图片、js、css)的获取,就是一个http请求;
如何优化请求:文字,图片合并,js合并,css合并;java
CDN:经过在网络放置节点服务器,他是一个智能虚拟网络,会根据数据流量,速度,负载量,访问最近的节点
做用:解决网络拥挤,提升网络相应速度。ajax
expire头的内容是一个时间值,值就是资源在本地的过时时间、存在本地。在本地缓存阶段,找到一个对应的资源值,当前时间还没超过资源的过时时间,就直接使用这一个资源,不会发送 HTTP 请求。
cache-control:是http协议中经常使用的头部之一,顾名思义,他是负责控制页面的缓存机制,若是该头部指示缓存,缓存的内容也会存在本地,操做流程和expire类似,但也有不一样的地方,cache-control有更多的选项,并且也有更多的处理方式。
简单说,就是使用浏览器的缓存功能,将访问数据缓存,在访问一样内容时直接将缓存取出,相对的传输的数据变少,起到提升访问速度的效果。chrome
Gzip支持压缩文本数据,包括:HTML,PHP,JS,CSS,XML,TXT等等。express
GZIP最先由Jean-loup Gailly和Mark Adler建立,用于UNIX系统的文件压缩。后缀为.gz的文件,它们就是GZIP格式的。现今已经成为Internet 上使用很是广泛的一种数据压缩格式,或者说一种文件格式。HTTP协议上的GZIP编码是一种用来改进WEB应用程序性能的技术。大流量的WEB站点经常使用GZIP压缩技术来让用户感觉更快的速度。这通常是指WWW服务器中安装的一个功能,通常对纯文本内容可压缩到原大小的40%.这样传输就快了。浏览器
使用Gzip:缓存
css(层叠样式表):后面的样式会覆盖前面的,级别高的样式会覆盖级别低的样式。
先加载css,放在头部提升渲染性能,避免页面空白或者重绘。
IE:css放body底部,IE禁止了网页内容的顺序显示,低网速状况下致使空白
FF:不阻止显示,但会致使闪烁重绘服务器
浏览器渲染顺序
网络
将script标签放在页面底部
可让页面内容优先呈现出来,而非先暴露script的bug
将Script放在页面的最下面,由于浏览器加载和解释网页的顺序是从左到右从上到下的,若是JavaScript代码有死循环的问题,网页多是空白一片的,若是放在页面的最下面即便如此,页面也能展示出来,固然这个问题最好避免!
避免使用css expression,即CSS表达式
(所谓css expression就是css的属性值是由js计算出来的,用了该属性,鼠标移动,滚动都会对其值进行从新计算),这样会严重影响浏览器效率
由于CSS表达式在页面显示、缩放、滚动或鼠标移动等状况时,都会浏览器进行大量的运算,严重影响浏览器性能,且这并不是是必须的。
JS,CSS都放在外部的文件中,单独提取的好处
1 提升了JS和CSS的复用性;
2 减小了页面的体积;
3 提升了JS和CSS的可维护性
缺点:增长请求数,可经过缓存优化
放在内部的优势
1 减小了页面的请求数;
2 提高了页面的渲染速度
只应用于一个页面时,不常访问时,脚本和样式不多的时候(20行如下时),写在页面里
减小DNS查询:
·底层行为
·定义:访问网址,打开以前,转换机制(ip地址),对应网址;
·时间:20ms最少;
·若是同时不少查找过程,会影响速度;所以须要浏览器的缓存;
·IE30m,ff60s,chrome60s,
缓存长:
减小dns重复查找,节省时间;
缓存短:
及时检测服务器的变化,保证正确性;
多域和单域:
1 去除没必要要的空白符、格式符、注释符。
2 简写方法名、参数名,压缩JS脚本。使用工具压缩 JavaScript 和 CSS
定义:原始请求被从新转到了其余请求
重定向状态码
301:被移动到另外位置(永久重定向)使搜索引擎智能,不须要从旧地址到新地址,删除旧地址,直接到新地址
302:页面被找到,但不在原始位置(临时重定向)先到旧地址,再到新地址
重定向增长浏览器服务器往返次数 尽可能减小Http请求 因此尽可能避免重定向
能够减小文件的大小,另外,就是能够避免出现未知的问题!
使用特殊的字符串 来标识某个请求的资源版本
使用一种标志表示一种资源是否作了修改,能够减小服务器的响应,
详细点就是:浏览器想服务器要某种资源,服务器一看,判断出了这种资源已经给过浏览器了,而且在服务器端的也没有变化,因此浏览器可使用他自身就有的,而后告诉浏览器,浏览器回到自身找找,找到啦就用了,这样浏览器和服务器之间会有对话不过不用服务器再重复的给浏览器资源了!
使AJAX缓存
get :同一地址不重复执行,能够被缓存,不然返回304;
post:每次都执行,不会被缓存,每次都会传送到服务器那里,通常返回200;
YSlow(基于浏览器执行),在firefork下执行的最好
对网站进行分析,给出优化报告