腾讯Web前端开发框架JX(Javascript eXtension tools)
转自:Web前端开发-Web前端工程师 » 腾讯Web前端开发框架JX(Javascript eXtension tools)
JX – Javascript eXtension tools
一个类似 Google Closure Library 的 Web 前端开发框架,服役于 WebQQ 等大规模的 WebApp
简介
JX 是模块化的非侵入式Web前端框架,最新开源地址:https://github.com/AlloyTeam/JX。 JX 框架同时适用于 Web Page 和 Web App 项目的开发,特别适合构建和组织大规模、工业级的Web App,腾讯 WebQQ、腾讯Q+等产品都是采用JX框架开发,兼容目前所有主流浏览器。
代码示范
JX 代码组织方式一(传统):
var J = new Jx();
J.out(J.version);
JX 代码组织方式二(推荐):
Jx().$package(function(J){
J.out(J.version);
});
设计理念
- 保持最优的执行效率
- 保持 Javascript 原有的代码风格,降低学习难度
- 不做任何的过度封装
- 更好的组织工业级 Javascript 应用程序
- 探索在前端使用 MVP、MVC 等模式来构建大型 WebApp
- 探索工业级 Javascript 的开发技术
特性
- 微内核设计:内核可完全分离出来,用于构建其他的框架
- 原生对象零污染:你懂的,随着js的App越来约复杂,对原生对象的零污染也体现的越来越重要了
- 模块封包:采用命名空间、闭包等方式建立了模块封包的体系,帮助更好的组织海量js代码
- 模块自由拼装:自身模块做了良好的架构分离,尽可能让各个模块之间可以自由的拼装组合
- 无缝集成各种js框架:与jQuery, YUI, Mootools, Prototype.js 等框架无缝集成;与多种局部框架无缝集成,如:Mini, Sizzle, cssQuery, xpath, JSON 等等
- 多版本共存:如采用的Jx版本过旧,旧有的Javascript代码不能与新版本Jx兼容,则可以采用多版本共存的方式保持程序的可延续性
- 分层设计:Javascript核心层,与Javascript解释引擎无关的封装和扩展;浏览器端Javascript层,对浏览器中的Javascript引擎部分的封装和扩展
架构
- 第一层:Core Javascript 扩展模块 / 代码组织模块(可用于NodeJs等其他js引擎,轻松组织大型应用,无缝接入其它js库)
- 第二层:Browser Javascript 扩展模块(跨浏览器,基础封装) / 可选模块(设计模式相关模块,选择器模块…)
- 第三层:UI 组件 / 实时动画模块 / 游戏引擎模块
发展规划
- 核心底层 – 纯Js底层功能封装/代码组织/无缝接入其它js库 – [完成]
- 基础扩展 – 跨浏览器封装/工具函数/设计模式相关 – [完成]
- UI 基础控件 – 按钮/面板/窗口/树形列表/Tab/lightbox/widgets…
- 实时动画系统 – 实时定时器/关键帧动画/加速度公式/物理引擎/声音控制器…
- 游戏引擎 – 角色控制/地图系统/游戏异步通讯系统/寻路算法/键盘控制/人工智能/…
JX 框架源码包格式下载地址
相关文档
- CheatSheet:http://alloyteam.github.com/JX/doc/jx_cheatsheet.html
- 核心文档:http://alloyteam.github.com/JX/doc/core/index.html
- UI库文档:http://alloyteam.github.com/JX/doc/ui/index.html
- 代码规范:http://alloyteam.github.com/JX/doc/specification/google-javascript.xml
腾讯Web前端开发框架JX(Javascript eXtension tools)的更多相关文章
- TFC2017 腾讯Web前端大会参会小结
简述 上周有幸参加TFC腾讯Web前端大会,见识了各路前端大神的精彩演讲,干货满满的.会议流程分为上午主会场,以及下午的三个分会场.分享的主题涵盖Web新技术.Node.js.框架.工程化. 图形处理 ...
- Bootstrap非常简单实用的web前端开发框架
今天无意间用firebug看网站的代码发现了Bootstrap,之前从来没有听说过这个东东,于是对它产生了好奇感,通过百度我了解到了Bootstrap是一款非常简单,强悍,实用,移动设备端优先使用的这 ...
- 进击的Python【第十四章】:Web前端基础之Javascript
进击的Python[第十四章]:Web前端基础之Javascript 一.javascript是什么 JavaScript 是一种轻量级的编程语言. JavaScript 是可插入 HTML 页面的编 ...
- Web前端开发框架大全-详述
可以说,前端技术的发展是互联网自身发展的一个缩影! 前端技术的发展经历了web1.0时代,即网页只能展示信息,几乎没有交互可言: web2.0时代,web2.0不再是单维的,逐渐发展为双向交流,另一特 ...
- 2015腾讯web前端笔试题
1 请实现,鼠标点击页面中的任意标签,alert该标签的名称.(注意兼容性) 2 请指出一下代码的性能问题,并经行优化. var info="腾讯拍拍网(www.paipai.com)是 ...
- [转] Web前端优化之 Javascript篇
原文链接: http://lunax.info/archives/3099.html Web 前端优化最佳实践之 JavaScript 篇,这部分有 6 条规则,和 CSS 篇 重复的有几条.前端优化 ...
- 浅谈我对几个Web前端开发框架的比较
强调一下,这篇日志主要还是针对想学前端开发的新朋友写的,不是说我有什么独特见解,而是比较客观的状态,就各种框架的异同和应用场合,需要注意的地方做简单描述,不做具体深入分析,有的地方比较抽象,对于抽象之 ...
- web@前端--html,css,javascript简介、第一个页面(常用标签简介)
1.什么是标签#1.在HTML中规定标签使用英文的的尖括号即`<`和`>`包起来,如`<html>`.`<head>`.`<body>`都是标签,#2. ...
- 优秀的WEB前端开发框架:Bootstrap!
其实早就对Bootstrap有所耳闻,大概了解这哥们是做WEB前端的 但直到昨天以前,还没有对他产生任何深入了解的兴趣 冷落他的主要原因还是觉得会束缚手脚,毕竟自己多年来在WEB前端的积累一直没有停滞 ...
随机推荐
- SpringMVC传递参数和获取参数以及返回数据
1.传递form表单,参数接收到对象,name和对象属性对应上即可: 2.springmvc不能直接通过form表单传递多个对象的list集合,要么采用ajax传递,要么采用封装了list属性的b ...
- 生成一个ipa的包,使非开发机也能安装成功 (Xcode5.1)
for example: 想为com.apple.cloud的bundle identifier生成一个非开发机也能安装的ipa包.你需要一个apple的企业账号(apple有两种账号:开发者账号和企 ...
- HBase-集群状态信息
代码如下 package com.hbase.HBaseAdmin; import java.io.IOException; import java.util.Collection; import j ...
- django学习笔记整理(2)django的路由系统
创建一个属于你的django框架.django-admin startproject 框架名 打开你的django框架,你会发现里面还有一个和框架名同名的文件夹,那个文件夹就称为一个app. 创建了d ...
- java实现二进制的加法
先看打印结果在看代码比较好理解.结果在最下面的位置. 总结:讲解了二进制的按位异域.按位与.左移的运算规则.并通过次3种算法得到2个数相加的结果.二进制应该还有其他算法,由于知识浅薄就不知道了. 代码 ...
- 有若干个箱子,假设每个箱子的最大承重为 MaxW 。将货物分配装箱
今天在博客园中看到一个博问,就写了下实现代码. 问题: 有若干个箱子,假设每个箱子的最大承重为 MaxW .有一批物品,它们的重量分别为w1.w2...Wn,假设每个物品的重量都不超过箱子承重.写个算 ...
- jsp:jstl标签之控制流程
下面将要讲的用于流程控制的标签,其中包括:if.choose.when 与 otherwise 等.接下来对这些标签逐一讲解. 这个标签的作用和 Java 程序中的 if 语句作用相同,用于判断条件语 ...
- JavaUtil_10_joda-time_用法入门
二.参考资料 1. Joda-Time 2.jodaTime 的使用说明 3.强大易用的日期和时间库 Joda Time
- 单链表输出倒数第k个结点值(栈实现)
思路1:定义两个指针变量p和q,初始时均指向头节点的下一个节点(链表的第一个节点),p指针沿链表移动: 当p指针移动到第k个节点时,q指针开始与p指针同步移动, 当p指针移动到最后一个节点时,q指针所 ...
- JDBC操作简单实用了IOUtils
package cn.itcast.demo4; import java.io.FileInputStream; import java.io.FileOutputStream; import jav ...