[ASP.NET入门随想十] 珍珠奶茶
                    ——服务器控件模型




    他迷上了珍珠奶茶。说实话,以前他一直觉得珍珠奶茶挺蠢的,真不知道是那一个天才的点子,居然把粉圆和泡沫红茶搅和在一起,还加上一根那么滑稽的超大吸 管;妹妹刚迷上珍珠奶茶的时候,他还挺嗤之以鼻的呢。但这天以后,他几乎天天都会去买一杯珍珠奶茶,愈喝愈觉得珍珠奶茶的风味很特别,的确满好喝的。知道 他迷上珍珠奶茶,妹妹还笑他:“早跟你说好喝你不信,男生就是迟钝。”
—— 管家琪《珍珠奶茶的诱惑》
 
■ 面向对象的粉圆 – 服务器控件模型

    《随想九》 中我们已经认识到,XHTML的一个重要目标就是将结构与表现分离,如:<div id=”author”>老燕</div>;但从一个动态网站的角度来看,需要进一步将网页结构与内容分离,即:<div id=”author”><!—-动态数据--></div>,相比较而言,网页结构是静态,内容是动态。

    博客园中charly的《内容发布系统的开发》 引发我对一段往事的追忆,作者讨论的命题是如何用动态数据生成静态页面,方法是用数据替换模板中指定标签。引申开来就是ASP程序员非常久远的梦想——代 码与页面分离,即避免出现<div id=”author”><%=author%></div>之类HTML代码与ASP程序代码混杂在一块的情况,而解决 之道,用的就是charly描述的方法——正则表达式替换。
 
    如果用静态/动态这个角度去分析一个.aspx文件,可以将其分成两部份:一部份是静态的连续的文本,如:<html>……< body>;另一部份是动态的特殊标签,如:<asp:TextBox id="txtName" runat="server" />。两者以是否拥有属性runat=”server”为判断标准。ASP.NET将后一部份称之为服务器控件,程序员以服务器控件为对象模型来定义Web应用程序的用户界面,控制用户交互;而前一部份在运行时也将被创建成一种特殊的控件——LiteralControl。




    如果用ASP面向过程的方法来处理所谓的服务器控件,就是根据用户的需求直接生成对应的HTML代码;而在ASP.NET中,程序员与HTML代码被抽象的面向对象的服务器控件概念隔离开来。既然面向对象,服务器控件就应该拥有属性(property)来描述自己的状态;用方法(method)描述自己的动作;需要事件(event)来触发方法,改变状态,最后自动生成相应的HTML代码。当然我们不需要从头来构架这个模型,所有的服务器控件,包括Page类,都直接或间接继承于System.Web.UI.Control类,而显示为HTML表单元素的控件,往往又继承于System.Web.UI.WebControl类,称为Web控件。下例是一个简单的自定义控件范例,访问该例的TestMyControls.aspx页,查看源代码会发现控件对应的html代码为“1”。

// MyControls.cs 自定义控件集
using System;
using System.Web.UI;
namespace essay
{
    public class MyFirstControl:Control   //输出控件属性Number的绝对值
    { 

        private int _number;                   
        public int Number                 //定义属性
        {   

            get {return _number;}
            set {_number=value;}
        }
        //重写Control.Render方法,生成控件对应的HTML代码
        protected override void Render(HtmlTextWriter writer)
        {  
            writer.Write(Math.Abs(Number));
        }
    }
}
// TestMyControls.aspx页面文件,<%Register%>注册自定义控件集
// <mc: ……>在页面增加自定义控件并将属性Number值设为-1
<%@ Register TagPrefix="mc" Namespace="essay" Assembly="essay" %>
<HTML><HEAD></HEAD><body>
<form runat="server">
    <mc:MyFirstControl id="test1" Number="-1" runat="server" />
</form></body></HTML>

■ 葛玲是谁? – 服务器控件的状态保持

    若干年前有一个火腿肠广告,对话如下:
        吕丽萍:冬宝,在想啥呢?
        葛  优:想葛玲
        吕丽萍:别想了,我给你介绍一位新朋友——DUDU牌火腿肠
        吕丽萍:(过一会儿)还想葛玲吗?
        葛  优:葛玲是谁?

    人机交互设计的一个重要内容是交互工作流,而实现交互工作流的前提是状态保持,否则就会出现“葛玲是谁”这样的幽默。控件可以利用传统的cookies、session、隐藏控件等方法来存储状态值,在《随想八》中我们已经探讨过视图状态(ViewState)的作用和原理,本质上,ASP.NET创造出的有状态、连续的页面状态保持机制是通过页面隐藏数据。接下来我们通过改造上例进一步研究利用视图状态来完成控件状态保持的细节。

// MyControls.cs 自定义控件集
……
    public class MyFirstControl:Control
    { 

        private int _number;    
        public int Number{……}
        //增加属性NumberInViewState,用以存取属性Number的视图状态值
        public int NumberInViewState
        {
            get
            {
                object o = ViewState["NumberInViewState"];
                return (o==null)?0:(int)o;
            }
            set { ViewState["NumberInViewState"]=value; }
        }
        protected override void Render(HtmlTextWriter writer){……}
    }
    ……
// TestMyControls.aspx页面文件
<html>
……
<%@ Page Language="C#" %>
<script runat="server">
    protected override void OnLoad(EventArgs e)
    {
        test1.NumberInViewState
--;                //视图状态相应值自减1
        test1.Number = test1.NumberInViewState;   //自定义控件值与视图值保持一致    
        base.OnLoad(e);
    }
</script>
<form runat="server">
    <mc:MyFirstControl id="test1" runat="server" />
    <input type="submit" />
</form></body></html>

■ 换杯子还是换粉圆? – 控件树与服务器控件的生命周期

    在运行期,页面框架会在杯子里放入指定的服务器控件类实例,当然它们不是胡乱堆积在一块,而是组合成一颗控件树,图10-2为例2页面控件树模型,我们可以通过控件的ID或在树中的位置控制控件,也可以增加或删除控件。

    在假想的有状态、连续的页面前提,意味着在初始请求后,页面必须保存每一个控件的状态,在回传(PostBack) 后,首先是恢复控件原来的状态,再处理新的请求。也就是说,每一个客户端对同一个页面的连续N次请求,相当于向奶茶铺连续要了N杯同一品种的奶茶,第一杯 珍珠奶茶中粉圆状态是默认的,从顾客提出第二杯奶茶请求起,伙计必须先把这杯中粉圆状态拨弄成与端给顾客时的上一杯状态一模一样,然后根据顾客新的事件进 行调整。如图10-2。详细过程请查阅MSDN的《控件执行生命周期》。



    这种无中生有的交互工作流实现方法是要付出代价的,作为编程模型而言,程序员可以在服务器控件的抽象概念上轻松实现,但对整个系统的性能而言,ASP.NET并未对客户端和服务器端做过多少负载均衡优化,用合金枪头的话来说,“如果就连选择籍贯省市的下拉框都要用服务器控件来提交一下,同时刷新页面的话,那的确很恶心”。

    一个很自然的想法是为什么对每一次请求我们都要把整个杯子换掉呢?如果仅仅是换掉几个粉圆和一小部份奶茶,将大大改善系统性能,这就是Ajax技术的出发点。