web性能优化

转载 2018年04月16日 21:13:20

Web性能优化分为服务器端和浏览器端两个方面。

一、浏览器端,关于浏览器端优化,分很多个方面
1、压缩源码和图片
JavaScript文件源代码可以采用混淆压缩的方式,CSS文件源代码进行普通压缩,JPG图片可以根据具体质量来压缩为50%到70%,PNG可以使用一些开源压缩软件来压缩,比如24色变成8色、去掉一些PNG格式信息等。

2、选择合适的图片格式
如果图片颜色数较多就使用JPG格式,如果图片颜色数较少就使用PNG格式,如果能够通过服务器端判断浏览器支持WebP,那么就使用WebP格式和SVG格式。

3、合并静态资源
包括CSS、JavaScript和小图片,减少HTTP请求。有很大一部分用户访问会因为这一条而取得最大受益

4、开启服务器端的Gzip压缩
这对文本资源非常有效,对图片资源则没那么大的压缩比率。

5、使用CDN
或者一些公开库使用第三方提供的静态资源地址(比如jQuery、normalize.css)。一方面增加并发下载量,另一方面能够和其他网站共享缓存。

6、延长静态资源缓存时间
这样,频繁访问网站的访客就能够更快地访问。不过,这里要通过修改文件名的方式,确保在资源更新的时候,用户会拉取到最新的内容。

7、把CSS放在页面头部,把JavaScript放在页面底部
这样就不会阻塞页面渲染,让页面出现长时间的空白。

web性能优化指南

web 网站性能优化攻略 转自:http://coolshell.cn/articles/7490.html 关于性能优化这是一个比较大的话题,在《由12306.cn谈谈网站性能技术》中我从业...
  • zhanlurbh
  • zhanlurbh
  • 2015-01-24 17:45:06
  • 952

Web性能优化的十个技巧

好像现在一提到性能,大多数人都会想到负载均衡,分布式,CDN和缓存等等,很少把前端优化作为很重要的一部分来做,其实前端优化如果做得好的话,性能提高百分之几十是完全有可能的,特别是大访问量的web应用。...
  • jinhuiyu
  • jinhuiyu
  • 2009-01-27 07:13:00
  • 17102

web性能优化最佳实践

  • 2016年04月21日 10:10
  • 4.08MB
  • 下载

web性能优化(服务器优化).doc

  • 2013年05月09日 16:29
  • 33KB
  • 下载

常见的web性能优化方法

前端是庞大的,包括 HTML、 CSS、 Javascript、Image 、Flash等等各种各样的资源。前端优化是复杂的,针对方方面面的资源都有不同的方式。那么,前端优化的目的是什么 ?   1....
  • daimomo000
  • daimomo000
  • 2017-06-07 10:54:05
  • 2548

Web性能优化方法

如何提高web性能? 1、减少HTTP请求 一般来说要减少http请求通常从两个方面下手:减少图片的请求、减少脚本文件与样式表的请求 图片的减少通常有两种方式:css sprites、内联图片、...
  • u013372487
  • u013372487
  • 2015-12-17 11:31:03
  • 2518

webWeb性能优化方案

第一章 打开网站慢现状分析 在公司访问部署在IDC机房的VIP网站时会感觉很慢。是什么原因造成的?为了缩短页面的响应时间,改进我们的用户体验,我们需要知道用户的时间花在等待什么东西上。      ...
  • screensky
  • screensky
  • 2012-08-08 23:32:11
  • 617

Web性能优化:延迟加载JS

Google推荐的代码: function downloadJSAtOnload() { var element = document.createElement("script"); ele...
  • fs821031547
  • fs821031547
  • 2015-10-24 17:20:42
  • 198

Web性能优化

我们先来看一个瀑布图来确定一个页面性能问题是由哪些项造成的。 chorome自带开发人员工具      图中每一行表示一个http请求, 每一个请求都有一条时间线,用于标识这个请求所花费的时间。如...
  • han_yankun2009
  • han_yankun2009
  • 2015-06-29 18:02:03
  • 1405
收藏助手
不良信息举报
您举报文章:web性能优化
举报原因:
原因补充:

(最多只允许输入30个字)