优化网站设计(四):对资源启用压缩

news/2024/5/15 8:18:17/文章来源:https://blog.csdn.net/weixin_30491641/article/details/99533197

前言

网站设计的优化是一个很大的话题,有一些通用的原则,也有针对不同开发平台的一些建议。这方面的研究一直没有停止过,我在不同的场合也分享过这样的话题。

作为通用的原则,雅虎的工程师团队曾经给出过35个最佳实践。这个列表请参考

Best Practices for Speeding Up Your Web Site  http://developer.yahoo.com/performance/rules.html

同时,他们还发布了一个相应的测试工具Yslow http://developer.yahoo.com/yslow/

我强烈推荐所有的网站开发人员都应该学习这些最佳实践,并结合自己的实际项目情况进行应用。

接下来的一段时间,我将结合ASP.NET这个开发平台,针对这些原则,通过一个系列文章的形式,做些讲解和演绎,以帮助大家更好地理解这些原则,并且更好地使用他们。

准备工作

为了跟随我进行后续的学习,你需要准备如下的开发环境和工具

  1. Google Chrome 或者firefox ,并且安装 Yslow这个扩展组件.请注意,这个组件是雅虎提供的,但目前没有针对IE的版本。
    1. https://chrome.google.com/webstore/detail/yslow/ninejjcohidippngpapiilnmkgllmakh
      Technorati Tags: Performance,Web design,ASP.NET
    2. https://addons.mozilla.org/en-US/firefox/addon/yslow/
    3. 你应该对这些浏览器的开发人员工具有所了解,你可以通过按下F12键调出这个工具。
  2. Visaul Studio 2010 SP1 或更高版本,推荐使用Visual Studio 2012
    1. http://www.microsoft.com/visualstudio/eng/downloads
  3. 你需要对ASP.NET的开发基本流程和核心技术有相当的了解,本系列文章很难对基础知识做普及。

本文要讨论的话题

这一篇,我们要讨论的是对资源启用压缩的话题。我们知道,不光我们如何减少请求数,或者使用CDN,以及使用缓存,有一个事实是我们无法避免的:内容总是需要从服务器传输到客户端,那怕次数是少一些。那么,如果希望这个传输的过程尽量地快,我们应该会很自然地想到,能否将传输的内容体积减小呢?

要回答这样的一个问题,我们通常就会使用到压缩技术。关于这一条原则的理论和概念,请参考 http://developer.yahoo.com/performance/rules.html#gzip

压缩并不那么简单,其实它包含了一对操作:压缩和解压缩。换句话说,在我们今天讨论的网站优化中使用压缩技术,不仅仅需要考虑服务器端对内容进行压缩,还要考虑客户端(浏览器)对内容进行解压缩。反过来也是如此。所以,这里就会有一个问题,我们必须要使用大多数浏览器都能接受的压缩算法。由于浏览器的多样性,通常是由浏览器在发起请求的时候,显式地表明自己接受那些压缩算法,然后服务器检查这些设置,再确认自己是否能利用这些算法进行压缩(或者解压缩),如果不能,则宁愿不进行压缩,直接返回原始的内容。

所以,在HTTP 1.1中规定,浏览器在发起请求的时候,可以通过下面这个Request Header来表明自己支持的压缩算法(可以有多个)

Accept-Encoding: gzip, deflate
然后,服务器在发送响应的时候,也可以通过下面这个Response Header来表明此次响应是否使用了某种算法(肯定只有一个)
Content-Encoding: gzip
作为程序员,我们知道其实还有很多其他的算法,但是确实从通用层面考虑,使用最多的是Gzip。 其他能与其相提并论的还有deflate,但还是Gzip用的最多。

 

哪些资源适合做压缩

  1. 静态网页(HTML,HTM)
  2. 文本文件(TEXT,XML等)
  3. 脚本文件(JAVASCRIPT)
  4. 样式文件(CSS)

 

哪些资源不适合做压缩

  1. 图片(JPG,GIF,PNG)
  2. 特殊组件(FLASH, XAP)

 

如何做压缩

要实现压缩功能并不难,现代的一些Web 服务器都内置支持这个特性。针对微软的IIS 7.0或者更高版本的话,可以通过参考下面的文章进行配置

Configuring HTTP Compression in IIS 7

http://technet.microsoft.com/en-us/library/cc771003(v=WS.10).aspx
我来对其做一些总结和演示

IIS 7.0内置支持Gzip压缩,这个可以通过在安装IIS的时候进行选择

正确安装之后,在管理工具中,就可以看到这样一项功能

image

 

