我用更新面板所有当我想更新我的页面的特定部分，但最近我遇到的性能问题（我的意思是它在渲染预期放缓的时间控制，有时这是行不通的，需要多点击工作！

I use update panels all the time when i wanna to update specific part of my page but recently i face performance problems ( i mean it 's slow in rendering the intended control and sometimes it doesn't work and need multiple click to work !!

所以我的问题是：

是对页面方法可以被认为是一种有效的替代方案 更新面板，并做 AJAX 神奇？ 有什么其他的办法吗？ Is the page method could be considered as an efficient alternative to the update panel and do the ajax magic ? What are the other alternatives?

请尽可能一个简单的例子来说明如何使用网页方式使用，以取代更新面板？

please if possible a simple example to clarify how to replace the update panel using with page methods ?

推荐答案

我以前和你一样，几年前，我曾经使用的UpdatePanel 来的增益性能，有错误的想法，我增加了我的应用程序的性能 ...

I used to be like you some years ago, I used to use UpdatePanel to gain performance, to have the wrong idea I was increasing the performance of my applications...

嗯，我是完全错误的，的UpdatePanel 是所有UI邪，首先它的皮根的采用Ajax的复杂性，这很容易让大多数人来说，给我们，我们正在创建响应应用程序错误的想法，这是最糟糕的比，如果我们不使用它在所有（这是我用它在我的所有网页的最主要原因，而我我相信这就是为什么许多开发人员使用它的原因......因为这一切很容易）。

Well I was totally wrong, UpdatePanel is the root of all UI-evil, first of all it hides the complexity of using AJAX which makes it easy for most of us, giving us the wrong idea that we are creating responsive applications, which is worst than if we weren't using it at all (that's the main reason I used to use it in all my pages, and I am sure that's the reason why many developers use it... 'cos it's easy).

考虑下面的文章：

为什么你不应该把你的整个网站在一个UpdatePanel

的UpdatePanel是邪恶

当你明白了的UpdatePanel 确实打击到 PageMethod的或REST WCF服务的一个简单的通话，你会看到它们之间的巨大差异。

When you understand what the UpdatePanel really does against a simple call to a PageMethod or a REST WCF Service, you will see the huge difference between them.

的UpdatePanel 。当您执行从后一个的UpdatePanel ，整个页面生命周期已被执行，这意味着，它需要的时候把所有的页面的ViewState上的每个岗位的页长的复杂性与几个控件，ViewState中肯定是巨大的，这将肯定是一个性能问题。使用他们，你只能获得的部分呈现的，你的的UpdatePanel内部的控件不完整的职位将被渲染回来，虽然您需要在全送的ViewState每个请求。

UpdatePanel. When you perform a post from an UpdatePanel, the whole page life-cycle has to be executed, this means, it requires to send all the page ViewState on each post, when your page grows in complexity with several controls, the ViewState will certainly be huge and this will certainly be a performance issue. Using them you only gain partial rendering, the controls inside your UpdatePanel will be rendered without a full post back although you need to send the whole ViewState on each request.

PageMethod的。页面的方法是静态，他们被称为一样，如果他们是一个服务方法，他们并不需要创建整个页面生命周期才能被执行，因此，他们执行得更快。

PageMethod. Page methods are static, they are called like if they were a service method, they do not need to create the whole page life-cycle in order to be executed, therefore, they execute faster.

因此​​，它似乎是使用 PageMethods 将是解决办法，问题是， PageMethods 通常用来返回JSON对象，这意味着，你将不得不使这些对象的手动的。这意味着，如果你想摆脱过所有的的UpdatePanel ，你将不得不改变你的看法使用的控件，您将无法使用的GridView 出的现成的，例如，而是你必须改变它的 jqGrid的（或同类者）。

So it would seem that using PageMethods would be the solution, the problem is that PageMethods are usually used to return JSON objects which means, that you will have to render these objects manually. This means that if you want to get rid-off all your UpdatePanel you will have to change the controls used in your views, you won't be able to use the GridView out-of-the-box for example, instead you would have to change it for the JQGrid (or similars).

这是很自然的，如果你正在创建一个MVC应用程序，但与传统的ASP.Net这并不简单。

This is natural if you are creating a MVC application, but with traditional ASP.Net this is not straightforward.

您还需要考虑一些非常重要的，视图状态默认情况下，每个岗位进行验证，您可以将其关闭，但不建议，如果你要确保你的ViewState还没有被损坏（看看这个问题）。

You also need to consider something very important, the ViewState is validated by default on each post, you can turn it off, but it is not recommended if you want to be sure your ViewState has not been corrupted (take a look at this question).

下面这个例子，你有两个的DropDownList 控件（命名为：ddl1，DDL2）的 DDL2 的依赖的 ddl1 所以使用的SelectedIndexChanged 事件您填写的第二个下拉列表。但是，如果你尝试使用AJAX调用（不带的UpdatePanel ），你将面临两个问题做同样的

Consider this example, you have two DropDownList controls, (named: ddl1, ddl2) ddl2 depends on ddl1 so using the SelectedIndexChanged event you fill the second drop down list. But if you attempt to do the same using AJAX calls (without an UpdatePanel), you will face two problems

渲染，你需要的对象手动添加到HTML 选择控制重presenting的的DropDownList 。你可以使用第三方框架来约束这些控件使用JavaScript，我可以推荐你 knockoutjs （它的真棒）

Rendering, you need to manually add objects to the HTML select control representing the DropDownList. You could use a third party framework to bind these controls using javascript, I can recommend you knockoutjs (it's awesome)

这就是问题所在。当你改变了第二个的DropDownList 使用JavaScript的内容，你不能做一个简单的职位，你的页面，因为ViewState的将无效，然后你会看到以下异常：

This is the problem. After you have changed the content of the second DropDownList using javascript, you cannot do a simple post to your page because the ViewState will not be valid, and you will see the following exception:

无效的回发或回调参数。

Invalid postback or callback argument.

解决方法是指定哪些值将是在服务器端有效，为了做到这一点，你需要重写页面渲染方法，并指定每个一个第二个下拉列表的值，但这样会增加页面的大小，显然，这不是一个很好的选择。

The workaround is to specify which values will be valid in the server side, in order to do that you need to override the page Render method and specify each one of the values of the second drop down list, but this will increase the page size and obviously, this is not a good option

请看下图：

ASP.NET事件验证和无效的回调或者回传参数：第一部分

ASP.NET事件验证和无效的回调或者回传参数：第二部分

因此​​，作为一个总结，如果你想摆脱过所有的的UpdatePanel 控件，您将需要更换现有的服务器控件的JavaScript友好的控制。此外remmeber，如果你这样做，而不是依赖于页面后机制，你将不得不使用AJAX在服务器上执行操作，否则，你将得到的无效的回发或回调参数。的异常。换句话说，它会更好地考虑迁移到一个MVC应用程序如果可能的话。

So as a summary, if you want to get rid-off all your UpdatePanel controls, you will need to replace the existing server controls for javascript-friendly controls. Also remmeber that if you do that, instead of relying on the page post mechanism, you would have to use AJAX to perform operations on the server, otherwise, you will get the Invalid postback or callback argument. exception. In other words it would be better to consider moving to a MVC application if possible.