As this seriesArticleIn the last article, let's take a look at the xstate mechanism that fineui is proud of. Currently, xstate has completely replaced the native viewstate in the fineui control, thus avoiding repeated data transmission, reduces network traffic. At the same time, it should be noted that ASP. net uses the viewstate mechanism to save control data during the sending-back process. As to why xstate should be used to replace viewstate, and the benefits brought by it are the focus of this article.
The role of viewstate in ASP. NET controls
Viewstate is ASP. net is a very important feature used to maintain the server status of the Control During page sending back, so that we can easily write the following in the button-clicking event handler function:Code:
1:Label1.text = textbox1.text;
For details about viewstate, refer to this classic article. I believe many people have read this article. It is summarized as follows:
In traditional website development, viewstate works exactly the same way and greatly simplifiesProgramWorkload.
However, with the rise of Ajax, especially in the client interface rendered by JavaScript, viewstate implementation is a little stretched.
Viewstate in earlier versions of fineui
Early versions of fineui use viewstate to save the control status (versions earlier than v2.3.1). For example, the following typical fineui page:
All the page content is rendered by the JavaScript code generated by the server.
Open pageSource code, You will find that in addition to several lines of HTML code between <body> and </body>, most of the JavaScript code generated on the server side:
The following describes how to use the viewstate mechanism in this example:
1. First page loading
Because the content of the rich text box on the page is set in the background through the C # code, this attribute will appear in the _ viewstate field and the content of this field in the HTML source code will be decoded, you can see the following content:
It can be seen that the viewstate string of the page contains the content of the rich text box (as shown in the tree structure in the upper right corner ).
At the same time, because the entire page is rendered by JavaScript, this attribute will also be passed to the Javascript script on the page:
As a result, when the page is opened for the first time, two copies of the same duplicate data exist (both in viewstate and JavaScript code generation ).
2. Click "Get HTML editor content ".
This operation will copy the content of the rich text box above to the textarea below. The page and C # Source Code are as follows:
Let's take a look at the Ajax response data. Because we need to update the textarea data, there are also two pieces of JavaScript and viewstate data:
This once again results in a waste of data transmission. In a page that uses a large number of server controls, this waste is sometimes amazing.
In the new fineui version, viewstate is discarded and the self-implemented xstate mechanism is used instead.
Does giving up viewstate in a new client framework that advocates simplicity mean giving up the convenience of using C # To operate server controls in page sending?
Obviously, this is impossible!
The only way is to implement the viewstate mechanism suitable for Ajax data transmission. fineui is one step ahead in this respect and creates a new xstate concept, in this way, the convenience of C # operations on server controls in page sending is not abandoned, and the waste of data transmission in any form is denied.
Note: viewstate is not disabled when fineui is discarded. The ASP. Net Control still depends on the viewstate mechanism.
In the same example, we can see how the new fineui (later than v2.3.1) implements xstate:
1. First page loading
The data in the rich text box only exists in JavaScript code. Because viewstate is not used, _ viewstate only stores the controlState attribute:
2. Click "Get HTML editor content ".
At this time, the Ajax response data is not duplicated:
Compare the data transmission volume of fineui controls using viewstate and xstate
In the above example, we compare the data transmission volume from the first loading and re-sending pages of the page:
Response Data (using viewstate) response data (using xstate)
Load 5068 for the first time4922
Click 1251 on the first button.709
Survive with innovation!
Summary
This article focuses on the disadvantages of viewstate in the fineui control, and introduces a new xstate mechanism. The comparison between the two shows that the xstate mechanism can effectively reduce the data transmission volume in the first page loading and subsequent page sending back, thus improving the page loading speed.
So far, this series of articles are all over, but the pace of fineui development will continue, and strive to build the best open-source ASP. NET control library in China!
Note: The articles in the "fineui Secret Garden" series were originally published on sanshenshi, And the blog garden was first launched. Please indicate the source for reprinting. Document Catalog official forum
======================
According to previous rules: http://fineui.com/donate/
You can download fineui secret garden in PDF.
《Extaspnet "pdf .part1.rar
《Extaspnet "pdf .part2.rar
《Extaspnet "pdf .part3.rar
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
