在过去十年中,Web 技术已经取得了种种进展。从基本的 HTML 开始,网页发展出更丰富的外观和感觉,变得更加直观,对用户更加友好并且越来越大放异彩。这些变化的关键贡献来自于一些新的和翻新技术,且借力于最新的硬件发展和更好的网络连接支持。但性能,自始至终都是 Web 应用关注的领域。

  近年来,Java 库,CSS 库和插件的火爆使得每个页面都可能包含大量 Java、CSS、图片或者其他资源文件。许多场景下,一个页面会向服务器发起超过50条 http 请求,而且每条请求会与服务器创建一个新的 TCP 连接,检索文件,然后关闭这个连接。这意味着与服务器建立了超过50个 TCP 连接。创建和处理每一个连接都是一个代价沉重的过程,除此之外,很多浏览器会限制并发连接的数量,通常限制个数在4至8个不等。

  在过去15年中,HTTP 协议本身并没有太大的改变。 现在采用的 HTTP 1.1 早在1997年就定义了,而自那时以来,网络已经发生了翻天覆地的变化。IETF(互联网工程任务组)意识到这些新的挑战,并已经为此与 POC 协同工作了一段时间。现在,他们提出了 HTTP 协议的一个新版本——HTTP/2,该协议目前正处于标准化进程中。

  HTTP/2 是什么?

  HTTP/2 是 HTTP 协议的第二个主要版本,该版本关注于减少延迟时间,从而提高页面加载速度。它基于谷歌的 SPDY 协议,包括以下主要项目:

  在单一的 TCP 连接中并行加载多个请求在 HTTP headers 部分启用压缩允许服务器将内容推送到客户端与早期版本有何不同?

  最初的 HTTP 版本为每一个请求使用一个新的 TCP 连接,这涉及建立连接和数据包传输,是非常耗时的过程。HTTP1.1 中完成了很多改变,流水线被引入,理论上允许在单一的连接中发送多个请求,但请求和响应需要同步处理。 HTTP/2 是基于 SPDY 协议的,打开一个 TCP 连接并重复使用,这使得许多请求得以并行发送,而无需等待响应。让我们来形象地查看该过程:

  

  除此之外,它也支持压缩 HTTP headers 和服务器推送(如前所述)。在下面的例子中,我们将看到它如何影响网页加载。

  在 ASP.NET4.6 中使用 HTTP/2

  一个典型的 Web 页面中会引用许多不同的资源,如 Java 文件,CSS 文件,图像等。在下面的例子中,笔者使用 Visual Studio 2015创建了一个 ASP.NET 4.6 空 Web 表单应用示例,并在其中引用了网页中常见的一些资源。然后,笔者为该应用添加了一个 Web 表单和多种资源,请参照下列代码:

  <head runat="server"> <title>HTTP2 Demo using ASP.NET Web forms 4.6</title> <!-- CSS resources --> <link href="Content/bootstrap.css" rel="stylesheet" /> <link href="Content/bootstrap.min.css" rel="stylesheet" /> <link href="Content/Site.css" rel="stylesheet" /> </head> <body> <form id="form1" runat="server"> <div> <!-- Image resources--> <img src="Content/images/img1.jpg" /> <img src="Content/images/img2.jpg" /> <!-- For demo, there are eight images added, but removed here for brevity--> </div> <!-- Java file resources --> < src="s/jquery-1.10.2.js"></> < src="s/jquery-1.10.2.min.js"></> <!-- For demo, total six file added, but removed here for brevity--> </form> </body> </html>

  上面的页面引用了19个不同的资源(3 个 CSS 文件,8个图像文件,8个 JS 文件)以模拟现实中的页面。之后,笔者在安装了 IIS10 的 Win Server 2016(Windows 10 也可以)上部署该应用。现在是时候来测试应用程序了。

  测试结果

  首先,笔者将使用 HTTP1.1 运行此应用,并分析其加载时间。然后,笔者移动到 HTTP2 以了解两种协议的差异。运行该应用,查看开发者工具栏中的网络选项(大多数浏览器都提供开发者工具栏,敲击 F12 即可启用)。这一项将显示网页发送的请求数,其等待时间,开始时间,加载时间及其他相关细节。

  

  通过仔细查看上图中的细节,会发现它使用的是 HTTP1.1 协议,在第三列(协议)中标明。此外,它如预期一般加载了所有的 Java,CSS 和图像文件,但它们的开始时间有所不同。很明显,之前的一些请求完成之后,之后的请求才会立即启动。由于浏览器并行连接数的限制,最后一次请求必须等待大约4.5秒。这个页面的总加载时间约为9.59秒。

  现在,转换到 HTTP2 协议,打开同一个网页,看看有什么差异。为此,将地址栏中的 URL 从 HTTP 改为 HTTPS 并重新加载页面,再次查看开发者工具栏中的网络选项:

  

  在这里,时间线看起来完全不同,所有请求都在同一时间开始。另外,页面的加载时间减少了80%,也就是2秒左右。这清楚地表明,在 http1.1 中同步传送的请求在此处都是并发地传送到服务器的。最后一个请求的等待时间仅为70毫秒。

  最近,我们使用了 bundling 、minifiction 之类的技术提高应用性能,但这些技术也有一些限制(例如,只适用于 Java 和 CSS 文件)。每种类型的文件,必须在不同的包中添加,即使是将所有同类型文件放在同一个包文件里也是不推荐的。应该根据应用的各个网页创建用途不同的包。 HTTP2 将开发者从这些复杂的功能中解救出来,并解决了这些问题,因为它只创建一个 TCP 连接,并在同一时间开始下载所有不同资源,从而节省了很多时间,减轻开发者的负担。

  注:目前,HTTP2 只支持 SSL。因此,一开始用 http 打开网页时,使用的是 HTTP1.1协议,然后使用 https 打开同一个页面时,采用的是 HTTP2(在上图中显示为 h2)协议。

  结论:

  在这篇文章中,我们讨论了当下的 Web 开发实践和所面临的性能问题。之后的讨论基于 HTTP2,并发现它可以在 Visual Studio 2015中用于 IIS10(Windows10 和 Windows Server2016)和 ASP.NET4.6 中。然后,我们创建了包含多种资源(包括 JS,CSS 和图像)的示例页面,并发现使用 HTTP 2可以节省超过75%的加载时间——这最终表明,目前遭遇的性能问题,很快就会成为历史!

  OneAPM 助您轻松锁定 .NET 应用性能瓶颈,通过强大的 Trace 记录逐层分析,直至锁定行级问题代码。以用户角度展示系统响应速度,以地域和浏览器维度统计用户使用情况。想阅读更多技术文章,请访问 OneAPM 官方博客

  原文地址:http://www.infragistics.com/community/blogs/brijmishra/archive/2015/12/01/leveraging-http-2-with-asp-net-4-6-and-iis10.aspx

