如何最小化ASP.NET页面的重量？

I rely heavily on nested Master Pages in my web portal, this causes ASP.NET to generate huge ID tags for controls it creates, for example: "ctl00_ctl00_MainBody_ctl00_lblDescription"

我在Web门户中严重依赖嵌套的Master Pages,这会导致ASP.NET为它创建的控件生成巨大的ID标签,例如:“ctl00_ctl00_MainBody_ctl00_lblDescription”

for a lblDescription Label i've created.

为我创建的lblDescription标签。

Is there any way to reduce this clutter?

有没有办法减少这种混乱?

Any other techniques(sorry for being general) to reduce page weight other than removing the viewstate?

除了删除视图状态之外的任何其他技术(对于通用而言)是减少页面重量的吗?

12 个解决方案

#1

Look at Yslow and do what it tells you (I would start here)

看看Yslow并做它告诉你的事情(我会从这里开始)

Turn off viewstate

关闭viewstate

Use jsmin to reduce the size of your JavaScript files

使用jsmin减小JavaScript文件的大小

Reduce the size of your CSS ^{(dead link)}

减小CSS的大小(死链接)

Compress your response with standard gzip/deflate compression

使用标准gzip / deflate压缩压缩您的响应

Using ASP.NET MVC will give you smaller IDs

使用ASP.NET MVC将为您提供更小的ID

#2

Whenever possible use HTML Controls. HTML Controls. They are lighter since don't have server-side objects unless you specify the runat="server" attribute.

尽可能使用HTML控件。 HTML控件。除非您指定runat =“server”属性,否则它们更轻,因为没有服务器端对象。

#3

I don't know how to remove the client id bloat but some general tips for making your pages smaller would be:

我不知道如何删除客户端ID膨胀,但一些使您的页面更小的一般提示将是:

Minify and combine any .js/ .css into one file.

将任何.js / .css缩小并组合到一个文件中。

include css at the top of the page and js at the bottom (not really going to make it smaller but UI will load faster)

包括页面顶部的css和底部的js(实际上不会让它变小但UI会加载得更快)

#4

Enable IIS static/dynamic compression

启用IIS静态/动态压缩

Use caching for controls and pages

对控件和页面使用缓存

Ajax content loading - it's helps when you want to see main content faster than content with less priority

Ajax内容加载 - 当您希望比优先级较低的内容更快地查看主要内容时,它会有所帮助

#5

Terrapin has some great suggestions, but they are pretty idealistic. If you are looking for more applicable solutions to your current situation, check out control adapters.

Terrapin有一些很棒的建议,但它们非常理想化。如果您正在寻找适合当前情况的更适用的解决方案,请查看控制适配器。

The CSS Friendly adapters will do a lot of work for you to convert your ASP.NET controls from large ugly, long id named tables into more concise divs, with shorter names.

CSS Friendly适配器将为您做很多工作,将您的ASP.NET控件从大型丑陋的长id命名表转换为更简洁的div,名称更短。

I have used them in a past and they can really make a huge difference. Other than that, turn the viewstate off on any control that doesn't need it. Conform to proper CSS/HTML and it will make another significant difference.

我过去曾经使用它们,它们确实可以产生巨大的变化。除此之外,在任何不需要它的控件上关闭视图状态。符合正确的CSS / HTML,它将产生另一个显着的差异。

Best of luck!

祝你好运!

#6

To minimize the weight of your ASP.NET pages, you can also override the PageStatePersister property (of the Page class) with SessionPageStatePersister. See example here. That way, the Viewstate will be kept in the Session object on the server side, thus reducing the size of the html page on the client side.

为了最小化ASP.NET页面的权重,您还可以使用SessionPageStatePersister覆盖PageStatePersister属性(Page类的)。见这里的例子。这样,Viewstate将保存在服务器端的Session对象中,从而减少客户端html页面的大小。

#7

Especially inside repeaters, ListViews and GridViews, name your controls something short.

特别是在转发器,ListViews和GridViews中,将控件命名为简短。

This should be obvious by the Context (A list of Products)

这应该是上下文(产品列表)显而易见的

If you have only one HyperLink inside a repeater, call it hl. You don't need to call these controls HyperLinkProduct.

如果转发器中只有一个HyperLink,请将其命名为hl。您不需要调用这些控件HyperLinkProduct。

