性能优化


此页面列出了几个性能优化项,以在使用插件时加快页面加载时间。

使用 CDNJS


jQuery FileUpload 会借助 cdnjs 进行网络分发。cdnjs 由 CloudFlare CDN 提供,是一个开源社区驱动的项目

你只需使用以下方法引用脚本:

<script src="//cdnjs.cloudflare.com/ajax/libs/blueimp-file-upload/9.5.2/jquery.fileupload.min.js"></script>

你也可以引用其他扩展:

<script src="//cdnjs.cloudflare.com/ajax/libs/blueimp-file-upload/9.5.2/jquery.fileupload-process.min.js"></script>

如果你有在使用某个 Web 框架,你可以定义一个辅助函数,以根据你的运行环境从不同的地方加载库文件。下面是一个 Ruby on Rails 的示例:

def blueimp_file_upload_include_tag
  lib = 'blueimp-file-upload/9.5.2/jquery.fileupload.min.js'
  if Rails.env.production?
    javascript_include_tag "//cdnjs.cloudflare.com/ajax/libs/#{lib}"
  else
    javascript_include_tag "/javascripts/libs/#{lib}"
  end
end
译者注:国内的项目就不建议使用 cdnjs 了,分分钟起到反作用。大家可以找找国内免费的 cdn,有条件的可以把脚本放到收费 cdn 服务上最佳。

JavaScript 代码最小化处理


本插件的源代码都不是以最小化格式发布的。

但是,对生产环境而言,我们建议你使用 UglifyJSGoogle 的 Closure Compiler 或类似工具来将你项目中的 js 文件进行代码重组、压缩,使其达到最小化格式。

CSS 代码最小化处理


另一个推荐的工具是 CSSTidyLESS,用于整理和缩小 CSS 源代码至最小化格式。

利用 Google CDN


Google 为通用 Web 库提供了一个可靠的 CDN译者注:谷歌的产品,国内无法访问

越多网站使用这个 CDN ,那越有可能需要访问这些脚本的时候实际上已经被客户端浏览器缓存了。

使用这个 CDN 是很容易的,只需要按以下方式引用库文件(使用协议相对 URL):

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>

本插件的另一个使用 jQuery UI 的分支,也可以使用 Google CDN:

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>

除了 JS 库,Google 还托管了几个 jQuery UI 主题的 CSS 及其搭配的图像文件,例如,“base”主题:

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/themes/base/jquery-ui.css">