Sea.js学习1——初识Sea.js
Sea.js 是一个成熟的开源项目,核心目标是给前端开发提供简单、极致的模块化开发体验。
使用 Sea.js,在书写文件时,需要遵守 CMD (Common Module Definition)模块定义规范。一个文件就是一个模块。
define(function(require, exports) {
exports.each = function (arr) {
// 实现代码
}; exports.log = function (str) {
// 实现代码
};
});
通过 exports
就可以向外提供接口。
define(function(require, exports) {
var util = require('./util.js'); exports.init = function() {
// 实现代码
};
});
Sea.js 增加的 require
语法关键字,就如 CSS 文件中的 @import
一样,给我们的源码赋予了依赖引入功能。
首先要在页面中引入 sea.js 文件,这一般通过页头全局把控,也方便更新维护。想在页面中使用某个组件时,只要通过 seajs.use
方法调用。
Sea.js 带来的两大好处:
- 通过
exports
暴露接口。这意味着不需要命名空间了,更不需要全局变量。这是一种彻底的命名冲突解决方案。 - 通过
require
引入依赖。这可以让依赖内置,开发者只需关心当前模块的依赖,其他事情 Sea.js 都会自动处理好。对模块开发者来说,这是一种很好的 关注度分离,能让程序员更多地享受编码的乐趣。 小结
除了解决命名冲突和依赖管理,使用 Sea.js 进行模块化开发还可以带来很多好处:
- 模块的版本管理。通过别名等配置,配合构建工具,可以比较轻松地实现模块的版本管理。
- 提高可维护性。模块化可以让每个文件的职责单一,非常有利于代码的维护。Sea.js 还提供了 nocache、debug 等插件,拥有在线调试等功能,能比较明显地提升效率。
- 前端性能优化。Sea.js 通过异步加载模块,这对页面性能非常有益。Sea.js 还提供了 combo、flush 等插件,配合服务端,可以很好地对页面性能进行调优。
- 跨环境共享模块。CMD 模块定义规范与 Node.js 的模块规范非常相近。通过 Sea.js 的 Node.js 版本,可以很方便实现模块的跨服务器和浏览器共享。
Sea.js学习1——初识Sea.js的更多相关文章
- WebGL three.js学习笔记 创建three.js代码的基本框架
WebGL学习----Three.js学习笔记(1) webgl介绍 WebGL是一种3D绘图协议,它把JavaScript和OpenGL ES 2.0结合在一起,通过增加OpenGL ES 2.0的 ...
- three.js学习:初学three.js,从立方体开始
目前three.js是浏览器展现3D效果的一个很强大的js工具,遗憾的是没有特别系统而全面的文档(threejs官方文档感觉有些缺漏,可以和WebGL中文网的threejs教程对比着看).好了,根据W ...
- Backbone.js学习之初识hello-world
说了好久好久要学习Backbone.js,现在终于下定决心开始学习了.然后呢,就根据我的学习进度在这里做个简单的记录,方便新人,也方便我自己以后回忆. 准备 用bower下载这几个库或框架也是醉了.. ...
- Node.js学习笔记(1) - Node.js简介
近期在看一些Node.js的知识,看完后觉得,一些前面的东西忘记了,于是整理一下,方便自己查阅,也希望对学习Node.js的朋友有些帮助: 当然以下只是我个人的观点和理解,不喜勿喷,也望大神指教. 一 ...
- js学习之道:js防止表单重复提交
第一种:用flag标识,下面的代码设置checkSubmitFlg标志: <script language="”javascript”"> var checkSubmi ...
- vue.js随笔记---初识Vue.js
1.基础要求: 1.1 HTML CSS JAVASCRIPT 1.2 模块化基础 1.3 Es6初步了解 2.vue.js 轻量级的MVVM模式框架,他同时吸收了recat和angular的优点,他 ...
- js学习(六)- js对象创建
//---------------------js文件--------------------- var namespace02=new Object(); namespace02.Person=fu ...
- Node.js学习笔记(2) - Node.js安装及入门hello world
今天来简单的记录一下Node.js的安装配置以及简单的入门 一.Node.js的安装 1.windows下的安装 windows下的安装很简单,只需要去官网http://nodejs.org中,找到w ...
- JS学习笔记(模态框JS传参)
博主最近基于django框架的平台第一版差不多完成了 今天整理下开发过程中遇到的前端知识 基于前端bootstrap框架模态框传参问题 上前端html代码: <div class="m ...
随机推荐
- ArrayList 如何增加大小
JDK1.8 private static final Object[] DEFAULTCAPACITY_EMPTY_ELEMENTDATA = {}; transient Object[] elem ...
- 类似qq的浮动窗口 ,随着滚轴的滚动,始终处于屏幕的中间(能看到运动的过程)
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- Python中 filter | map | reduce | lambda的用法
1.filter(function, sequence):对sequence中的item依次执行function(item),将执行结果为True的item组成一个List/String/Tupl ...
- 如何做出header,footer固定定位后让main主体部分可以滑动,在微信浏览器中滑动到最后不出现黑边的情况
<!doctype html> <html> <head> <meta charset="utf-8"> </ ...
- Eclipse 常用用法
搞了很多年的.NET, 最近开始搞Eclipse. 刚开始使用 Eclipse, 发现 Eclipser 远没有Visual Stuido 强大. 所以先把Eclipse常用的用法总结 ...
- 如何获取有性能问题的SQL
1.通过用户反馈获取存在性能问题的SQL. 2.通过慢查日志获取存在性能的SQL. 启动慢查日志 slow_query_log=on set global slow_query_log=o ...
- iOS开发拓展篇—音频处理(音乐播放器6)
iOS开发拓展篇—音频处理(音乐播放器6) 一.图片处理 说明: Aspect表示按照原来的宽高比进行缩放. Aspectfit表示按照原来的宽高比缩放,要求看到全部图片,后果是不能完全覆盖窗口,会留 ...
- PHP中file_put_contents追加时换行
很多时候记录日志需要换行.不建议使用\r\n,因为:在windows中\r\n是换行在Mac中\r是换行在Liunx中\n是换行 但是PHP提供了一个常量来匹配不同的操作系统,即: file_put_ ...
- OC基础--类
都是注释哈 类的组成: C语言中函数分为声明和实现 OC中定义一个类也分为声明和实现, 也就是说以后我们在OC中定义类, 就是在写类的声明和实现 编写类的声明和实现: 声明 .h: /* 行为方法: ...
- CircleImageView
package com.cainiao5.cainiaoheadimg; import android.content.Context;import android.content.res.Typed ...