1:尽可能减少hhtp请求。
http请求。在网页上面显示的图片,多媒体,文字都是http请求。
2:使用CDN内容分发网络。
使用cdn可以使用副本,离用户较近的地方。这一个花钱的行当。
3.添加Expire/Cache-Control头
expire头的内容是一个时间值。值就是资源在本地的过期时间。存在本地。
本地缓存阶段,找到一个对应的资源值。当前时间还没有超过资源的过期时间,
就直接使用这个资源。就不会发送http请求。
4。启用gzip压缩。
所有的文本内容,都必须压缩。浏览器的时候,在解析。
html/php/js/css/xml/txt.
5.把css放在页面最上面。
css:Cascading Style Sheets(层叠样式表单)
后面的可以覆盖前面的,级别高的,可以覆盖级别低的。
为了解决一些问题:
在IE下,css放在下面,它禁止了网页内容的顺序显示。IE阻止页面显示,以免从画元素。
在低网速的情况下,页面就是一面白。
在FF中,中会出现闪烁!
为了防止问题,就放到顶部,先加载。
6. script放在页面下面
依照dom的加载顺序。将script放在后面,会先加载html。
7. 避免在css中使用Expressions
css的Expressions是表达式。
css表达式会在页面显示和缩放,页面滚动,鼠标移动的时候,都计算一次。
8. 将js和css,
单独拿出来。
分割的好处,提高了js和css复用性。
减少html的体积,打开快。
js和css可以被单独缓存。提升了复用性。
写在页面内
减少页面请求
提升页面渲染速度。
写在一个页面内的情况
单页面引用,不存在其他页面的引用。
一个不经常被访问的页面,只是偶尔的打开。
脚本和样式很少的情况。就没必要提取出来了。
9 减少DNS查询,缓存!
访问www.a.com
浏览器的缓存时间。
IE中:默认dns缓存时间为30m。
FF:60s
Chrome:60s左右。
缓存时间长,就减少了dns重复查询。
缓存时间短,及时的检测指定网站服务器的变化。保存访问的正确。
单域 —— 将所有都放到一起。
多域 —— 就将img,js。css可以考虑分着存。
10 最小化js和css。
(1)减少了文件的体积,去除不必要的空格,注释,字符。(代码格式化)
(2)通过更改里面变量的名字。来压缩。
11 避免重定向
重定向就是原始请求,被转向到其他请求。页面a,被转向到B了。 通过301,302来标识
301 --- 表示 用户请求的页面,被移动了。【永久重定向】
302 --- 页面被找到了,但是不在原来的位置。然后在从服务器返回的资源上面去访问。【临时重定向】
搜索引擎:发现是301的时候,记录新地址,删除老地址。
302,无论在哪里,都要从A-->B。301让搜索引擎更智能了。
增加了浏览器的往返次数!!!用户需要去访问,多1次,才打开网页,下载资源。
12 移除重复的脚本
重复引用的时候,对全局变量有很大的伤害。可能被重写。
13 ETag
Entity Tag
实体标签,属于http协议,受web服务支持。
使用特殊字符串,标识某个请求的版本。类似于md5一下,然后判断是不是更改了,如果更改了,
证明需要下载新的资源,不更改,就用本地缓存。
14 使用ajax缓存
分配加载,局部缓存。
post每次都执行,不被缓存。
get同一个地址,不重复执行。可以被缓存。
15 使用插件YSlow,进行性能调优,基于ff浏览器的好一些。
基于fireBug。