由于源代码中的视图状态太长,我在网站上遇到了性能问题。在某些页面上,它的大小超过 15-20kb。这增加了浏览器的加载时间。
有什么方法可以部分或完全禁用视图状态而不会对网站的其他模块造成任何损害。仅供参考,这些示例页面上有一个列表视图和一个表单。视图状态很长的地方。
更多示例页面
由于源代码中的视图状态太长,我在网站上遇到了性能问题。在某些页面上,它的大小超过 15-20kb。这增加了浏览器的加载时间。
有什么方法可以部分或完全禁用视图状态而不会对网站的其他模块造成任何损害。仅供参考,这些示例页面上有一个列表视图和一个表单。视图状态很长的地方。
更多示例页面
通常,您可能希望为您的 Page 禁用 ViewState,然后仅为需要/使用它的控件启用 ViewState。
请参阅属性上的此 MSDN 页面Control.ViewStateMode
,它描述了如何设置它:
要禁用页面的视图状态并为页面上的特定控件启用它,请将页面和控件的 EnableViewState 属性设置为 true,将页面的 ViewStateMode 属性设置为 Disabled,并将控件的 ViewStateMode 属性设置为启用。
您将需要进行一些测试以查看哪些控件需要/在您的特定应用程序中使用 ViewState。但是,基本上,
这样做肯定会减少 ViewState 对您的页面施加的负载。
好吧,我不能独自离开:
Firebug 说下面的代码阻止了网站渲染大约 6 秒。我认为它是 jsapi(基于来自 chrome 工具的信息),但以下返回了“502 Bad Gateway”消息,这意味着它坐在那里旋转它的轮子无法处理,同时阻止你的网页显示。
我会将<script ..
调用移至它所属的标题。然后我将google.load
and移动google.setOnLoadCallback
到网页的底部,以便它最后运行。
最后我会弄清楚为什么它不能正常工作。
为您准备的作业:将 Firebug 加载到 firefox 中并学习如何使用它的网络工具来查看站点加载问题所在。
<div class="sr_bx1 FL clearfix">
<div class="FL searchbg">
<div id='cse' style='width: 100%;'>Loading</div>
<script src='http://www.google.com/jsapi' type='text/javascript'></script>
<script type='text/javascript'>
google.load('search', '1', { language: 'en', style: google.loader.themes.V2_DEFAULT });
google.setOnLoadCallback(function () {
var customSearchOptions = {};
var orderByOptions = {};
orderByOptions['keys'] = [{ label: 'Relevance', key: '' }, { label: 'Date', key: 'date'}];
customSearchOptions['enableOrderBy'] = true;
customSearchOptions['orderByOptions'] = orderByOptions;
var imageSearchOptions = {};
imageSearchOptions['layout'] = 'google.search.ImageSearch.LAYOUT_POPUP';
customSearchOptions['enableImageSearch'] = true;
customSearchOptions['overlayResults'] = true;
var customSearchControl = new google.search.CustomSearchControl('010882286766777081969:xkox132izzk', customSearchOptions);
customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
var options = new google.search.DrawOptions();
options.setAutoComplete(true);
customSearchControl.draw('cse', options);
}, true);
</script>
</div>
使用页面适配器类,可以解决这个问题。我发现以下解决方案对 ASP.NET Web 应用程序很有帮助:
视图状态序列化由 PageStatePersister 类型的对象处理。(PageStatePersister 类是一个抽象类,它定义了将视图状态序列化到某些持久性介质的基本功能。)
步骤:
1)在您的 Web 应用程序中,添加文件夹:App_Browsers
2)在此文件夹中,添加新的 BrowserFile:ViewStateAdapter.browser
3)在其中编写以下代码:
<browsers>
<browser refID="Default">
<controlAdapters>
<adapter controlType="System.Web.UI.Page" adapterType="ServerSideViewStateAdapter" />
</controlAdapters>
</browser>
</browsers>
4)在您的 WebApplication 中,添加文件夹:App_Code
5)在此文件夹中,添加新的 ClassFile:ServerSideViewStateAdapter.cs
6)在其中编写以下代码:
using System;
using System.Web.UI;
using System.Web.UI.Adapters;
public class ServerSideViewStateAdapter : PageAdapter
{
public override System.Web.UI.PageStatePersister GetStatePersister()
{
return new SessionPageStatePersister(this.Page);
}
}
你可以参考这个视频,它可以帮助你: