实现简单的 JS 模块加载器
2021-04-26 02:26
阅读：536
YPE html>
标签：就是 lazy webp char module document oct 应用 方法
实现简单的 JS 模块加载器
按需加载是前端性能优化的一个重要手段，按需加载的本质是从远程服务器加载一段JS代码(这里主要讨论JS，CSS或者其他资源大同小异)，该JS代码就是一个模块的定义，如果您之前有去思考过按需加载的原理，那你可能已经知道按需加载需要依赖一个模块加载器。它可以加载所有的静态资源文件，比如：
- JS 脚本
- CSS? 脚本
- 图片 资源
如果你了解 webpack，那您可以发现在 webpack 内部，它实现了一个模块加载器。模块加载器本身需要遵循一个规范，当然您可以自定义规范，大部分运行在浏览器模块加载器都遵循 AMD 规范，也就是异步加载。
下面是一个基于AMD规范的简单的模块加载器：
Document
1. 相同模块的并发加载问题?
主要的相关点在于:
- 模块的定义方法
- 模块的加载方法
- 已经加载过的模块需要缓存
- 同一个模块并行加载的处理
还未考虑的点包括：
- 模块加载失败时异常处理
- 定义模块时，该模块依赖其他模块
- ......
可以看出的是，对于某个应用使用了模块加载器，那么首先需要加载该JS代码，然后有一个主模块，程序从主模块开始执行, requireJS 中使用main来标记，webpack 中叫?webpackBootstrap 模块。
以上代码有助于帮您理解 requireJS 和 webpack 应用的运行流程。
实现简单的 JS 模块加载器
标签：就是 lazy webp char module document oct 应用 方法
原文地址：https://www.cnblogs.com/gaollard/p/12227997.html
下一篇：关于CSS的问题
评论
亲，登录后才可以留言！