科创学院Web应用开发课件 第十一章 大案例优化.ppt

11 1影响网站性能的因素11 2使用Ajax控件部分刷新11 3网页输出缓存11 4数据缓存 第十一章大案例优化 11 1影响网站性能的因素通过前10章子学习情境的学习 我们完成了网上书店系统大案例的设计 本章将在此基础上对该大案例进行部分优化 也就是通过优化来进一步提高网站的性能 网站性能的优劣是由多种因素造成的 有些不是由设计者决定的 如服务器的性能 与网站关联的数据库的性能 支持网站运行的载体的性能等 但是 虽然如此 我们还是应该力求在设计层面上把影响网站性能的主要因素找出来 然后加以解决 至于非设计层面上的问题 可以采取其它相应的方式来解决 在设计层面上影响网站性能的因素主要有 第十一章大案例优化 11 1影响网站性能的因素网站的响应速度 一个不能及时响应的网站绝对不是性能较好的网站 谁也不愿意等上很长时间来打开的你的网站 这个因素是需要设计者重点考虑的因素 界面设计 界面设计影响网站的美感及网页响应速度 例如 网页的整体框架布局方式 网页图片的格式及大小是否合适等方面 解决方法是聘用优秀的美工人员 如果网站需求方舍得资金支持的话 这个问题不难解决 网站安全 网站安全是影响网络性能的又一个重要因素 不安全的网站会带来严重的后果 不安全网站可能会使你的服务器瘫痪 有可能造成巨大的损失 第十一章大案例优化 11 1影响网站性能的因素本章主要讲解影响网站性能的主要因素 网站的响应速度因素 要改善网站的响应速度主要由以下几种方法 使用AJAX控件部分刷新网页输出缓存数据缓存 第十一章大案例优化 11 2使用AJAX控件部分刷新用Ajax技术 可以创建高度交互的Web应用 增加用户的页面浏览体验 在VS2008中 已经对Ajax框架进行了封装 在不需要重新安装任何组件的情况下 可直接进行ASP NET的Ajax开发 为了使用户在浏览页面时不至于每次回发都看到整个页面重新加载 我们可以使用Ajax实现部分页呈现 即让用户无需因回发而刷新整个页面 而仅仅需更新网页上各个已更改的区域 从而减少了整页刷新的次数 这使得用户能够更加顺畅地与网页进行交互 ASP NET使您能够将部分页呈现添加到新的或现有的ASP NET网页 而无需编写客户端脚本 第十一章大案例优化 11 2使用AJAX控件部分刷新那么如何使用AJAX技术实现网页的局部刷新呢 因为在VS2008中已经对Ajax框架进行了封装 所以我们可以使用VS2008工具箱中的Ajax控件将Ajax功能添加到我们的ASP NET网页中 下面我们首先来认识一下这些控件 第十一章大案例优化 11 2使用AJAX控件部分刷新1 ScriptManager控件该控件管理支持AJAX的ASP NET页的客户端脚本 默认情况下 ScriptManager控件会向页面注册MicrosoftAJAXLibrary的脚本 这将使客户端脚本能够使用ASP NETAJAX类型系统扩展 并支持部分页呈现和Web服务调用这样的功能 第十一章大案例优化 11 2使用AJAX控件部分刷新1 ScriptManager控件ScriptManager控件担当着对该页面中所有的AJAX控件进行管理协调的重任 所以任何一个使用ASP NETAJAX控件的页面中 都必须包含一个ScriptManager控件 第十一章大案例优化 11 2使用AJAX控件部分刷新2 UpdatePanel控件使用UpdatePanel控件 可以刷新页的选定部分 而不是因回发而刷新整个页面 这称为执行 部分页更新 包含一个ScriptManager控件和一个或多个UpdatePanel控件的ASP NET网页可自动参与部分页更新 而不需要自定义客户端脚本 第十一章大案例优化 11 2使用AJAX控件部分刷新2 UpdatePanel控件UpdatePanel控件在网页中需要ScriptManager控件 默认情况下 将启用部分页更新 因为ScriptManager控件的EnablePartialRendering属性默认值为true 第十一章大案例优化 11 2使用AJAX控件部分刷新3Timer控件ASP NETAJAXTimer控件按定义的时间间隔执行回发 如果将Timer控件用于UpdatePanel控件 则可以按定义的时间间隔启用部分页更新 也可以使用Timer控件来发送整个页面 第十一章大案例优化 11 2使用AJAX控件部分刷新3 Timer控件当要执行以下操作时 可使用Timer控件 定期更新一个或多个UpdatePanel控件的内容 而无需刷新整个网页 每当Timer控件导致回发时运行服务器上的代码 按定义的时间间隔将整个网页同步发布到Web服务器上 第十一章大案例优化 11 2使用AJAX控件部分刷新4 UpdateProgress控件UpdateProgress控件提供有关UpdatePanel控件中的部分页更新的状态信息 可以自定义UpdateProgress控件的默认内容和布局 若要在部分页更新的速度非常快时阻止闪烁 可以在显示UpdateProgress控件之前指定延迟 第十一章大案例优化 11 2使用AJAX控件部分刷新4 UpdateProgress控件当网页包含一个或多个用于部分页呈现的UpdatePanel控件时 UpdateProgress控件可帮助您设计更为直观的UI 如果部分页更新速度较慢 则可以使用UpdateProgress控件来提供有关更新状态的可视反馈 可以在页上放置多个UpdateProgress控件 其中每个控件都与不同的UpdatePanel控件相关联 也可以使用一个UpdateProgress控件 并将其与页上的所有UpdatePanel控件关联 第十一章大案例优化 11 2使用AJAX控件部分刷新介绍完Ajax控件后 下面我们使用AJAX技术来对我们的购物车管理页面进行优化 在我们的网上书店系统的 Members 文件夹中包含一个名为 CartInfo aspx 页面 该页面主要功能是提供会员浏览自己的购物车信息 并且还提供了生成订单 用户信息自动填写功能 默认情况下生成订单的部分是隐藏的 如图11 1所示 第十一章大案例优化 11 2使用AJAX控件部分刷新 第十一章大案例优化 图11 1购物车信息 11 2使用AJAX控件部分刷新当用户单击图11 1页面上的 下订单 按钮时 在该页面下面出现订单信息 如图11 2所示 第十一章大案例优化 图11 2显示订单信息 11 2使用AJAX控件部分刷新这时当我们再次单击图11 2中的 下订单 按钮时 填写订单信息部分又重新隐藏起来 当我们反复单击 下订单 按钮时 发现整个 CartInfo aspx 页面每次都刷新闪烁 用户体验不好 下面我们使用AJAX技术实现在每次单击 下订单 按钮时 只有填写订单信息部分刷新 整个页面不刷新 第十一章大案例优化 11 2使用AJAX控件部分刷新例11 1使用AJAX优化 CartInfo aspx 页面 1 切换到 CartInfo aspx 页面的源视图状态 把光标定位到 标记的下一行 2 依次从工具箱中的 AJAXExtensions 选项卡下拖入一个ScriptManager控件和一个UpdatePanel控件 在 和 两个标记之间手动添加一组 标记 需要局部刷新部分的代码要放在改组标记代码之间 如图11 3所示 第十一章大案例优化 11 2使用AJAX控件部分刷新 第十一章大案例优化 图11 3添加Ajax控件 11 2使用AJAX控件部分刷新例11 1使用AJAX优化 CartInfo aspx 页面 3 把图11 3中 标记下面的折叠起来的 部分 为节省篇幅 该部分折叠标记代码即为显示填写订单信息部分的代码 剪贴到 和 标记之间 如图11 4所示 第十一章大案例优化 11 2使用AJAX控件部分刷新 第十一章大案例优化 图11 4更改 填写订单信息 标记代码位置 11 2使用AJAX控件部分刷新经过上述三步后 重新运行该网页 当单击 下订单 按钮时 发现只有填写订单信息部分的局部页面刷新 而整个页面不刷新 增强了用户体验 除了上述使用AJAX技术实现网页局部刷新外 在实际应用中 有时会需要页面在某个时刻进行自动更新 而不需要人为干预 这就需要用到ASP NETAJAX中的Timer控件 本教材大案例的需求没有此功能的要求 设置Timer控件的Interval属性 可以控制刷新的时间间隔 单位是毫秒 第十一章大案例优化 11 2使用AJAX控件部分刷新例11 2使用Timer控件自动局部更新 1 从工具箱中拖一个UpdatePanel控件和一个ScriptManager控件到Default aspx页面上 UpdatePanel控件中包含一个Timer控件 设置其Interval属性为1000 要求在UpdatePanel控件里面和外面分别输出页面的加载时间 根据题目要求 参照课本给出的部分网页源视图代码布置网页源视图 第十一章大案例优化 11 2使用AJAX控件部分刷新该网页运行效果如图11 5所示 第十一章大案例优化 图11 5定时刷新 11 2使用AJAX控件部分刷新从图11 5浏览的效果可以看到 网页上面的时间 背景为灰色的部分 每隔1000毫秒就会被刷新一次 而下面显示的时间则始终是页面加载时的时间 并不会被刷新 这是由于上面显示的时间放在了UpdatePanel控件内 并设置了Timer的Interval为1000毫秒 所以会定时被刷新 而下面显示的时间放在了UpdatePanel控件外 所以不会被定时刷新 若要将AJAX功能添加到ASP NET网页 请标识网页上要更新的各个部分 然后 将这些部分的内容放入UpdatePanel控件 UpdatePanel控件的内容可以是HTML或其他ASP NET控件 向网页中添加UpdatePanel控件的方式与添加任何其他控件相同 例如 可以将该控件从 工具箱 任务窗格拖到网页上 也可以通过在相应网页的 代码 视图中添加该控件的代码来进行添加 第十一章大案例优化 11 2使用AJAX控件部分刷新例如 可以将该控件从 工具箱 任务窗格拖到网页上 也可以通过在相应网页的 代码 视图中添加该控件的代码来进行添加 若要支持部分页呈现 必须将ScriptManager控件放到相应的网页上 ScriptManager控件会跟踪该网页的所有更新面板及其触发器 它会协调服务器上的部分页呈现行为 并确定因异步回发而呈现的网页的各个部分 第十一章大案例优化 11 3网页输出缓存通常 应用程序可以将那些频繁访问的数据 以及那些需要大量处理时间来创建的数据存储在内存中 从而提高性能 例如 如果应用程序使用复杂的逻辑来处理大量数据 然后再将数据作为用户频繁访问的报表返回 避免在用户每次请求数据时重新创建报表可以提高效率 同样 如果应用程序包含一个处理复杂数据但不需要经常更新的页 则在每次请求时服务器都重新创建该页会使工作效率低下 第十一章大案例优化 11 3网页输出缓存在这些情况下 为了帮助您提高应用程序的性能 ASP NET使用两种基本的缓存机制来提供缓存功能 第一种机制是页输出缓存 它保存页处理输出 并在用户再次请求该页时 重用所保存的输出 而不是再次处理该页 第二种机制是应用程序缓存 它允许您缓存所生成的数据 如DataSet或自定义报表业务对象 性能是任何Web应用程序的关键方面 必须减少Web服务器的处理量 以便使单个请求结果响应速度更快 服务器有能力处理更多并发请求并减少中间和后端数据系统的负荷 使用输出缓存以减少服务器的工作负荷 能够实现更佳的ASP NET性能 输出缓存是一种优化方案 可以缩短Web服务器响应的时间 第十一章大案例优化 11 3网页输出缓存通常 浏览器请求ASP NET页时 ASP NET将创建该页的实例 运行该页中的任何代码 运行数据库查询 如果有 动态汇编此页 然后将产生的输出发送到浏览器 输出缓存使ASP NET能够发送该页的预处理副本 而不用为每个请求完成此过程 这个区别降低了Web服务器的处理量 从而提高了性能并获得更大的可伸缩性 第十一章大案例优化 11 3网页输出缓存1 设置页级别缓存打开VS2008开发工具 新建一个网站 命名为 WebSiteOutputCacheDemo 切换到Default aspx页的 设计 视图 从工具箱中将Label控件拖动到页面上 保留默认名称Label1 该Label控件用以显示此页面的创建时间 然后将此页配置为进行缓存 通过显示页的创建时间 可以看到是否从缓存完成了页请求 按F7切换到代码编辑器 添加如下代码 第十一章大案例优化 11 3网页输出缓存1 设置页级别缓存protectedvoidPage Load Objectsender EventArgse Label1 Text DateTime Now ToString 按Ctrl F5运行该页 此页面在浏览器中出现时 将看到当前日期和时间 按浏览器的刷新按钮 可注意到时间戳每次都会改变 第十一章大案例优化 11 3网页输出缓存1 设置页级别缓存关闭浏览器 切换到Default aspx页的 源 视图 将下面的 OutputCache指令添加至该页的顶部 此指令配置页面以进行缓存 Duration属性指定页将在缓存中保留15秒 按Ctrl F5再次运行该页 多次刷新页面 请注意 无论您刷新了多少次浏览器 时间显示仅每15秒更新一次 这是因为建立页面缓存后 将不再执行页面的生命周期 也就不再执行Page Load事件委托函数 直接从缓存中得到响应 直至持续时间过期为止 过期后 页代码再次执行 第十一章大案例优化 11 3网页输出缓存2 设置应用程序级别的页面缓存在前面的例子中 配置了单个页面的缓存 在某些情况下 可能希望为网站中的所有页配置缓存 可能还希望建立不同的缓存规则 配置文件 并将缓存配置文件应用到各组单独页面 设置应用程序级别缓存使您能够从单个配置文件更改缓存行为 而无需编辑各个页面的 OutputCache指令 在下面的过程中 将设置一个简单的缓存配置文件 并将其用于刚刚使用的页面 第十一章大案例优化 11 3网页输出缓存2 设置应用程序级别的页面缓存具体步骤如下 如果已经有一个Web config文件 请转到步骤4 在解决方案资源管理器中 右击网站的名称 然后单击 添加新项 在 添加项 对话框中 单击 Web配置文件 然后单击 添加 请确定使用的名称为Web config 将以下XML添加为system web元素的子项 第十一章大案例优化 11 3网页输出缓存2 设置应用程序级别的页面缓存具体步骤如下 如果已经有一个Web config文件 请转到步骤4 在解决方案资源管理器中 右击网站的名称 然后单击 添加新项 在 添加项 对话框中 单击 Web配置文件 然后单击 添加 请确定使用的名称为Web config 将以下XML添加为system web元素的子项 第十一章大案例优化 11 3网页输出缓存2 设置应用程序级别的页面缓存 第十一章大案例优化 11 3网页输出缓存2 设置应用程序级别的页面缓存保存文件 然后将其关闭 打开或切换到刚才使用的Default aspx页 然后切换到 源 视图 将 OutputCache指令更改为以下内容 按Ctrl F5运行该页 多次刷新页面 这次 日期将在缓存配置文件中指定的持续时间 为60秒 内保持不变 第十一章大案例优化 11 3网页输出缓存3 使用参数进行缓存 OutputCache指令要求您设置VaryByParam属性 在前面两种设置方式下 此属性设置为 none VaryByParam属性使您能够配置缓存 以便ASP NET根据参数 如查询字符串 窗体发布值 请求标头等 存储不同版本的页面 例如 可以在显示所选城市的天气情况的页面中使用缓存参数 天气数据仅每三小时刷新一次 在此情况下 您希望为每个城市缓存页面的单独版本 可以将缓存参数设置为根据查询字符串参数的不同而改变来执行此操作 第十一章大案例优化 11 3网页输出缓存3 使用参数进行缓存在下面的过程中 将更改添加到页的Label控件 以便用彩色背景显示时间 可以使用TextBox控件并输入颜色名称来更改颜色 提交此页时 键入的颜色作为传递数据提交 且Label控件后的颜色改变 请求新颜色时 页包括新的传递数据时 将重新生成此页并更新时间戳 不过 对相同颜色的后续请求将导致返回已缓存的页 直至超过持续间隔时间为止 第十一章大案例优化 11 3网页输出缓存3 使用参数进行缓存下面看一下具体步骤 打开或切换到使用的Default aspx页 切换到 设计 视图 从工具箱的 标准 组中 将TextBox控件拖动到页面上 并将其ID设置为 Color 将Button控件拖动到页面上 保留默认值Button1 将Button控件的Text属性设置为 ChangeColor 双击Button控件以创建Click事件处理程序 在此方法中添加以下代码 第十一章大案例优化 11 3网页输出缓存3 使用参数进行缓存protectedvoidButton1 Click Objectsender System EventArgse Label1 BackColor System Drawing Color FromName Server HtmlEncode Color Text 第十一章大案例优化 11 3网页输出缓存3 使用参数进行缓存将form元素的defaultbutton属性设置为 Button1 这会导致按下Enter键时将引发按钮的Click事件处理程序 用下面的版本替换 OutputCache指令 按Ctrl F5运行该页 第十一章大案例优化 11 3网页输出缓存3 使用参数进行缓存在文本框中键入颜色名称 如 red 或 blue 然后单击 更改颜色 ASP NET缓存使用您指定的颜色的页面版本 多次刷新页面 如果没有键入新的颜色名称 则日期和时间将至少有一分钟不变 在 OutputCache指令的Duration属性中指定 输入新颜色 如 green 或 gold 然后提交页 这次将看到时间和新颜色一起更新 第十一章大案例优化 11 4数据缓存ASP NET还提供了另一种灵活的缓存类型 数据缓存 缓存的真正灵活性和强大功能是通过Cache对象提供的 使用Cache对象 您可以存储任何可序列化的数据对象 基于一个或多个依赖项的组合来控制缓存条目到期的方式 注 要小心使用Cache 因为Cache是占用服务器内存 如果使用不当 也许会降低性能 这些依赖项可以包括自从某对象被缓存后经过的时间 自从某对象上次被访问后经过的时间 对文件或文件夹的更改以及对其他缓存对象的更改 在略作处理后还可以包括对数据库中特定表的更改 第十一章大案例优化 11 4数据缓存你可以将一些耗费时间的条目加入到一个对象缓存集合中 以键值的方式存储 通过Page类的Cache属性可以访问到Cache集合 当用户请求数据时 如果数据已经被缓存 则用户所提取的数据直接从服务端返回 而不是从数据库等底层数据库提取 这对性能的提升很有帮助 第十一章大案例优化 11 4数据缓存1 无过期Cache缓存在Cache中存储数据的最简单的方法就是使用一个键为其赋值 其效果与使用Application保持状态类似 Cache key value 这种做法将在缓存中存储项 同时不带任何依赖项 因此它不会到期 除非缓存引擎为了给其他缓存数据提供空间而将其删除 第十一章大案例优化 11 4数据缓存2 带过期策略的Cache缓存程序员可以指定缓存的过期策略 缓存的过期设置分为绝对过期和可调整过期两种 可调整过期常用于被频繁访问的缓存项 绝对过期和可调整过期不能一起使用 建立指定过期策略的缓存项 可使用Cache对象的Add或Insert方法 这些方法会覆盖已有同键值的缓存项 每个方法都有几个重载 Add和Insert之间的区别是 Add返回对已缓存对象的引用 而Insert没有返回值 第十一章大案例优化 11 4数据缓存2 带过期策略的Cache缓存1 绝对过期缓存Cache Insert DSN connectionString null DateTime Now AddMinutes 1 TimeSpan Zero 以上代码插入了一个键值为 DSN 值为connectionString变量值的绝对过期缓存项 将缓存一分钟 一分钟过后 缓存将到期 其中null表示无依赖项 TimeSpan Zero则具有常数值0 相当于System Web Caching Cache NoSlidingExpiration 即禁用可调整过期 第十一章大案例优化 11 4数据缓存2 带过期策略的Cache缓存2 可调整过期缓存Cache Insert DSN connectionString null System Web Caching Cache NoAbsoluteExpiration TimeSpan FromMinutes 1 以上缓存的数据将一直保留下去 除非数据未被引用的时间达到了一分钟 其中System Web Caching Cache NoAbsoluteExpiration是禁用绝对过期 可见此参数和最后一个参数是 互斥 的数据 第十一章大案例优化 11 4数据缓存3 带依赖项的Cache缓存1 文件依赖项缓存有些情况下 依赖项是一个外部文件 如数据库服务器的位置改变后 连接字符串数据随之变化 网站配置文件会由服务器管理员修改 那么连接字符串的缓