Google AJAX Libraries API 公开的JS库
柯瀚海
2023-12-01
去年曾经介绍过另一个公开的 JavaScript Library 储存库:cachefile.net,本站的范例区也用了不少该站所提供的资源,包括 JavaScript 及小图示。而这次要介绍的这个储存库也是相当令人期待,因為是 Google 所提供的,相信稳定性和速度上都有更好的表现。
Google AJAX Libraries API 简单的来说呢,就是 Google 透过他们的主机来提供你 JavaScript Library (或是 AJAX Library) 的档案,最直接的好处之一就是,当网站的使用者瀏览到的不同网站是採用 Google 所提供的档案,就不需要再重复下载。举例来说,很多网站都使用了 jQuery,如果档案都是放在各个网站,当使用者瀏览时,虽然都是相同的档案,还是必须要个别重新下载。如果这些网站都改採用 Google 所提供的 jQuery,则使用者第一次瀏览到某个网站时,会下载并且 cache 在电脑内,当使用者去到另一个网站也是使用到 Google 所提供的 jQuery,则不需要再重复下载。换言之就是可以加快网页的呈现速度,这就是公开的档案储存库的优点之一。
当然 Google 所提供的不只这样,以下来看看 Google AJAX Libraries API 的优点:
Cache - 已针对主机做了正确的设定,下载过一次之后,档案会 Cache 在使用者的电脑
Gzip - 如果使用者的瀏览器支援 Gzip 压缩,则 Google 就会送出压缩过的资料,减少传输量
有提供最小化的版本,也就是 JavaScript 内的空白、换行、程式变数都经过处理,让档案最小化
Google 有自家的 CDN (内容散佈网路),会由最接近使用者的主机送出档案,让传输速度加快
主机都很快
使用者在不同网站之间瀏览也不需重复下载相同的档案
传送档案时不会传送多餘的 header 资讯,例如 cookie,这样可以减少传输量,省下珍贵的频宽
那麼既然是提供档案储存的空间,為甚麼不是叫做 Google AJAX Libraries Storage,而是叫做 Google AJAX Libraries API 呢?
事实上,Google 确实是透过一个简单的 API 来提供档案的,而这个 API 目前最主要的目的是让你可以轻易地选择你要使用的档案版本,例如某个特定的版本或者是最新的版本。使用方式有两种,比较直觉的方式是直接指定完整路径的引用,原本使用自己主机上的档案改成為 Google 所提供的档案,例如我要 jQuery 1.2.6 的版本,就这样引用:
view plaincopy to clipboardprint?
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
第二种方式是使用 Google AJAX API Loader 的 google.load() 来把档案读进来,以下这个范例是使用 google.load() 来载入 jQuery 并且在网页载入完成后使用 jQuery 的 get() 读取远端的档案:
view plaincopy to clipboardprint?
<script src="http://www.google.com/jsapi"></script>
<script>
// 载入 jQuery
google.load("jquery", "1");
// 网页载入完成后,使用 jQuery 函数
google.setOnLoadCallback(function() {
$.get("http://jsgears.com/index.php",
function (data) {
// 处理取得的 data
});
});
</script>
<script src="http://www.google.com/jsapi"></script> <script> // 载入 jQuery google.load("jquery", "1"); // 网页载入完成后,使用 jQuery 函数 google.setOnLoadCallback(function() { $.get("http://jsgears.com/index.php", function (data) { // 处理取得的 data }); }); </script>
google.load() 的第一个参数是 library 的名称,目前支援的 libraries 包含了:
jquery
prototype
scriptaculous
mootools
dojo
第二参数则是指定版本,版本的指定方式很灵活,假设版本有 1.8.2、1.8.4 以及 1.9.1 三种,你可以指定 1.8.2 明确地表示要使用 1.8.2 这个版本,也可以指定 1.8 表示要使用 1.8.x 的最新版,也就是 1.8.4,甚至你也可以指定 1 表示使用 1.x 的最新版,即為 1.9.1。这种版本的指定方式也适用於指定完整路径的引用方式,例如:
view plaincopy to clipboardprint?
<!-- 版本只给 1 表示使用 1.x 的最新版 -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<!-- 版本只给 1 表示使用 1.x 的最新版 --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
此外,预设送出来的档案都是最小化的版本,如果你需要原始编排整齐可读的程式码,可以这样做:
view plaincopy to clipboardprint?
google.load("jquery", "1.2", {uncompressed:true});
google.load("jquery", "1.2", {uncompressed:true});
目前 Google AJAX Libraries API 所提供的档案相对的是比较少,但是速度和稳定性却是相对的比较高,未来可预期的是还会有更多的 library 加入到 Google AJAX Libraries,这对网站开发者而言应该是个好消息。对於 Google 这样的美意,大家不妨善加利用~
PS1. 完整的文件:http://code.google.com/apis/ajaxlibs/documentation/
PS2. 目前 AOL 也有提供 Dojo,在这裡:http://dev.aol.com/dojo
PS3. Yahoo 也用自家的 CDN 提供 YUI,在这裡:http://developer.yahoo.com/yui/articles/hosting/
官网为:http://code.google.com/intl/zh-CN/apis/ajaxlibs/