首页 > 设计 > WEB开发 > 正文

web前端优化

2019-11-02 18:22:59
字体:
来源:转载
供稿:网友
前面讲了很多关于缓存清理和编码设置的整合,今天我们说说web性能优化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性能优化另,其他具体详解:1、Web 前端优化最佳实践之 内容篇2、Web 前端优化最佳实践之 Server 篇3、Web 前端优化最佳实践之 Cookie 篇4、Web 前端优化最佳实践之 CSS 篇5、Web 前端优化最佳实践之 JavaScript 篇6、Web 前端优化最佳实践之 图象篇7、Web 前端优化最佳实践之 Mobile(iPhone) 篇如何提高网页效率的14条建议如何提高网页的效率(下篇)——Use YSlow to know why your web Slow二、服务器端优化这里就不详解了,直接看专栏吧Web项目开发性能优化解决方案——服务端
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表