IIS 7.0 支持两种方式的压缩:静态压缩和动态压缩。所谓静态压缩,就是对相对较大的内容,IIS 7.0会将它们压缩成一个新文件,并且缓存在磁盘上(可以通过下面这个界面配置多大的文件要进行静态压缩,并且放在哪个目录中),而动态压缩就是对于某些提交小的内容,直接在运行时进行动态压缩,不在磁盘上进行缓存(这种做法会带来CPU的一些额外的负担)

image

这个缓存的目录中会自动为每个应用程序池(Application Pool)创建一个子目录,以便保存那些静态压缩的文件

image

那么这种压缩到底能有多少收益呢?我们可以看看下面这个截图

image

上图中看到,在我的一个测试网站中,它对两个JAVASCRIPT文件做了压缩,压缩之后的尺寸分别为33KB和51KB,而这两个文件的原始文件大小其实是92KB和197KB,我们可以由此看出来,压缩比高达65%和74%。这是相当可观的一个收益,而你要做的仅仅是启用压缩即可。

image

 

实际上这个文件已经被压缩成下面这样了(不再是纯文本的脚本了)
不可否认的是,压缩和解压缩肯定会对CPU带来一些额外的负担的,但通常情况下,这个代价是很小的,尤其是与收益比较起来的话。
等等!我们好像漏了一个很重要的话题:上面的界面中,我们知道如何启用压缩,但却没有看到
  1. 如何设置哪些文件应该如何压缩(无论静态还是动态)。
  2. 到底是采用什么算法压缩

 

这个细节被隐藏在下面的配置文件中

C:\windows\system32\inetsrv\config\applicationHost.config
打开这个文件,搜索一下httpCompression,你可以找到如下的配置信息,当然,你可以在这个基础上做一些修改,前提是你先看懂它们。实际上不难,对吧
Technorati Tags: 性能优化,performance,ASP.NET,web design

转载于:https://www.cnblogs.com/chenxizhang/archive/2013/05/01/3052881.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_789452.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

JiaSale 购物按钮 WordPress 插件:让你博客瞬间变成电商网站

什么是 JiaSale 长期关注我爱水煮鱼的读者可能知道我还有一个专门销售 WordPress 插件和主题的站点:WPJAM 应用商城,通过支付宝购买,成功之后就可以直接附件了,全程无需人工介入,我只在后面收钱即可, 。 …

规划以主机命名的网站集 (Windows SharePoint Services)

摘自MSDN:http://technet.microsoft.com/zh-cn/library/cc288637.aspx Windows SharePoint Services 3.0 既支持以主机命名的网站集,也支持基于路径的网站集。以主机命名的网站集提供可缩放的宿主解决方案,其中每个网站集都有不同的主机名。这…

android 清华镜像,清华镜像网站下载android源码并编译

8种机械键盘轴体对比本人程序员,要买一个写代码的键盘,请问红轴和茶轴怎么选?下载android源码方法:我的系统是ubuntu 18.04,主要参考了blog通过清华大学镜像下载Android源码并编译源码,通过国内镜像网站下载…

利用WINXP IIS服务自建ASP网站的步骤