如何在 ASP.NET 4.6 与 IIS10 中运用 HTTP/2 ?的更多相关文章

  1. 如何在ASP.NET的web.config配置文件中添加MIME类型

    常常有一些特殊的MIME类型是IIS中没有的,一般来说要我们自己手动添加.如果网站经常更换服务器或者网站代码是提供给多个用户使用,那么会造成网站中用到的特殊的MIME类型要经常性的在IIS上配置.这里 ...

  2. 如何在ASP.NET 5和XUnit.NET中进行LocalDB集成测试

    今天继续昨天的话题--单元测试,不过是在ASP.NET 5中的单元测试. 在当前的Visual Studio 2015 CTP6中,MSTest是不支持对ASP.NET 5项目进行单元测试的.因而,要 ...

  3. HTML控件ID和NAME属性的区别,以及如何在asp.net页面的.CS文件中获得.ASPX页面中HTML控件的值

    在html中:name指的是用户名称,ID指的是用户注册是系统自动分配给用户的一个序列号. name是用来提交数据的,提供给表单用,可以重复: id则针对文档操作时候用,不能重复.如:document ...

  4. 如何在ASP.NET Core Web API测试中使用Postman

    使用Postman进行手动测试 如果您是开发人员,测试人员或管理人员,则在构建和使用应用程序时,有时了解各种API方法可能是一个挑战. 使用带有.NET Core的Postman为您的Web API生 ...

  5. [转发]如何在ASP.NET的web.config配置文件中添加MIME类型

    常常有一些特殊的MIME类型是IIS中没有的,一般来说要我们自己手动添加.如果网站经常更换服务器或者网站代码是提供给多个用户使用,那么会造成网站中用到的特殊的MIME类型要经常性的在IIS上配置.这里 ...

  6. 如何在ASP.Net创建各种3D图表

    我们都知道,图表在ASP.NET技术中是一种特别受欢迎而又很重要的工具.图表是表示数据的图形,一般含有X和Y两个坐标轴.我们可以用折线,柱状,块状来表示数据.通过图表控件,我们即能表示数据又能比较各种 ...

  7. 如何在ASP.NET Web站点中统一页面布局[Creating a Consistent Layout in ASP.NET Web Pages(Razor) Sites]

    如何在ASP.NET Web站点中统一页面布局[Creating a Consistent Layout in ASP.NET Web Pages(Razor) Sites] 一.布局页面介绍[Abo ...

  8. 如何在ASP.NET Core中实现CORS跨域

    注:下载本文的完整代码示例请访问 > How to enable CORS(Cross-origin resource sharing) in ASP.NET Core 如何在ASP.NET C ...

  9. 如何在ASP.NET Core中实现一个基础的身份认证

    注:本文提到的代码示例下载地址> How to achieve a basic authorization in ASP.NET Core 如何在ASP.NET Core中实现一个基础的身份认证 ...

随机推荐

  1. iOS开发之微信聊天页面实现

    在上篇博客(iOS开发之微信聊天工具栏的封装)中对微信聊天页面下方的工具栏进行了封装,本篇博客中就使用之前封装的工具栏来进行聊天页面的编写.在聊天页面中主要用到了TableView的知识,还有如何在俩 ...

  2. Openfire/XMPP学习之——Openfire的安装、配置

    一.Openfire下载: 官方下载:http://www.igniterealtime.org/downloads/index.jsp 在官方下载站点,可以获取Windows.Linux.Mac三种 ...

  3. mysql相关文章

    win7系统下如何配置php-Apache-mysql环境 Mac 可设置环境变量的位置.查看和添加PATH环境变量 Mac如何删除MySQL,Mac下MySQL卸载方法 mac+apache+php ...

  4. spring源码分析之定时任务Scheduled注解

    1. @Scheduled 可以将一个方法标识为可定时执行的.但必须指明cron(),fixedDelay(),或者fixedRate()属性. 注解的方法必须是无输入参数并返回空类型void的. @ ...

  5. 【解决】查询无法完成,因为其包含的查找列数已超过管理员强制实施的查找列阈值。Error code=0x80070093; Error source=Groove

    前因: 修改了SharePoint Server 2013 下面的文档库的名称,原先2个汉字,现在8个汉字.结果,SkyDrive Pro 就无法同步了,无论是停止重新同步还是手动填写进行同步都不可以 ...

  6. 前端项目构建之yeoman

    各位好啊,我又和大家见面了,也许你已经不记得大明湖畔的容嬷嬷,但是只要记得博客园中的我就好,希望我的博客能像一股清风,为你驱散炎热的酷暑,好了,废话不多说,开始上干货,我今天带给大家的是前端工程化开发 ...

  7. C#文件相同性判断

    在进行开发时,对文件进行上传和下载是较为普遍的行为,为了防止在文件操作过程中,出现同一文件多次操作,需要对文件进行相同性比较: 1.获取文件的绝对路径,针对window程序和web程序都可使用: // ...

  8. Xamarin.Android之布局文件智能提示问题

    一.前言 看到有人问关于xamarin.android的布局没智能提示问题(VS 2015),当然,写布局这东西没提示这是一件相对痛苦的事 ,所以这里就提供一个解决的方案! 二.解决方案 想要智能提示 ...

  9. EF Fluent API上

     什么是Fluent API? 官方答案:EF 中内嵌的约定将 POCO 类映射到表.但是,有时您无法或不想遵守这些约定,需要将实体映射到约定指示外的其他对象,所以Fluent API和注解都是一种方 ...

  10. C# 发送Http请求 - WebClient类

    WebClient位于System.Net命名空间下,通过这个类可以方便的创建Http请求并获取返回内容. 一.用法1 - DownloadData string uri = "http:/ ...