我们通常开发js程序就是使用<script>标签把脚本引入到页面中进行开发,如果是简单的逻辑还好,但是如果是比较庞大的大规模js开发,可能会出现下面的问题:

1.  <script>标签载入脚本和执行脚本是在一起处理的,所以开发人员需要自己控制这个过程

2. <script>标签是阻塞型下载的,所以对用户体验可能会产生影响,所以通常推荐把脚本放在页面底部,一些async和defer属性也部分解决了这个问题

3. <script>的全局变量是共享的,也就是说所有的代码都是在一个环境下执行的,没有命名空间的概念,这样容易引起代码的相互影响,比如后引入的代码造成之前代码的崩溃和bug

4.<script>没有依赖关系,脚本的载入通常是要严格遵守先后顺序,不如可能会引起依赖问题。

出现这些问题的原因是JS环境没有高级编程语言(例如PHP,Java,C#)中的模块概念,为了解决这些问题,随着JS的发展,YUI提供了一个解决方案:YUI3提供了一个全局对象 YUI,他既是一个命名空间,同时也包含了一些加载注册模块等基本功能,他的优点是:

1. 解耦脚本注册和执行阶段,YUI.add()将代码按需加载,YUI.use()在安全沙箱内运行这些模块

2. YUI可以同步或异步加载模块

3. 除了一些静态方法外,YUI避免了使用全局上下文环境,Y实例是私有的,不会被外面的沙箱覆盖

4. YUI支持依赖加载,在add注册模块时,可以包含一些依赖信息,当use这个模块时使用这个信息来构建依赖树,同时跳过已经加载的模块。

YUI笔记 1 模块加载的更多相关文章

  1. node 学习笔记 - Modules 模块加载系统 (1)

    本文同步自我的个人博客:http://www.52cik.com/2015/12/11/learn-node-modules-path.html 用了这么久的 require,但却没有系统的学习过 n ...

  2. node 学习笔记 - Modules 模块加载系统 (2)

    本文同步自我的个人博客:http://www.52cik.com/2015/12/14/learn-node-modules-module.html 上一篇讲了模块是如何被寻找到然后加载进来的,这篇则 ...

  3. Node.js模块 加载笔记

    //核心模块就是Node.js标准API种提供的模块,如fs,http,net.vm等.官方提供,编译成二进制代码//核心模块拥有最高的加载优先级 //文件模块则是存储为单独的文件(或文件夹)的模块, ...

  4. js模块加载框架 sea.js学习笔记

    seajs实现了JavaScript 的 模块开发及按模块加载.用来解决繁琐的js命名冲突,文件依赖等问题,其主要目的是令JavaScript开发模块化并可以轻松愉悦进行加载. 官方文档:http:/ ...

  5. thinkphp学习笔记9—自动加载

    原文:thinkphp学习笔记9-自动加载 1.命名空间自动加载 在3.2版本中不需要手动加载类库文件,可以很方便的完成自动加载. 系统可以根据类的命名空间自动定位到类库文件,例如定义了一个类Org\ ...

  6. sea.js模块加载工具

    seajs的使用 seajs是一个jS模块加载器,由淘宝前端架构师玉伯开发,它可以解决命名空间污染,文件依赖的问题.可以在一个js文件中引入另外一个js.require('a.js') 1.安装 np ...

  7. 实现一个类 RequireJS 的模块加载器 (二)

    2017 新年好 ! 新年第一天对我来说真是悲伤 ,早上兴冲冲地爬起来背着书包跑去实验室,结果今天大家都休息 .回宿舍的时候发现书包湿了,原来盒子装的牛奶盖子松了,泼了一书包,电脑风扇口和USB口都进 ...

  8. node模块加载层级优化

    模块加载痛点 大家也或多或少的了解node模块的加载机制,最为粗浅的表述就是依次从当前目录向上级查询node_modules目录,若发现依赖则加载.但是随着应用规模的加大,目录层级越来越深,若是在某个 ...

  9. 使用RequireJS并实现一个自己的模块加载器 (一)

    RequireJS & SeaJS 在 模块化开发 开发以前,都是直接在页面上引入 script 标签来引用脚本的,当项目变得比较复杂,就会带来很多问题. JS项目中的依赖只有通过引入JS的顺 ...

随机推荐

  1. 假设做一个精美的Login界面(攻克了一EditText自带clear的功能,相似iphone的UITextField)

    先上图:     XML为: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" ...

  2. 001-es6变量声明、解构赋值、解构赋值主要用途

    一.基本语法 1.1.声明变量的六种方法 参看地址:http://es6.ruanyifeng.com/#docs/let let:局部变量,块级作用域,声明前使用报错 var:全局变量,声明前使用 ...

  3. Android开发中string.xml文件的使用

    为什么需要把应用中出现的文字单独存放在string.xml文中呢? 一:是为了国际化,Android建议将在屏幕上显示的文字定义在strings.xml中,如果今后需要进行国际化,比如我们开发的应用本 ...

  4. TypeScript学习笔记—函数

    函数定义 在 JavaScript 中,有两种常见的定义函数的方式——函数声明(Function Declaration)和函数表达式(Function Expression): // 函数声明(Fu ...

  5. smtplib与email模块(实现邮件的发送)

    SMTP是发送邮件的协议,Python内置对SMTP的支持,可以发送纯文本邮件.HTML邮件以及带附件的邮件. Python对SMTP支持有smtplib和email两个模块,email负责构造邮件, ...

  6. php 获取各类时间归类

    //php获取今日开始时间戳和结束时间戳 $beginToday=mktime(0,0,0,date('m'),date('d'),date('Y')); $endToday=mktime(0,0,0 ...

  7. java队列的实现

    队列也可以通过数组和链表两种方式来实现. 1.链表方式实现 class Node{ Node next = null; int data; public Node(int data){this.dat ...

  8. 转:.Net 中的反射(反射特性) - Part.3

    .Net 中的反射(反射特性) - Part.3 反射特性(Attribute) 可能很多人还不了解特性,所以我们先了解一下什么是特性.想想看如果有一个消息系统,它存在这样一个方法,用来将一则短消息发 ...

  9. CodeForces - 220B Little Elephant and Array (莫队+离散化 / 离线树状数组)

    题意:N个数,M个查询,求[Li,Ri]区间内出现次数等于其数值大小的数的个数. 分析:用莫队处理离线问题是一种解决方案.但ai的范围可达到1e9,所以需要离散化预处理.每次区间向外扩的更新的过程中, ...

  10. 使用curl 命令模拟POST/GET请求

    https://blog.csdn.net/u012340794/article/details/71440604 curl命令是一个利用URL规则在命令行下工作的文件传输工具.它支持文件的上传和下载 ...