Atom

Atom is growing up

Transcript

1. Atom is Growing Up!
2. Atom 阶段回顾 连沁 2013-05-31
3. 强调下模块编写/引用的规范
4. • 模块编写 使用 CMD 模块规范，每个js文件就是一个模块 模块使用 匿名方式 编写 • 模块之间引用 引用 自身的私有模块 ，使用 相对路径 引用 其他的公用模块 ，使用 以htdocs为根目录的绝对路径 禁止引用其他模块的私有模块！！！ • html/vm 引用模块 禁止在非js文件中定义模块！！！ 引用模块只能使用 seajs.use 接口， 禁止使用script标签同步引入！！ 引用模块使用 全路径 ，推荐使用 #stamp 宏包裹，保证时间戳准确
5. 开发中一些常见问题
6. 为什么js里不能使用seajs.use？ • 首先，规范 • 在seajs的模式里面，所有的js文件都是 CMD 模块。 • 而在 CMD 模块中，对模块的引用只能通过 require() 及 require.async() 的方式， seajs.use的用法是 不符合规范 的
7. 为什么js里不能使用seajs.use？ • 其次，性能 • 正常的使用 `seajs.use` 去加载文件，流程如 下 • ... | | - 在 html/vm 里写 seajs.use 去请求模 块（js文件） ====异步===> 模块 ====> 运 行 callback | | - 其他html渲染，script运行等 | ... 除了 atom.js 以外所有的js文件都是 异 步加载 的
8. 看看demo与结果
9. i18n相关 • 设置页面i18n • <script type='text/javascript'> // 页面中越早 调用越好 // 建议在引入 atom.js 之后马上设 置 seajs.setLocale(locale); </script>
10. i18n相关 • 模块里使用i18n • 使用 {locale} 来代替 i18n 中标识语言的部分 • 使用变量代替在 require 中的位置 （该用法是 为了解决独角兽时间戳失效的问题，独角兽端 的修复在7月份解决） • // 时间戳问题修复前，要这么使用 // #require "i18n/en-us.js" // #require "i18n/zh-cn.js" // #require "i18n/zh-tw.js" var i18nStr = './i18n/{locale}.js'; var i18n = require(i18nStr) || {}; // 时间戳问题解决后（2013-07完成），这 么使用 var i18n = require('./i18n/{locale}.js') || {};
11. Combo相关 • 页面上可以在任何地方使用seajs.use，最终 请求会在domReady的时候统一 Combo后 发 出 • 可以使用 seajs.flush() 提前发出请求（一般 用于首屏优化） • url过长的时候会自动拆分成多个 • 做完combo后的页面至少有2个串行的js请 求
12. Q & A