文档章节

几个jquery分发库速度测评

topdogs
 topdogs
发布于 2012/02/29 22:57
字数 911
阅读 336
收藏 0

        jquery 是前端设计中很常用到的一个js库,很多页面都要引用它,那么如何快速的加载这是一个前端优化的问题。

        以jquery1.6为例,min版大概90kb左右,不算大,不过就我之前的对一部分博客进行分析的结果,大部分的页面体积都在50kb以内,那么相比较而言,这个jquery的90kb就不能算小了。如果你的网站速度不错,基本能达到普通用户(这里假设大部分是2M宽带用户)的最大下载速率200kb左右,那么一切没有问题。但是如果你的网站部署在性能一般的虚拟主机上(这样的虚拟主机很多都限制网速),或者部署在外国服务器上,那么你就必须介意网速了。

 

        如何快速加载jquery等常用库呢?使用cdn分发是一个办法。我从网上搜索了一番,发现比较常用且免费的cdn分发js库有4家人,谷歌、新浪、微软、及官方。以jquery1.6为例,他们的网址分别为:

http://code.jquery.com/jquery-1.6.min.js

http://lib.sinaapp.com/js/jquery/1.6/jquery.min.js

http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.min.js

http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js

那么要选哪个好呢,标准很简单,哪个快哪个好。所以下面进行一个测试。

网络评论

        在网上查询了一番,大部分人都对google的服务存在一定担忧,担心不知道哪天就访问不了了,同时对所有国外产品都存在一样的忧虑。于是大家都比较推荐国内的新浪云(lib.sinaapp.com)提供的分发资源。其实我也是这么认为的。不过具体还是得实测一番。

测试环境

         我使用了4个方法进行测试。

  • 利用百度统计的一个功能“网站速度诊断”。
  • 利用单位的10M宽带,本机测试。
  • 利用电信的2M宽带,本机测试。
  • 利用Amazon ec2 东京节点,也就是本博客服务器进行测试。

测试一

        使用百度统计的“网站速度诊断”功能。登录百度统计后台,进入该功能页面,分别输入4个网址,记录得分。

web-speed

结果如下:

 

  谷歌 新浪 微软 官网
电信 0.30 0.31 1.25 0.92
网通 0.22 0.32 0.41 2.40

似乎新浪和谷歌速度都不错。

 

测试二:

        10M移动宽带,本机测试。

        我使用python写了一段非常简单的下载功能,用来测试。代码如下:

import urllib2
import time
urls=[{'name':"jq",'url':"http://code.jquery.com/jquery-1.6.min.js"},
    {'name':"sina",'url':"http://lib.sinaapp.com/js/jquery/1.6/jquery.min.js"},
    {'name':"ms",'url':"http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.min.js"},
    {'name':"google",'url':"http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"}]

for url in urls:
    totalTime=0
    for i in range(5):
        start=time.time()
        urllib2.urlopen(url['url'])
        end=time.time()
        totalTime+=(end-start)
    print url['name'],totalTime/5

运行后的结果为:

jq 4.34320001602
sina 1.08899998665
ms 2.61820001602
google 0.640999984741

谷歌速度第一,新浪第二。

 

测试三:

        东京Amazon ec2 服务器。同样运行上面的python脚本。

运行后结果为:


jq 0.662930107117
sina 0.820287418365
ms 0.174965858459
google 0.18151807785

微软第一,google第二,官网也有不俗表现,国内的新浪悲剧了。

 

测试四:

        2M电信宽带,本机测试。同样执行上面的python语句。

运行后结果为:

jq 0.461800003052
sina 1.87899999619
ms 2.12319998741
google 0.244599962234

谷歌第一,新浪跌至第三。

总结

在排除第三个测试,即只考虑国内环境情况下。谷歌依然是最快的,但是基于保稳定,新浪也是很好的选择。

而国外,大公司是不二选择,微软、谷歌都是优秀的。

© 著作权归作者所有

共有 人打赏支持
topdogs

topdogs

粉丝 41
博文 39
码字总数 12877
作品 2
汕头
高级程序员
私信 提问
为什么推荐使用谷歌加载jquery库文件

建议通过谷歌的CDN-Content Delivery Network(内容分发网络)来让你的网站加载jquery库文件。有的同学可能会问了,为什么要加载谷歌的jquery库文件呢?(PS:我们一般不都是加载自己服务器上...

i33
2012/10/25
0
0
使用谷歌jquery库文件的理由

使用谷歌jquery库文件的理由 最近看到,那些引用jquery的文件那些网站,好多是使用谷歌的库;像这样的<script type=”text/javascript”src=”http://ajax.googleapis.com/ajax/libs/jquery...

天外飘雪
2012/07/18
0
1
介绍几个常用的jquery ui框架

jQuery ui框架很多,除了官方提供的jquery UI,还有很多第三方提供的ui框架,因官方提供的jquery ui框架体积较大,所以很多人都不喜欢用,但不论是官方提供还是第三方提供,他们都是基于jqu...

Junn
2012/12/05
0
2
介绍几个常用的jquery ui框架

jQuery ui框架很多,除了官方提供的jquery UI(如果你还不知道什么是jQuery UI,请看下载了jquery ui后如何使用),还有很多第三方提供的ui框架,因官方提供的jquery ui框架体积较大,所以很多...

一念三千
2012/10/16
0
0
20 个用于处理页面滚动效果的 jQuery 插件

对设计和开发一个网站来说,web开发者不能低估了网站滚动效果的重要性。如今,设计者们都视为一大挑战了,在网站中设计出吸引眼球的高效视觉滚动效果。幸运的是有各种各样的jquery 滚动插件可...

oschina
2013/11/01
43.8K
22

没有更多内容

加载失败,请刷新页面

加载更多

java常用设计模式

设计模式; 一个程序员对设计模式的理解: “不懂”为什么要把很简单的东西搞得那么复杂。后来随着软件开发经验的增加才开始明白我所看到的“复杂”恰恰就是设计模式的精髓所在,我所理解的“...

呵呵哒灬
25分钟前
3
0
Kafka入门

1、Kafka使用背景 在我们大量使用分布式数据库、分布式计算集群的时候,是否会遇到这样的一些问题: 我们想分析下用户行为(pageviews),以便我们设计出更好的广告位 我想对用户的搜索关键词...

watermelon11
昨天
0
0
Cannot list resources Permission denied: user=Administrator, access=READ_EXECUTE, inode="/tmp"

Cannot list resources Permission denied: user=ÁõÎĺÁ, access=READ_EXECUTE, inode="/tmp":root:supergroup:drwx-wx-wx windows系统 Spring boot 整合hadoop时报错。 java.lang.Ille......

lwenhao
昨天
2
0
【结构型】- 享元模式

享元模式 作用:利用共享技术有效地支持大量细粒度对象的复用 享元模式状态 内部状态:在享元对象内部不随外界环境改变而改变的共享部分,存储于享元对象内部 外部状态:随着环境的改变而改变...

ZeroneLove
昨天
3
0
Vue 中使用UEditor富文本编辑器-亲测可用-vue-ueditor-wrap

一、Vue中在使用Vue CLI开发中默认没法使用UEditor 其中UEditor中也存在不少错误,再引用过程中。 但是UEditor相对还是比较好用的一个富文本编辑器。 vue-ueditor-wrap说明 Vue + UEditor + ...

tianma3798
昨天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部