1、减少http请求数量。
单独得一个图片,js,css都是一个请求,将同类合并可以有效得减少请求个数。
2、使用CDN(内容分发网络)
需要新增服务器减少请求得站点个数(靠钱解决需要买服务器)。
3、添加Expire/Cache-Control头
Expire 头的内容是一个 时间值,值就是资源在本地的过期时间、存在本地。
在本地缓存阶段,找到一个对应的资源值,当前时间还没超过资源的过期时间,就直接使用这一个资源,不会发送http请求。
4、启用Gzip压缩
文件压缩后变小,提升文件的传输速度。
5、将css放在页面顶部 head标签中加载。
为了提高浏览器的渲染性能,
避免出现空白页面或散错的问题。
6、将script 放在页面最下面。
会先将页面内容呈现出来,避免了script报错页面空白等 问题,不会让用户等太久。
7、避免在css中使用Expressions(表达式)
Css 表达式存在会导致频繁计算,严重影响性能及用户体验。
8、将 javascript 和css 都放到外部文件中
写在页面内的情况 :
a、当样式或控制只应用一个页面时,写在页面内的好处大于提取出来。
b、不经常被访问的
c、脚本和样式很少
9、减少DNS查询
查询需要时间,在查询时间内浏览器就什么都干不了。如果有很多的查找过程对打开浏览器有很大的性能影响,所以需要对这个过程进行缓存,缓存之后就能减少这种查找过程。目前浏览器都自带有缓存功能,被缓存后浏览器会直接从缓存里面查找,节省时间。
通过配置多个域名存放不同的资源,但不是越多越好。
利用多个域名来存储网站资源优点:
1、CDN缓存更方便。(用户就近获取资源)。
2、突破浏览器并发限制。
同一时间针对同一域名下的请求有一定数量限制,超过限制数目的请求会被阻塞。大多数浏览器的 并发数量控制在6以内。有些资源的请求时间很长,因而会阻塞其他资源的请求,因此,对于一些静态资源,如果放到不同的域名下面就能实现与其他资源的并发请求。
a.节约cookie带宽
b.节约主域名的连接数,优化页面相应速度
c.防止不必要的安全问题。
3、缺点:
过多的域名会使DNS解析负担加重,因此一般控制在2-4个。
10、最小化javascript 和css
减小文件体积,
a、去除不必要的空白符,格式符,注释符。
b、简写方法名、参数名压缩js脚本。
c、在正式上线项目前,将javascript和css都进行压缩,使线上版本是最轻量级的,大幅提升网站性能。
11、避免重定向 ,找到了告知被转移再次请求,增加了浏览器的 往返次数。
永久重定向(301)和临时重定向(302),这对浏览器来说差异不大,都需要再次请求新地址,从而降低网站加载速度。
但是,搜索引擎会定时爬网络,遇到301会智能地只收录新地址,但是遇到302我们还是得从旧地址跳到新地址。
12、移除重复的脚本。
重复引用的脚本会重复执行,导致逻辑错误并延长页面加载时间。。
13、配置实体标签(ETag)
实体标签ETag,即是Entity Tag,需要服务器端配置。若用户请求时,浏览器和服务器的ETag一致,则说明资源未修改(304),则可以直接使用本地缓存的资源,减少传输资源带来的网页加载延迟。
不同服务器(IIS、Apache、Nginx)配置ETag的方式不一样。
14、使用ajax缓存
最后,推荐网站性能优化工具Yslow插件使用。
需要配合Firefox浏览器,同时依赖Firebug 插件,对自己写的网站进行具体地性能分析,生成性能优化报告。