如何设计大型网站的前端 JavaScript 框架?
如何设计大型网站的前端 JavaScript 框架?
具体的架构方法可能会有很多种适用的情形也不一样,我只说一些通用的东西。
相对大型的项目在前端 JS 方面有几个需要达成的目标:
1.代码逻辑分层
2.便于多人协作开发
3.各部分代码模块化,可以按需加载
4.保持全局变量的清洁
5.可进行单元测试
用 GoogleClosure 时对应如下:
1. 代码由底层类库(GoogleClosure)提供,项目代码分为几部分:
•常量定义
•Helper 方法
•项目相关的 UI 组件,如 InPlaceEditor, VoteBar 等
•按功能模块划分的 Module,如 LoginPanel, AnswerList 等
•程序入口 main 函数及各大模块(以页面或一组页面划分)入口,如 ProfilePage, HomePage
•单元测试:针对UI模块的测试和界面元素呈现测试,可批量执行
2 . 开发人员负责各自模块的开发及测试编写,界面和功能测试(如果涉及异步请求,使用 Mock 对象)全部通过之后与后台联调。
3. 使用 ClosureBuilder 跟据各模块的依赖关系生成 dependency 文件,并分别进行 build(压缩、混淆),每页面根据所属模块引入一至二个 JS 文件
4. 使用 goog.provide() 方法划定命名空间。
5. 使用 GoogleClosure 自带的单元测试工具编写测试用例并调试。
5 票,来自 赵彬、Bill Cheng、知乎用户 更多 用jquery做js基础:
1:动态加载js:LAB.min.js
2:解决ie不能兼容html5的问题:html5shiv.js
3:自己写动态加载css,ie,chrome,firefox都兼容
4:通过jquery的load方法加载测试数据,加载html片段(将整个页面html片段化),替换动态内容区
通过LAB.min.js加载自己的js模块,
4 票,来自 薛腾飞、alswl、潘悦 更多 简单说下,首先是模块化开发,方便多人合作,减少代码冲突,多使用继承接口思路来取代if else,另外做一些监控能定位模块运行状态,必要时尽量考虑one-page模式,减少对服务器的请求同时也能提要页面加载速度(可参考bigPipe或者bigRender模式)
管博,iOSer,Nodejser 抛砖引玉吧,这片blog《The Top 10 Javascript MVC Frameworks Reviewed中提到的观点比较合我口味,作者最后给出的胜出者是ember.js。评价标准如下:
•UI Bindings
•Composed Views
•Web Presentation Layer
•Plays Nicely With Others
不知道是否还有其他的,请补充。
联系我们
软件开发: 15838307519(司经理)
网络营销: 13676968269(王经理)
网络建设: 13073737771(郭经理)
24小时服务电话: 0371-56683330