<asp:Repeater id="rptProducts" runat="server">
    <ItemTemplate>
       <asp:HyperLink id="hl" runat="server" NavigateUrl='<%# Eval("URL") %>'>
            <%# Eval("Name") %>
       </asp:HyperLink>
       <asp:Image id="img" runat="server" ImageUrl='<%# Eval("ImageUrl") %>' />
    </ItemTemplate>
</asp:Repeater>

This will render something like:

这将呈现如下内容:

<a id="ctl00_rptProducts_ctrl0_hl" href="/products.aspx?id=5">
  Product Name
</a>
<img id="ctl00_rptProducts_ctrl0_img" src="images/5.png"/>

Multiply those ID names by a 100, and your IDs start to take up a lot more space if you use long descriptive names. Inside Repeaters, short IDs should be clear enough, if your Repeater is well-named.

将这些ID名称乘以100,如果使用长描述性名称,则ID会开始占用更多空间。在Repeater中,如果您的Repeater名称很好,那么短ID应该足够清晰。

#8

Using CSS Sprites can speed up your page by reducing the number of requests. Here are a few articles I found.

使用CSS Sprites可以通过减少请求数来加速您的页面。这是我发现的一些文章。

#9

In your case of using a label, make sure that you really need to use the label (which generates the text in a <span> tag. You could use a Literal instead.

在使用标签的情况下,请确保您确实需要使用标签(在标签中生成文本。您可以使用Literal代替。

Set EnableViewState="False" on controls that don't need it (or on the entire page/website)

在不需要它的控件上(或在整个页面/网站上)设置EnableViewState =“False”

If you're trying change the obscure ids generated by ASP.NET, there's not much you can do there.

如果您正在尝试更改ASP.NET生成的模糊ID,那么您可以在那里做很多事情。

#10

Use html/css to style your pages, avoid tables for layout, when creating a label specify the id, shorter it is, the better.

使用html / css设置页面样式,避免表格布局,创建标签时指定id,越短越好。

#11

Turning off the viewstate, as you mention, is good. Also I have noticed that the ASP.NET tree control generates a very large amount of HTML (if you have a fair number of nodes). I ended up writing my own tree control that generates 1/4 the HTML of the standard tree control. So you could look for controls like that, that are especially bad, and write your own control.

如你所说,关闭视图状态是好的。另外我注意到ASP.NET树控件生成了大量的HTML(如果你有相当数量的节点)。我最终编写了自己的树控件,生成了标准树控件的1/4 HTML。所以你可以寻找那样的控件,这些控件特别糟糕,并且可以编写自己的控件。

#12

I guess if you were desperate to do this without retooling your pages (and none of the other sensible ideas worked ;) ), you could do this:

我想如果你在没有重新组装你的页面的情况下绝望地这样做(并且没有其他合理的想法奏效;)),你可以这样做:

Write an http module that parses and extracts the ids with shorter, recognizable unique ids on the fly as the page is sent to the client, and store them in an application scope hash table. Then, on the return trip perform the reverse step for the incoming data.

编写一个http模块,当页面发送到客户端时,它会动态地解析和提取具有更短,可识别的唯一ID的ID,并将它们存储在应用程序范围哈希表中。然后,在返回行程中,对输入数据执行相反的步骤。

At least, that's what I'd try. I'm not sure how nicely it would play with certain html and/or javascript constructs, but I think it could be done. I suspect it would be a pain in the butt to do, especially if the shorter unique ids happened to conflict with any legitmate non-id values.

至少,这就是我要尝试的。我不确定它会对某些html和/或javascript结构有多好,但我认为它可以完成。我怀疑这样做会很痛苦,特别是如果较短的唯一ID碰巧与任何合法的非id值冲突。

EDIT: Just remembered. You'd need to handle the ViewState too... (that would need to be decoded, fixed and re-encoded. Seems like a lot of trouble :) But then again, if you're going to go to that trouble, you can compress the viewstate a lot better by overriding the load/save viewstate methods... I cut some huge pages (200K of html) down to about 30K using that method a couple of years back. In fact, using custom compression on the ViewState can often be enough to reduce a page size hugely.

编辑:记得。你也需要处理ViewState ...(需要解码,修复和重新编码。看起来好像很麻烦:)但话又说回来,如果你要去那个麻烦,你通过覆盖加载/保存视图状态方法可以更好地压缩视图状态...几年前我使用该方法将一些大页面(200K的html)减少到大约30K。事实上,在ViewState上使用自定义压缩通常足以大大减少页面大小。

#1

Look at Yslow and do what it tells you (I would start here)