概览

RequireJS 是一个JavaScript模块加载器,采用AMD规范(异步模块加载机制),使用RequireJS加载模块化脚本将提高代码的加载速度和质量。

项目地址:链接

库引入



正常编写方式


<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="load.js"></script>
    </head>
    <body>
      <span>body</span>
    </body>
</html>


function fun1(){
  alert("it works");
}
fun1();
当运行上面例子时不知道你是否注意到,alert执行的时候,html内容是一片空白的,即body并未被显示,当点击确定后,才出现,这就是JS阻塞浏览器渲染导致的结果。

requireJs写法


<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="require.js"></script>
        <script type="text/javascript">
            require(["load"]);
        </script>
    </head>
    <body>
      <span>body</span>
    </body>
</html>


define(function(){
    function fun1(){
      alert("it works");
    }
    fun1();
})

浏览器提示了"it works",说明运行正确,但是有一点不一样,这次浏览器并不是一片空白,body已经出现在页面中,目前为止可以知道requirejs具有如下优点:

1、防止js加载阻塞页面渲染

2、使用程序调用的方式加载js

3、异步绘制组件,按需加载js

API文档

更多信息,访问官方API地址