Giter Club home page Giter Club logo

mass-framework's Introduction

mass Framework

这是一个前后端一体化的javascript框架。client部分用于前端,从零开始建起,不依赖于其他框架。sever则构建在node.js,需要node.js的环境支持。

前后端都是以mass.js这个“模块加载模块”为起点,利用require方法构建框架,但它们内部的实现并不一样。后端的require只是node.js 原生require方法的一层薄薄的包装, 而前端则通过script标签在iframe沙箱环境进行加载,组装。除此之外,前端专注于DOM的操作,后端则忙碌于IO的操作。前端的操作除了事件系统,Ajax与动画系统是异步之外,都是线性的同步操作。 后端则需要挖掘CPU的利用率,许多操作都有两套方法(同步与异步),不过异步方法更受青睐,为此,mass Framework对此发展出三种不同层次的解决方案,让用户更方便地使用异步方法。

前端是从模块加载开始,通过选择器构建节点链对象实现jQuery式的各种操作(数据缓存,样式操作,事件绑定,ajax调用,dom操作,属性操作),许多API都与jQuery非常相近。在语言底层,通过对ecma262v5新API的检测与补丁支持确保连IE6也能使用 String.prototype.trim, Array.prototype.forEach, Array.prototype.map,Array.prototype.filter, Array.prototype.reduce, Function.prototype.bind 等高级API, 享受Prototype.js那种编程快感。另,还通过$.lang(aaa)生成语言链对象对字符串, 数字,数组,类数组,对象这几种数据类型提供更多便捷操作, 这在保证不污染原型的同时, 亦能够进行链式操作。

在大规模开发过程,mass Framework提供以下特征确保迅敏开发:

  1. 多库共存。
  2. 多版本共存。
  3. 模块系统,将不同业务的代码封存于不同的JS文件中,确保自治,加载时能自行处理依赖关系。(目前版本为v14)
  4. 模板机制,提供format,hereDoc,tag, ejs 这四种级别的字符串拼接方法(后两个是用于生成HTML代码片断)。
  5. 异步列队,将一组方法延迟到末来某一时间点时执行,并能应对时间上的异常捕获。
  6. 操作流,将多个相关的回调组织起来,避免回调套嵌,将串行等待变成并行等待,一处合并,多处触发。
  7. 自定义事件,方便设置UI的各种行为。
  8. 强大的类工厂。(目前版本为v7)
  9. AS3式的补帧动画系统。
  10. CSS3 transform2D支持。

后端部分,核心功能是手脚架,热部署,拦截器群集,MVC,ORM。它正在编写中,前三大功能基本成型。。。。

mass的合并

  1. 将模块加载模块mass.js里面的内容先复制到一个临时文件
  2. 在其最后一行"})(this,this.document);" 与倒数第二行" $.exports("$"+postfix);"插入标识模块已加域的代码。 其代码如下:
        var module_value = {
            state:2
        };
        var list = "ecma,lang,spec,support,class,data,query,node,css_ie,css,dispatcher,event,attr,fx,ajax".match($.rword);
        for(var i=0, module;module = list[i++];){
            mapper["@"+module] = module_value;
        }
    
    list里面的为要合并的模块名
  3. 将其他模块里面的内容直接拷到上面的代码之下。

成功后,整个代码结构如下:

(function(global , DOC){
//这是最核心的模块加载模块
//XXXXXXXXXXX
 //然后加上这样一段
    var module_value = {
        state:2
    };
    var list = "ecma,lang,spec,support,class,data,query,node,css_ie,css,dispatcher,event,attr,fx,ajax".match($.rword);
    for(var i=0, module;module = list[i++];){
        mapper["@"+module] = module_value;
    }
//然后把要合并的JS文件的内容直接抽取出来放在下面
   $.define("ecma", function(){
//XXXXXXXXXXXXXX
});
   $.define("lang", function(){
//XXXXXXXXXXXXXX
})
   dom.define("class", function(){
//XXXXXXXXXXXXXX
})
   $.define("data", function(){
//XXXXXXXXXXXXXX
})
   $.define("node", function(){
//XXXXXXXXXXXXXX
})
//....
})(this,this.document)

注意,以上合并工作已经有脚本实现了,它位于doc/public/merge.js文件之中。

如何试用mass Framework?

点上方“ZIP”按钮下载到本地,解压后里面有个AspNet.exe服务器(需要微软的.net Framework支持),进去选doc目录就可以运行里面的示例了。

大家在github注册后,就可以在https://github.com/RubyLouvre/mass-Framework/issues里面提交建议或BUG什么了.

by 司徒正美 (zhongqincheng)

2011.11.15

http://www.cnblogs.com/rubylouvre/

mass-framework's People

Contributors

rubylouvre avatar

Stargazers

 avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.