知识共享许可协议

ESL 中的错误提示信息

AMD 为浏览器端开发带来了诸多好处:模块声明、异步加载、依赖管理、bundle等,已经成为很多团队应用开发的标配。在正确的代码下,一切看起来都还好,但是当问题出现时,追查过程通常会令人头疼,此时Loader的提示信息对错误的追查非常关键。ESL 是熊厂应用得比较多的 AMD Loader,本篇blog试图对 ESL 的错误场景与信息提示策略,以及如何追查错误,进行简单的介绍。主要涉及以下3个方面:

  1. 模块结构问题
  2. 初始化运行中的错误
  3. 疏忽导致在模块定义内使用了global require

先厚脸皮求关注。

首先,建议大家在开发中追查错误时,使用 chrome 浏览器的开发者工具。因为它对 re-throw 错误的 stack 跟踪与查看支持得比较好。

阅读全部

IoC 在前端模块化中的实践应用

前端模块化背景

在大部分单页式应用中,前端代码都是以 MV* 的结构来组织的,好处自然不必多说。在开始一个项目时,我们往往会将项目的业务功能纵向切分成多个子业务功能, 以模块的形式分配给团队各个开发人员,以达到最大的并行开发。随着业务的发展,新的项目也越来越多,我们会发现很多新的项目和现有的项目是有不少功能交集的。

从业务角度来看,一个项目就是由各个模块组合而成:A 项目由 m1, m2, m3 组合而成, B 项目则可能由 m1, m3, m4 组合而成。

在业务上将各个功能拆分明确后,很明显的 m1, m3 两个功能在 A 项目都是存在的,从工程角度来说,开发 B 项目的时候如果能够直接将A项目已经开发完毕的 m1, m3 直接复用, 那么必然是能够带来很明显的人力节约。

接下来就是从技术上去实现功能的复用,对于后端来说,通常的做法是服务化接口,而对于前端来说,我们目前的方案正是前端模块化:将功能打包为模块,发布至内部中央仓库, 使用方通过自己的方式(如:npm, bower, link[import], 百度的 edp, fis 等)导入模块包使用。

按照前端模块化的思路,开发新项目时,开发人员的工作从原来的开发所有功能变为:接入已有的功能模块,开发不存在的功能模块。

阅读全部

PC端大型单页式商业内容管理系统的JS模块化构建探索

前提

为了不被喷得太惨,给标题加了这么多的限制定语也是相当不容易的了。此文讨论的是我所处的环境下对JavaScript构建的一些简单探索,因此有相当多的前提限制。

首先,何为大型。从我们的系统来看,20多个业务模块,近100个页面组成的单页系统,对应的业务源码代码量如下:

阅读全部

ESL 发布 2.0

ESL 是一个浏览器端符合AMD的标准加载器,适合用于现代Web浏览器端应用的入口与模块管理。

通过右键另存的方式可以下载ESL:

今天,ESL release 了 2.0.4。到这里本应该完了,不过好像内容少了点。为了凑数,还是多扯几句吧:

阅读全部

玩转AMD - Loader

不用 RequireJS 的理由

理由很简单,因为太大了。RequireJS 经过语法压缩和 GZip 后,体积超过了 6k。RequireJS 最新版本已经降到了 6.1k,在 2012 年底时候的版本是接近 7k。由于下面的一些期望,让我们觉得这个体积比较大:

  • 在移动环境上应用
  • 在 baidu 搜索页面上用

既然这个体积比较大,那多少合适呢。当时我们拍了脑袋,一个 Loader,各种流转与依赖处理,两种 require,URL 查询,再加上异步的插件机制,就算看起来比较复杂,GZip 后 3k 应该没问题。开发时间我们规划了一个月,主要还是为编写测试用例留出一些时间。

后来…后来,事情远远超出了想象。我们开发了 AMD Loader: ESL,包括前前后后的一些改进和 new feature,开发过程持续了一年半多。现在虽然是一个特性稳定版本,但是仍未结束,可预见的未来还有 shim 的支持需要添加。至于体积,我们也没控制住,在每个我们觉得无法或缺的 feature 中,它的体积最终是 3.4k。如果你觉得所有的错误信息你都不需要,那么可以选择 min 版本,体积是 3.1k,超过最初的梦想并不太多。可见男人的承诺多半不靠谱。

阅读全部

玩转AMD - 应用实践

设计思路 篇中,已经对 AMD 在设计上的一些考虑做了比较详细的论述。所以这一篇只会提一些建议,引用一些 设计思路 篇中的结论,不会再详细描述为什么。

本篇提出的所有建议,都是针对于开发时就使用 AMD 的玩法。据我所知,有一些团队在开发时按照 CommonJS 的方式编写模块,通过开发时工具监听文件变化实时编译,上线前通过工具构建,AMD 纯粹被当作模块包装来用。本篇提出的建议不涵盖这种应用场景。

部分建议有一定的重叠,或者理由是相同的。举一反三能力较强的阅读者可能会觉得我很罗嗦,见谅。

阅读全部