Google_Closure官方教程中文版

Google Closure 教程中文版

概述

Closure 是谷歌开发的一款开源项目,该项目在很多谷歌项目中被广泛使用。现在很多web 项目都用到了Closure。

Web应用程序从最初简单的HTML页面演变成了富客户端的交互式系统,这带来了很好的

用户体验。如今的Web应用程序给开发者带来了新的挑战:如何开发和维护可以快速下

载(到客户端)并兼容不同浏览器的高效的JavaScript代码?

Closure工具帮助开发者开发出强大高效的web 应用程序,Closure工具包含:

JavaScript优化器

Closure编译器可以将JavaScript编译成简洁、高性能的代码。编译器会删除无效的代码然

后重写并精简代码,优化后的代码可以更快的下载和执行。编译器还会检查语法、变量引用、类型并对普通的代码缺陷给出警告,这些检查和优化可以帮你写出bug更少、更好维

护的web应用程序。

全面的JavaScript库

Closure库是一个广泛的、经过严格测试的、模块化的跨浏览器的JavaScript库。你可以从

大量的可重用的组件和控件以及从DOM操作,服务器通信,动画,数据结构,单元测试,富文本编辑器等的底层工具中拖拉你想要的任何东西。

Closure库是服务器无关的,适用于和Closure编译器一起使用。

Closure模板

Closure模板简化了动态生成HTML的任务。它的语法很简单,程序员很容易上手。和传统的模板系统相比,你可以将Closure模板看成很小的组件,然后组装成用户界面,而不是

每个页面都使用一个大的模板。

Closure模板为Java和JavaScript都做了实现,因此你可以在客户端和服务器端使用同样的

模板。在客户端,Closure模板被预编译成高效的JavaScript代码。

JavaScript样式检查和修改

Closure Linter

此你可以专注于编码(而无需关心样式)。

强化的样式表语言

Closure样式表是一个基于标准CSS语言的扩展系统,有了这些扩展,你可以在你的样式表中定义和使用变量,函数,条件句,混合,以增强样式表的可读性和可维护性。一个内置的工具可以将其编译成标准的CSS并支持代码微缩、样式格式化、代码反向(从右向左翻转)和类重命名。

下面详细介绍Closure的这些工具

Closure编译器

概述

什么是Closure编译器?

Closure编译器是一个让JavaScript下载和执行速度更快的工具。它是一个真正的JavaScript 编译器,它可以将JavaScript代码编译成更好的JavaScript代码而不是将源语言编译成机器代码。它解析和分析你的JavaScript代码,删除无效代码,并重写和精简代码,还会检查语法、变量引用、类型并对普通的代码缺陷给出警告。

如何使用Closure编译器

你可以这样使用Closure编译器

一个开源的可以在命令行执行的Java应用程序

一个简单的Web应用程序

一个RESTful的API

你可以按照下面的步骤开始使用Closure编译器:

?

?

?

?

?

?debug

?

使用Closure编译器的好处

?高效:Closure编译器减少JavaScript文件的大小让他们更高效,让你的应用程序加载的更快,减少了带宽的需要。

?代码检查:Closure工具对不合法的JavaScript和潜在的危险的操作提供了警告,减少JavaScript代码的bug,让代码更易于维护。

参考文档

Closure编译界面(UI)

熟悉Closure编译的最简单的方式就是通过Closure编译器优化一个简单的函数。

1.访问下面的网站来进入Closure

2.你可以看见编译界面预置了一个简单的Hello World函数

3.点击“compile”按钮查看编译结果

就是这样!你现在有一个更小版本的功能和之前相同的JavaScript代码。Closure编译器通过删除注释、空格和重命名将代码从92字节减少到了55字节。

为了方便起见,编译器将输出的default.js在其服务器上保存一个小时,你可以在“The code may

also be accessed at {文件名}”的地方找到输出的文件,通过文件上的链接你可以获取到这个文件的URL。如果你在这一个小时之内修改了原始的JavaScript代码并且重新编译,只要你保持注释中

@output_file_name default.js中的文件名不变,编译输入的文件将覆盖原来的文件。有了这个特性,你可以直接将编译过的文件链接到你的测试项目中的文件来更快的测试它。请不要将它链接到项目

正式运行的服务器上(production servers)。

注意:为了防止滥用,Closure编译器限制了连续编译的可运行数量,如果你看见了“Too many compiles performed recently. Try again later”这样的消息,这意味着你暂时超过了使用限制。

你也可以在Closure编译界面优化一个或多个JavaScript文件的代码

1.将URL https://www.360docs.net/doc/c415859649.html,/closure/compiler/samples/tutorial

2.js复制

粘贴到“Add a URL”输入框。这个文件中的未优化过的代码是为了在DOM树中创建一个节点。

2.点击“Add”(如果你有超过一个文件需要添加,重复步骤1和2直到添加完所有的文件,你

也可以直接在输入框里输入文件的名字)。

3.如果你想让编译器编译压缩后的文件,使用@output_file_name 参数来选择输出文件的名字,

注意默认输入的文件名是default.js,你应该把文件名改成更有意义的名字,同时你要记住输出的文件在服务器上只保留一个小时。

4.点击“compile”按钮

你应该在右边的面板中看到优化过的JavaScript代码,就像这样:

要使用优化过的代码,你可以将它剪切粘贴到你的源文件中,下载文件到你的目录中或者直接在