#Building
#building（编译）
If you have followed along previous examples you mayhave looked up how the internals looked like in [Firebug](http://getfirebug.com/) orWebkit Developer Tools. What you see there in the Resources tab may have notmade you happy. Even the Hello World example loads in lot of differentJavascript files and their total size is huge. Not quite the way [YSlow](http://developer.yahoo.com/yslow/)or [Google Page Speed](http://code.google.com/speed/page-speed/) have told how itshould be done and a nightmare to distribute.
如果你调试过之前的例子，你也许会在firebug或者开发人员工具里找到让你不愉快的东西。即便是hello world这样的例子，也会加载打量不同的JS文件，且总大小十分可观。YSlow和Goolge Page Speed这样的测评工具并不会提供一个好的方式来让你摆脱这一噩梦（也许你并不想暴露自己的源码）。
Fortunately there is a solution named*Closure Compiler* and it was already downloaded when you first ran the initscript. You should never distribute the development files(unless for opensource reasons). Once you have completed your project simply run the *lime.py*helper script with *build* command. This will combine all Javascript codeneeded for your project into a single file. To start this file you use the sameHTML file you had before with an exception that you don't need to includeClosure Library's base.js any more.
幸运的是，在我们调用init的时候，一个叫做closure compiler的神器已经被下载到本地。你也许不想暴露源码（除非出于开源的原因）。一点你对lime.py执行build命令，所有JS代码会被压缩成一个文件。你可以使用同一个HTML文件加载这个文件，除此之外，你也不需要包含closure库的base.js了。
The build command takes in base namespace ofthe code that you need to compile. This namespace needs to be defined with`goog.provide()` in the entrypoint of you projects code. With `-o` parameteryou can define the path where the compiled version should be written(defaultsto *stdout*).
build指令根据代码的命名空间来执行。命名空间需要通过goog.provide()在代码开始端定义。使用-o参数你可以定义压缩后的js文件的位置（默认在stdout）。
#!Bash
bin/lime.py build helloworld -o helloworld/compiled/hw.js
## Advanced optimizations mode
## 进阶优化
Though default build process strips out allwhitespace, replaces local variable names and does much more, the compressionrate can be taken to much higher level. If you enable advanced optimizationsadditional optimizations like property name replacing for all variables andredundant code removal will also take place. Your final code will be muchsmaller, but there are some extra requirements that you must stick to if youwish to use this mode. For example you can't use property names inconsistently(with dot notation in some places and string notation in other) and must*jsdoc* the *@this* object type in static functions. More on that [here](http://code.google.com/closure/compiler/docs/api-tutorial3.html).To enable advanced optimizations you simple add `-a` to the build command.
虽然编译的过程去除了代码中所有的空白，替换本地变量名并且还做了很多，压缩比其实还可以进一步的提升。如果你启用了高级优化参数，譬如属性名称替换，你的最终代码还会更小，但是如果你这样做的话就会有额外的要求。例如，你不能使用不一致的属性名称（一些地方包含“.”指示符，另一些又不包含）（stefan：我勒个去，话说我翻译这里的时候差点没崩溃，最后查阅资料才明白。我举个例子给大家，比如对于a对象的b属性。你要么一直使用a.b的方式，要么一直使用a[“b”]的方式，切不可杂糅在一起！），还必须在静态方法中用jsdoc注释@this对象类型（stefan：这句翻译得更蛋疼。撇开jdoc不说，closure的压缩器是不支持你在静态方法里使用this的。啥？你不知道啥是静态方法？静态方法是直接定义在类上的方法。例如：“functiona(){}; a.b=function(){};”这里的b就是类a的静态方法。如果里面出现了this<我知道你是想指代a类>，但是不好意思，closure会认为这个this是指向全局的。那么closure就会在压缩时报错！另外，jsdoc里的一些注释在和closure的compiler使用时也要注意，例如这个：https://groups.google.com/group/closure-compiler-discuss/browse_thread/thread/da5a11410c38c627。PS:一直认为用jsdoc做注释比起编写代码来讲还要麻烦，什么lends啊云云的……算了，不提这茬了）。你可以从http://code.google.com/closure/compiler/docs/api-tutorial3.html获取更多信息。启用优化你只需要添加-a参数到编译命令之后。
#!Bash
bin/lime.py build helloworld -o helloworld/compiled/hw_adv.js -a
To further optimize the compiled version itis encouraged that you compress it with `gzip`. [Read more](http://code.google.com/speed/pag ... tml#GzipCompression)
进一步的优化压缩后的版本，我们推荐你使用gzip，资料地址在上面的英文里，老衲就不粘了。
## Exports
## exports（导出）
As said before advanced optimizations mode replacesall variable names. This means there are no way to interact with you compiledcode from some external code(for example onload handler in your HTML file). Todeal with that you can define externs and exports from your code. Extern meansthat this variable/propery will not be renamed so you can fully interact withit from any external code. Export means variable will be renamed but a link tothe new variable will be created with original name. In 99% of places you willonly need export and save lot of space this way.
既然通过上述方法压缩了代码。那么就会找不到方法从外部和压缩后的代码交互，例如在HTML文件里的onload事件调用js的处理函数（鬼知道函数名被改成什么样子了！）为了处理这种情况，你可以为你的代码定义extern和export。Extern的意思是指定的变量和属性不会被改名，因此你可以在外部与其交互。Export的意思是，虽然变量被重命名，但是会有一个新的变量会和它链接起来，且名字和原始变量一致。百分之九十九的情况，你指挥采用export方法来节省空间（stefan：的确，如果原始文件里包含一万个beautiful变量，我相信，还是让它们当一万个“b”更美些！）。
#!JavaScript
goog.exportSymbol('helloworld.start', helloworld.start);
## Debugging
## 调试
Sometimes you may find out that you have made amistake following the advanced optimizations guidelines and your compiledversion doesn't run any more though your development version worked fine.Common debugging techniques can't be applied here as the compressed file iscompletely unreadable. The solution is to compile with a `-m/--map` option.This way compiler makes a function map file that binds a compressed function tothe position of the uncompressed function in original source. To use the mapyou have to download Closure Inspector that is a addon for Firebug. Now Firebugcan show you the place in the original source where the error happened. [Readmore](http://code.google.com/closure/compiler/docs/inspector.html)
有些情况下，你会发现当高级优化失败时，你的压缩代码不能用了，即便原始代码工作正常。普通的调试技术在这里无计可施，因为代码被压缩过了。解决办法是压缩是带着-m/--map参数，这样的话，压缩工具会制作一个压缩函数和被压缩函数的对应关系。有了这个对应关系，你还得下载closure查看器（firebug的一个插件），这样firebug就会为你显示对应的原始代码出错的地方。参考链接见上面的英文，stefan就不给大家贴了。
#!Bash
bin/lime.py build helloworld -o helloworld/compiled/hw_adv.js -a-m helloworld/complied/debug_map.txt
## Preloader/Offline support
## 预加载/离线支持
*Preloader support is currenlty very limited.Much more functionality will be added in the future.*
预加载现如今支持的还不够，更多的功能将在未来被添加进来。
Having a single Javascript file makes your game easyto distribute but the Javascript file and all the assets you wish to use stillneed to be loaded every time the game is accessed. To make the experiencebetter for the player you can compile your game with preloader file. Thispreloader file use modern browsers offline support capabilities and downloadsall files you need before starting the game. Even better, next time the game isplayed it starts much quicker because it is loaded from users hard drive. Ifthe game is updated, preloader will first download the updated files and thenstart your game. Offline access is specially important on iOS devices where itallows people to play your webapp game even when they are not connected to theinternet.
只有一个js文件的确让你的游戏更容易发布，但是所有的素材还是需要在访问游戏时加载。为了让玩家有更好的体验，你需要为你的游戏制作一个预加载文件。预加载文件采用现代浏览器的离线支持功能，在启动游戏前下载所有需要的文件。下一次启动游戏时，速度会非常快，因为所有资源都保存到了本地。如果游戏更新，预加载器会下载更新文件，然后开始游戏。离线访问对于iOS来说十分重要，它允许用户在没有链接网络的情况下玩web游戏。
You can build your game with preloader by specifying`-p` option and a callback that starts your game. This callback is the sameJavascript function name that you would usually use in the onload handler ofyour development version.
你可以为你的游戏提供预加载机制，只要指定-p参数和用于启动游戏回调函数即可。这个回调函数和你经常在onload事件中使用的监听函数的名称通常一致。
#!Bash
bin/lime.py build helloworld -o helloworld/compiled/hw_adv.js -a-p helloworld.start
Here are some rules on working with[*.manifest](http://www.w3.org/TR/html5/offline.html#manifests) file thepreloader build creates:
* Manifest file needs to be served as*text/cache-manifest* from your webserver. [Tutorial](http://www.thecssninja.com/javas ... bapps-on-the-iphone)
* If you use your game specificassets(images etc.) you need to list them in the manifest manually
* If you change some of the files in themanifest(without running build again) you also have to change the manifestfile. Simplest is to just update the generation time. 这里有一些使用.manifest（预加载）文件时的规则：
* web服务器要以“text/cache-manifest”的方式支持manifest文件。[教程](http://www.thecssninja.com/javas ...bapps-on-the-iphone)
* I如果你使用游戏指定的素材，你需要人工在manifest里列出它们。
* 如果你改变了manifest里的一些文件（没有重新执行编译），你还是需要改动manifest文件。最简便的方法就是更新它的生成时间。 [注意：翻译部分为17html5.com版权所有，任何转载必须注明文章出处和链接地址以及作者，否则视为侵权，将追究法律责任！] 终于翻译完了，我的world文档已经快到30页了。但是还是小case。大家也许会认为我每章翻译后面的声明很扎眼，但是没办法，咱吃过亏，learning ExtJS就是个例子。stefan在这里谢谢大家。另外，在这里说一下，我的小说《蜗租》近日出版了，大家有钱的捧个钱场，没钱的也帮着顶顶。这样stefan（小岂/小岂子）工作起来会更卖力的！：）
| 
