Extjs 强大的WEB窗体开发库

原文：Extjs 强大的WEB窗体开发库

作为一个javascript程序员，必须时刻关注JS的最新发展，想了解JS最新动态，可以关注我们的 Javascript教程网。

最近几年比较火的前端js框架extjs 算是其中的佼佼者。统一的UI设计，强悍的组件及丰富的插件，对浏览器良好的兼容性等优点使得许多公司使用Extjs，同时也使得无数程序猿开始研究这个玩意也包括我在内。废话不多说，我们来看看extjs和extnet 是什么东东。

用过的extjs 的程序猿，恐怕都有五味杂陈的感受。有时为了一个特殊的功能，不知耗费多少心血。甚至一不小心少写了括号找了半天，让人抓狂。当然这里排除那些代码天才。平心而论extjs开发是有难度的。要用好它，要学的东西真不少。CSS，html，js，服务器脚本语言(php,java,asp.net)。不要以为有js框架就不用关注那些css，html了，等哪天老板说”我要这种功能，这种效果。“  哈哈，就懂了。那么问题来了，怎样降低这个开发难度呢？就有这个公司搞了个Ext.Net ,再extjs 上狠狠的封装了一下。有多狠，Ext.net(2.5).dll,居然有125MB。 让无数开发者仿佛一下子回到了asp.net 拖控件的时代。历史就是这样，重复着造轮子。。。

在Extjs窗口这样写的：

1. Ext.create('Ext.window.Window', {
   
2.     title: 'Hello',
   
3.     height: 200,
   
4.     width: 400,
   
5.     layout: 'fit',
   
6.     items: {  // Let's put an empty grid in just to illustrate fit layout
   
7.         xtype: 'grid',
   
8.         border: false,
   
9.         columns: [{header: 'World'}],                 // One header just for show. There's no data,
   
10.         store: Ext.create('Ext.data.ArrayStore', {}) // A dummy empty data store
    
11.     }
    
12. }).show();

复制代码

ext.net 是这样写的：

<ext:Window
            ID="Window1"
            runat="server"
            Title="Hello World"  
            Icon="Application"
            Height="185"
            Width="350"
            BodyStyle="background-color: #fff;"
            BodyPadding="5"
            Modal="true">
            <Content>
                This is my first <a target="_blank" href="http://www.ext.net/"> Ext.NET</a> Window.
            </Content>
        </ext:Window>



在写代码上，使用vsIED开发环境Ext.net 有智能提示（通过设置extjs也可以），但是你要是把ext.net属性设置错了或者其他错， 编译时直接给你个报个错。不改正确都不行。从这点上来说对程序员来说确实是个福音。

下面来看下注册事件的区别：extjs 这么写

Ext.create('Ext.Button', {
    text: 'Click me',
    renderTo: Ext.getBody(),
    handler: function() {//看这里！
        alert('You clicked the button!');
    }
});

还可用”on()“ 方法注册事件。Ext.Net 长什么样呢，如下所示：

<ext:ImageButton
        runat="server"
        ImageUrl="button.gif"
        OverImageUrl="overButton.gif"
        DisabledImageUrl="disabled.gif"
        PressedImageUrl="pressed.gif">
        <DirectEvents>   //这里hock 后台事件
            <Click />
        </DirectEvents>
        <Listeners>
            <Click Handler="*这里你可以写js代码处理*"/>
        </Listeners>
    </ext:ImageButton>

这里是后台代码

<script runat="server">
    protected void Button_Click(object sender, DirectEventArgs e)
    {
        X.Msg.Alert("Server Time", DateTime.Now.ToLongTimeString()).Show();
    }
</script>

事件就简单到这里，下面说两者的性能差异。整体上来说，extnet是包装过的性能肯定有所下降。据自己开发时体会，Ext.net事件交互上本质是使用extjs的DirectEvent，大量的事件交互，导致了许多不必要的服务器请求。这是导致性能不佳一个很重要的原因。而extjs许多处理直接通过前台js代码控制，规避了这类问题。

再来介绍下大家比较关心的东西，收不收费？ extjs 是开源的，需要遵守GNU协议的。而extnet用于商业盈利需要收费的。具体的细节的看下他们的说明。

好了简单介绍到这里吧。具体选择哪种组件开发，需要结合实际情况慎重考虑。

新的一年，给广大程序猿一个福利。在 web开发 extjs或者extnet时都不免查看api文档。查看官方网站时，会发现只要在从天朝访问外国网站都比较卡，有时还无法访问。为此博主决定改变一下。查看在线api文档请点击这里： http://api movivi cn。为了程序员更好写代码，我也是蛮拼的，希望这能够帮助到你。