使用MT快速搭建移动webapp.PPTVIP

使用MT快速搭建移动webapp 2014-04-26 自我介绍 赵娜 手机腾讯网 前端工程师 QQ E-mail 目录 4 MT介绍 设计原理和实现 快速搭建和业务使用 与主流框架区别 未来和展望 MT介绍 什么是MT： MT（mobile tencent/mobile touch） 手机腾讯网前端团队开发维护的一个专注于移动端webapp的模块管理和模块加载的框架 主要功能： 1.模块依赖管理 2.模块加载（支持增量更新，本地存储） 3.页面的路由和分发 4.简单易用的打包上传工具 特点： 1.专注于移动端，以为用户省流量为目的，无更新不下载 2.方便接入，自由组合，接入者可以只选择其中某一项，或者某几项功能 3.开发者只需要专注于自己的业务 行业数据 网络分布 设计原理和实现 二、MT设计原理和实现 设计和实现--core.js 模块依赖管理 core.js 功能：负责管理模块依赖，AMD规范，相较requireJs和seajs，功能单一，接口简洁，轻量。 压缩完仅1KB 使用： 设计和实现--storeinc.js 模块加载 storeinc.js 功能：负责模块的加载，与模块管理工具 配合使用，可以实现本地存储，和增量合 并的功能 设计和实现--storeinc.js 模块加载 storeinc.js 设计和实现--本地缓存效果 本地存储效果： 设计和实现--业务使用效果 4 非wifi下测速 结论： 新版的速度占比相比老版，3s以内提升了4% 设计和实现--pm.js 页面时序和路由管理 pm.js 功能： 1.事件驱动，利用观察者模式解耦，负责页面加载的时序管理和路由控制 2.将页面的加载时序分成几个阶段，进行不同的事件分发，如果采用模块管理，一个页面则被看作一个模块，该功能需与core.js配合使用。 3.hashchange触发，与业务无关 设计和实现--pm.js 页面时序和路由管理 pm.js 设计和实现--配合使用 三个主要功能如何配合： 快速搭建webapp和业务使用 三、快速搭建webapp和业务使用 快速搭建webapp 业务接入： 快速搭建webapp 快速搭建webapp 在业务中的使用： 业务接入效果 业务接入效果： 主流框架区别 四、主流框架区别 stackoverflow 2013 stackoverflow 2013最热语言 AngularJs stackoverflow 2013新技术讨论 与主流框架区别 前端主流框架： MVC ，MVVM框架 代表：AngularJS，backbone AngularJS 特点：数据和视图的双向绑定,将 Model 和 View 自动关联了起来，数据有修改， view会自动更改。 缺点：接入门槛高，而且比较重，开发者不能随意改变dom的结构 优点：社区活跃，也有大量ui插件，易于测试 与主流框架区别 BackBone： 特点：实现了MVC和router的功能 优点：可以更自由的与第三方类库搭配，不太要求固定的模式，灵活性高，轻量 缺点：深度依赖underscore，代码组织上没有很好的规范 与主流框架区别 MT： 特点：移动应用搭建的解决方案，so，不能称之为框架 优点：可以更自由的与第三方类库搭配，轻量，灵活性高，自由组合，让开发者专注于自己的业务 缺点：功能少，交给业务实现的东西多，灵活是一把双刃剑 未来和展望 展望和未来： 1.继续专注移动开发的几个特点，网络情况差，手机内存小 2.集成一些适用于移动开发的组件，供开发者用 3.关于自动化测试，业务监控 4.提供一种快速建站的方案 参考资料 官网： github： /mtjs/mt