JQuery Smart UI 简介(三)

- 设计思想【附全部框架源码+Demo（.Net）】

今天发布了“Smart UI 演示Demo”，但代码文件的版本转换和下载问题从早上折腾到下午。另外，对博客园规则也不是很熟悉，怎么发布到首页也没搞清楚，现在更新一遍下载，

      Smart UI 所有源码 + 演示Demo【.Net】：

　　博客园下载

      匿名下载

      

　　本篇主要介绍一下Smart UI的设计思想。首先列出在日常项目中，所遇到的一些问题：

1. 系统访问量大，服务器不堪重负；
2. 项目框架老化，很多地方使用很不方便和繁多的重复工作量，使得开发人员效率低下；
3. 开发工具中所带的控件和组件，功能单一，性能低下，而各种引入的控件，常常不能方便的、系统的使用，经常要重新的封装一遍。
4. 为了实现一些特效和功能而引入各种组件五花八门，各自都有自己的一套内容，无法有效的统一管理，资源浪费严重。
5. 开发人员只会使用服务端编程 — 只会使用控件，对于Web开发的最终展现代码 — htm、css、js等，则是一知半解，无法有效的控制页面，常常很容易得时间搞的很复杂。比如：.net中DropDownList,listbox在页面端的htm是什么就有不少的人不知道。
6. 原有框架对于多浏览器的支持十分薄弱，项目中对于各种主流浏览器的支持的需求也越来越多。
7. 设计对开发的指导不足，常常开发出来的内容与之前的设计大相径庭

   针对以上内容，Smart UI框架从以下几个方面考虑：

　　

　　

•    高效性

　　放弃服务端的开发方式，采用“胖客户端”的前台功能实现。实现前后台分离，功能与数据分离，页面组织与呈现都在客户端完成，与服务器请求只在数据上，这样大大减少客户端与服务端请求时间、数据量和现实页面大小。

　　在后台（.net）,以“结构实体”解析前台传递的数据，数据库数据使用Ado.net的原始的数据对象DataTable,DataSet，避免“Orm”中反射的性能消耗。业务层使用全静态方法实现。读、写数据操作分离。

　　提高设计对开发的指导意义，从每个方法到每个页面都能在设计中体现，而开发人员根据设计有效的进行配置和填充性开发（具体内容在后面Smart UI实例讲解中说明）。另外，框架中使用的htm页面开发，因此无论是使用框架做Demo，还是将demo转换成页面，都很便利。

     

• 　通用性

　　htm+js的开发，可以跨平台，提供一个统一的数据接口，无论是Java还是.net，或者是用的什么类型的数据框架，只要实现这个数据接口能使用Smart UI，这样有效的提高通用功能的利用率。同时配置前后台分离的开发方式，也可以合理的调配人员，如：做java的可以去.net项目，不用关心后台实现，可以完成前台的功能代码。

• 扩展性

　　从Css，js，到htm都提供一套完整的结构和各种常用场景的内容，便于项目的扩展和使用。封装一套常用的JQuery插件，统一使用接口。另外，CSS和JS都有着十分细致的分层（下篇“Smart UI 框架讲解”中详细说明），满足各种应用和插件引入，统一配置管理等。

　　

• 便捷性

　　利用JQuery强大的功能，和js弱类型的优势，实现配置式的开发方式，提供完整的动态生成功能，自动完成“页面生成”、“取/赋值”、“数据验证”、“数据传递”等等功能。

• 　安全性

　　在前台，采用ajax load 内容页面的方式。功能代码放在内容页面中，或者是对应的js库中。使用ajax load 的内容页面时，客户端无法轻易的捕获到这些代码，目前IEDevelop、FireBug、Crome调试等前台调试工具都无法获取到。

　　在后台，通过统一接口，check每个fncode（对应每个方法）的权限，来达到方法级的控制。

　　

　　最后说明一下Smart UI的运行流程：

　　首先根据UICode加载内容页面，然后执行内容页面上的初始化代码，根据是否存在Fncode，向统一数据接口（PostHandler）请求数据，数据接口根据Fncode执行相应的方法，组织相应的数据，返回给前台，然后根据数据生成页面。具体执行流程图如下：

　　

　　虽然无法完全解决上述的那些问题，但也能从一定程度上去改善，起码也朝着这个方面前进，大家如果有好的意见和建议，请不吝赐教。

      “Smart UI 简介”系列，明天发布最后一篇， “Smart UI 框架讲解”，而后会另起一个“开发讲解”的系列，同时也会陆续发布前后台框架的api，介绍各种Plugin的使用。

http://www.cnblogs.com/zhh8077/archive/2010/11/17/1880087.html