利用WINXP IIS服务自建ASP网站的步骤 1. 安装搭建IIS服务环境(在可能需要下载IIS安装包),控制面板,利用“添加/删除程序”的“添加/删除Windows组件”功能,安装“Internet信息服务”组件(如Internet信息服务管理单元、公用文件、万…

干货分享!12款响应式的移动网站模板免费下载

如果你打算开发网站,你想要关注的第一件事就是网站的外观和感觉。另外用户体验很重要,现在是属于移动互联的时代,用户有可能通过移动设备浏览你的网站,因此同样重要的是要考虑你的网站在移动端的使用体验。 这个特殊的列表包含一组…

建站篇——百度地图

关于如何在网页中加入百度地图,其实并没有想象中那么复杂,因为,这是一个开源的时代。下面简单介绍一下如何在网页中加入百度地图。为什么是简单介绍一下呢?因为是真的很简单…… 一、打开地图生成器 这个地址不好找,建…

想学网站运营?我教你啊!(下)

创见干货: 在上一章节,我们讨论了如何对内容进行取舍和把握。其实这还并不是网站运营的真正秘诀。真正想要在未来赢得市场,就必须掌握 A/B 测试。这就是本文最后一个章节,也是最重要的一部分内容。 其中有一些策略是如此的重要&am…

【分享资料 】01 开发者网站

【分享资料 】01 开发者网站百度开发搜索:https://kaifa.baidu.com/home 我们常用的国内搜索网站,考虑到大多数网民的整体素质,所以搜素很低级而且充斥着广告 国外的网站在这方面好很多,但是全英文搜索消耗精力实在太多了 而且效果…

图片浏览器每次只能打开一张图片_资源素材第049期:我做视频常用的图片网站与工具分享!...

大家好,我是热爱后期的老蒋。上周我给大家分享的我平时制作视频用到的图片网站与工具的文章深受大家的喜欢——我做视频常用的音频音效网站与工具分享!所以本周跟大家聊一聊视频制作中可以用到的图片网站与工具。如果觉得好的话,建议点赞&…

小米8ios图标包下载_你想的 ICON 图标,在这些网站都可以找到了

在应用界面中图标的存在,会给用户一个良好第一印象,这个挺重要的。但是从零开始开发图标需要大量的时间和金钱。在你的网站上使用图标可以让你有效地与你的访问者交流:它们增加了可读性,突出了重要的内容,加强了功能或特性&#x…

wordpress上传图片慢_WordPress网站不利于SEO是真的么?如何做好网站SEO

首先这个结论个人觉得是不靠谱的!网上似乎有这种说法,具体不清楚从哪来的。反正wordpress网站高权重的站点还是能一找一大把的。那么wordpress站长如何做好seo呢,简单总结了一下几点1、友情链接并不是不重要了,该做的还是得做各种…

python实现登录抓取_python requests 模拟登陆网站,抓取数据

抓取页面数据的时候,有时候我们需要登陆才可以获取页面资源,那么我们需要登陆以后才可以跳转到对应的资源页面,那么我们需要通过模拟登陆,登陆成功以后再次去抓取对应的数据。 首先我们需要通过手动方式来登陆一下,查看…

网站迁移到新服务器的步骤_新手使用使用阿里云服务器搭建网站的具体操作步骤...

新手使用使用阿里云服务器搭建网站的具体操作步骤阿里云服务器是阿里云的重要支柱产品,阿里云——阿里巴巴集团旗下公司,是全球领先的云计算及人工智能科技公司。提供云服务器、云数据库、云安全、云企业应用等云计算服务,以及大数据、人工智…

ajax收录问题_关于网站进行SEO的7大问题你知道吗?

关于网站进行SEO的7大问题你知道吗?一、什么是seo?seo的作用是什么?SEO(Search Engine Optimization)汉译为搜索引擎优化。是一种利用搜索引擎的规则提高网站的自然排名的方法,可使其在行业内占据领先地位,获得品牌收益…

对石家庄铁道大学网站UI的分析

作为我们团队的PM,老师对我们提出了一些额外的要求,所以我发表这篇博客来谈一下对石家庄铁道大学网站UI的分析。首先,PM 对项目所有功能的把握, 特别是UI。最差的UI, 体现了团队的组织架构;其次, 体现了产品的内部结构&#xff1b…

米的建站日记(2014年12月19日)

今天要做一个pdf在线预览的功能,同事帮我找到了一个FlexPaper的插件, 这位大神有详细的使用教程:http://www.cnblogs.com/qinpeifeng107/archive/2011/08/29/2158879.html 说下我使用过程中遇到的问题,一开始FlexPaperViewer.swf的…

百度网盘链接在线解析网站_最近很热闹啊,免登陆百度网盘高速链接转换工具...

本文由阿刚同学原创,首发在乐软博客(www.isharepc.com)欢迎关注乐软博客微信公众号“阿刚同学”近期百度网盘可谓相当热闹,前些天最新版的客户端新增了利用闲置宽带兑换下载提速,换言之就是将你的空闲上传宽带组建成特有的传输通道&#xff0…

可以发外链的网站_2019年网站SEO优化还有必要发外链吗?

(文/守护袁昆)曾几何时做SEO的朋友信奉内容为王,外链不皇。疯狂的发外链对网站SEO优化效果非常好,后面百度一系列的算法打击外链作弊,如今网站SEO优化还有必要发外链吗?首先要确定一个观点,外链的作用还是挺大的&#…

使用IntelliJ IDEA开发SpringMVC网站(四)用户管理

使用IntelliJ IDEA开发SpringMVC网站(四)用户管理 原文:使用IntelliJ IDEA开发SpringMVC网站(四)用户管理摘要 通过对用户表的管理,更加深入地讲解SpringMVC的操作。 目录[-] 文章已针对IDEA 15做了一定的更新&#xf…

Apache JMeter--网站自动测试与性能测评

出于学习热情,翻译总结Emily H. Halili的《Apache JMeter》一书的部分内容。 JMeter的简介 可以肯定的是,JMeter至少符合以下几条自动测试标准: 零购置成本--直接从http://jakarta.apache.org/site/downloads/downl…