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阻塞浏览器渲染导致的结果。
<!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