易栈网-膘叔

浏览模式: 标准 | 列表 | 图文
转:jQuery1.5的改进细节

转:jQuery1.5的改进细节

jQuery 1.5beta出来了?看到这篇博客的时候,我很惊讶,1.4开始,jQuery的更新速度就越来越快了。现在,居然1.5beta都同来了。文中说了,ajax完全重写,但没介绍,不过对于使用者来说,这些都无需关心,或者应该开心才是,因为它带来了更多的兼容性,说不定速度也更快了。(猜测而已,最近实在没时间 看这些代码)

下面是原文:

jQuery 1.5 beta1出来了,从学习跟进上来说,这一次已经比较晚了(我竟然不知道1.5什么时候出的alpha,就这么beta了)。

这个1.5版本最大的更新是AJAX的完全重写,提供了更强的可扩展性。但是受制于精力和篇幅,对新的AJAX的分析还是放到下回,本篇先简单介绍一下细节方面的改进。

jQuery._Deferred和jQuery.Deferred

首先不得不说这两个新生事物,因为他们是作为基础设施存在,不把这两个东西讲明白了,有些问题根本没办法解释。

首先,jQuery.Deferred是jQuery._Deferred的增强版,因此对于这个问题,从jQuery._Deferred入手,就能说明一大半的问题。

什么是Deferred?从字面上看,我的第一反应是“延迟加载”,首字母大写的应该是“类型”的定义,所以这大概是一个“透明提供延迟加载功能”的类型吧。然而实际上,虽然确实带有那么一点点“延迟”的意思,这个东西却不是用来实现延迟加载的。

简单来说,jQuery._Deferred是一个函数队列,他的作用有以下几点:

  • 保存若干个函数。
  • 在特定的时刻把保存着的函数全部执行掉。
  • 执行过后,新进来的函数会立刻执行。

感觉是不是和啥东西很像?对,jQuery的ready函数就是这样的逻辑,实际中jQuery 1.5中的ready函数也确实被嫁接到这上面去了。

jQuery._Deferred提供下面的接口:

  • done:function(fn1, fn2, ...)的形式,用于把函数添加到队列中。
  • fire:function(context, args)的形式,使用context指定this对象,args指定参数,调用队列中所有函数。fire被调用后,_Deferred会进入 isResolved状态,未来对done的调用不会再保存函数,而是直接调用函数。
  • resolve:相当于调用fire(this, arguments),一个简化的方法。
  • isResolved:用来判断_Deferred是否在isResolved状态,具体参考前面的fire函数的解释。
  • cancel:取消掉整个队列,这样不管未来是不是fire,队列中的函数都不会再被调用。

说明白了jQuery._Deferred,再来看看jQuery.Deferred。这个东西其实就是2个_Deferred组成的,第一个称为 deferred,用于保管“正常”状态下的函数;第二个称为failDeferred,用于保管“出错”状态下的函数。同时 jQuery.Deferred提供了一些新的接口:

  • then:function(done, fail)的形式,把done添加进deferred,把fail添加进failedDeferred。
  • fail:相当于failDeferred的done函数。
  • fireReject:相当于failDeferred的fire函数。
  • reject:相当于failDeferred的resolve函数。
  • isRejected:相当于failDeferred的isResolved函数。

同时jQuery.Deferred取消了cancel函数。

那么这个是啥用的呢?有“正常”和“出错”2个状态,同时又是异步的,很容易就能想到……对,给AJAX用的,在下一篇分析中再详细说明。

jQuery.ready的变化

因为有了jQuery._Deferred这个东西,jQuery.ready函数变成依赖于函数队列,具体的变化有:

原来的readyList变量已经不再是一个数组,而变成了jQuery._Deferred对象。

原本在DOMContentLoaded时,调用readList中所有函数的逻辑,现在也使用了jQuery._Deferred中,原来的代码:

while ( (fn = ready[ i++ ]) ) {
fn.call( document, jQuery );
}

变成了:

readyList.fire( document , [ jQuery ] );

jQuery.parseXML函数

新增了静态函数jQuery.parseXML,用于提供浏览器兼容的从字符串转为XML文档的功能。

该函数的逻辑网上有很多,jQuery也没有特别的地方,大致分为以下2种:

  • 对于标准浏览器,使用DOMParser对象:

    var parser = new DOMParser();
    var xml = parser.parseFromString(text, 'text/html');
  • 对于IE,使用Microsoft.XMLDOM对象:

    var parser = new ActiveXObject('Microsoft.XMLDOM');
    parser.async = 'false';
    parser.loadXML(text);
    var xml = parser.documentElement;

data部分

添加了jQuery.hasData函数,用于判断一个元素是否有jQuery附加上去的数据。

修改了jQuery.expando的实现,在原来单纯地取当前时间的基础上,添加了一个随机数:

expando = "jQuery" + ( jQuery.fn.jquery + Math.random() ).replace( /\D/g, "" );

这样保证在同一时间,引入多个jQuery副本,这几个副本之间的expando不会相互冲突,导致元素上的data变得错乱。一般来说,是不会引入多个jQuery副本的,但是使用SealJS等的时候,配置不当的话,也是很容易出现此类问题的。

DOM操作部分

原本的hasClass、addClass、removeClass函数都需要将元素的class属性分隔为数组,在1.4.4版本中,通过\n或\t进行分隔,在1.5中增加了一个\r,用于对应Windows平台下的换行符(\r\n)。

jQuery.fn.attr函数,1.4.4版本中拒绝从TextNode和CommentNode上获取属性,在1.5版本中添加了一个AttributeNode(noteType == 2)。

在1.4.4版本中,jQuery会在页面unload的时候清理掉由jQuery维护的所有DOM事件,这是为了避免IE的内存泄露问题。但是在1.5中这一段代码不见了,不知是出于什么考虑。

对于IE下使用cloneNode复制节点,会将事件也一起复制过来的问题,1.4.4中是采取复制innerHTML的方式给予解决,而在1.5中则采纳了mootools团队提供的方法,使用cloneFixAttribute函数修正该问题。

cloneFixAttribute函数们于jQuery 1.5 beta1源码文件的5388-5438行,处理IE的BUG的原理很简单,当然前端里一些看似简单的东西,都是很难发现的:

  1. IE中有个叫clearAttributes的函数,会清除到节点上的所有属性,顺便把和事件相关的onclick之类的属性也去掉了。在复制出来的节点上调用这个函数,就会把属性清得干干净净。
  2. IE中还有一个叫mergeAttributes的函数,把一个节点的属性复制到另一个节点上,但他不会把和事件相关的属性复制过去。所以再把原始节点调用mergeAttributes,把属性重新放回复制出来的节点上,这就相当于起到了去除事件相关属性的作用。

另外cloneFixAttribute函数还处理了非常多IE6-8在cloneNode上的兼容性问题,非常值得详细研究。

AJAX部分

AJAX已经完全重写了,只留下一点边边角角保留着1.4.4版本的风采,这里只抽取一部分进行简单的说明。

原来版本中$.get和$.post的实现非常相似,具体来说仅有一个method配置项不同,因此在1.5版本中被合并起来了:

$.each(['get', 'post'], function(i, method) {
$[method] = function() { ... };
});

ajaxSetup函数现在加了一行return this;,可以链式调用了。

serializeArray函数现在统一将value中的换行符替换成Windows的风格(\r\n)。

AJAX的回调函数中,作为参数的对象不再是原生的XMLHTTPRequest,而是jQuery自己封装的称为jXHR的对象,这个对象提供了XMLHTTPRequest的常用接口。

原本对于“请求成功”的浏览器状态码,除200-299以及304外,还有一个1223,来自于IE的一个BUG,会将204的状态码变成 1223。现在因为有了jXHR对象,相当于中间多了一层,因此从jXHR对象获取statusCode不会出现1223的情况,已经被变回204了。

jQuery.ajax函数的配置项中多了一个statusCode项,其结构为map,用于指定返回特定状态码时的回调函数,大致形式如下:

jQuery.ajax({
url: 'xxx',
statusCode: {
200: function() { 处理请求成功 },
404: function() { 处理页面未找到 },
503: function() { 处理Service Unavailable }
}
});

再添加了这个回调后,jQuery.ajax函数已经有非常多的回调函数,其触发过程如下:

  1. 根据返回的状态码,触发success或者error回调。
  2. 根据状态码,触发对应的statusCode回调。
  3. 触发complete回调。
  4. 触发全局ajaxComplete回调。
  5. 如果此时没有正在执行的AJAX,触发全局ajaxStop回调。

其他细节

入口函数jQuery.fn.init现在多了一个参数,值始终为rootjQuery,用于加速init函数中对rootjQuery变量的查找速度(减少了一层作用域):

//jQuery 1.5 beta1 源码23行
jQuery = function( selector, context ) {
// The jQuery object is actually just the init constructor 'enhanced'
return new jQuery.fn.init( selector, context, rootjQuery );
}

jQuery对象支持继承了,具体的修改是将几处直接调用jQuery的代码改为了对this.constructor的调用:

202行:return this.constructor( context ).find( selector );
253行:var ret = this.constructor();
334行:return this.prevObject || this.constructor(null);

同时还提供了jQuery.subclass函数用于创建一个继承自jQuery的类型,由于不是很常用jQuery,更是从来没有用到过需要继承jQuery的情况,因此也不方便说这个功能的作用有多大。

原文来自:http://www.cnblogs.com/GrayZhang/archive/2011/01/18/jquery-1-5-enhanced-detail.html

Yii ClinkPager 郁闷

开发的时候,分页用了CLinkPager,然而在某一个页面的时候,page一直在变,但是下面的分类中的当前页永远在1上,不随着页码的变化而变化。
开始的时候以为是分页程序有问题,仔细对应了一下,发现分页的数据是正确的。
排查了半个多小时,突然想起,会不会$_GET['page']被unset了?
找了一下页面,最后在模版页里居然真的发现了unset($_GET['page']),当时我就傻眼了。
顺便再上一个option的onchange切换函数。很烂,只求先解决问题。。。。

function urlchange(field,value) {
var href= location.href;
var regex = new RegExp(field+"=[\-|0-9]{0,}");
if(href.indexOf(field)!=-1){
location.href = href.replace(regex,field+"="+value);
}else{
location.href = href + "&"+field+"="+value;
}
}

用法就是<select onchange="urlchange('page',this.value)"><option value='1'>第一页</option><option value='2'>第二页</option><option value='10'>第十页</option></select>

YUI PHP Loader Utility

YUI PHP Loader Utility

YUI是一个低调又强大的框架。你不能说它有什么,但它确实就存在着。。。
jQuery是Yii框架自带的一个工具,比如ZII里集成的全是JQuery,但YUI也是有着自己的工具,比如这个YUI PHP Load Ulility

The YUI PHP Loader Utility is a server-side utility that allows you to load specific YUI components and their dependencies into your page via PHP. YUI PHP Loader can operate as a holistic solution by loading all of your necessary YUI components, or it can be used to add one or more components to a page on which some YUI content already exists.

YUI also contains a client-side loader, which provides similar functionality from JavaScript.

YUI PHP Loader adds value in the following ways:

  1. Reliable, sorted loading of dependencies: YUI comprises more than two-dozen components, many of which work together to provide the best possible compromise between compartmentalization and code reuse. Because of this, YUI components often need to load with specific dependencies in a specific order. YUI PHP Loader understands which components depend on one another, and based on this knowledge it ensures that the right resources are loaded in the right order.
  2. Automatic use of rolled-up files. YUI PHP Loader knows about all of the built-in rollup files that ship with YUI — like the yahoo-dom-event.js file that contains the Yahoo Global Object, the Dom Collection, and the Event Utility, three components that are commonly used together. By automatically using rolled-up files when it makes sense to do so, the YUI PHP Loader helps you reduce HTTP requests and thereby keep your page as efficient as possible.

As you think about how you want to load YUI on the page, you may find it useful to refer to this overview of some of the most common loading strategies and their relative merits:

YUI的CSS其实也不错,现在细想想如果不是当年YAHOO那么强势的推PHP,如今的PHP也不会被这么多公司所能够接受吧。google是在强推python,虽然现在有着go语言,但python也正在被越来越多的公司所接受了,比如它的兼容性,它的运行速度。。。我还是比较喜欢的。。。。。。

有意思

今天这个标题是有意思,当然它也有一定的含义。
1、几年前,有几个人发现上海有一家餐饮店叫有意思,觉得不错,回老家开了个餐饮店,现在连锁也三四家,但好象每次开分店都换名字了。这个店名最初就叫:有意思
2、很多时间,很多东西,都非常有意思,比如这个图片:


3、有些事情也很有意思,比如apache基金会要退出java委员会之类的。

12月13日消息,据国外媒体报道,甲骨文近日表示,希望阿帕奇软件基金会(Apache Software Foundation)重新考虑其退出Java SE/EE执行委员会的决定,并且还对阿帕奇软件基金会对于Java未来发展的重要性给予了肯定。

据悉,阿帕奇软件基金会曾在本周三宣布退出Java执行委员会。该基金会表示,退出Java 执行委员会的原因在于甲骨文对Java进行了过多的控制。阿帕奇软件基金会在一篇博客文章中表示:甲骨文主要关注商业利益的行为将会继续严重地干涉并且危害着Java生态系统的透明管理。”

另外,阿帕奇软件基金会还为甲骨文对Java技术兼容套件(Technology Compatibility Kit, TCK)制定的应用领域(FOU)规定而“感到”烦恼,因为甲骨文的规定导致ASF自行开发的Java虚拟机器Harmony无法从移动平台上获得开源软体应有的授权。

另悉,甲骨文软件业务副总裁亚当·梅辛格(Adam Messinger)曾在周四晚些时候向阿帕奇软件基金会表达了愿意和解的态度。梅辛格表示:“甲骨文曾在上个月再次提名阿帕奇软件基金会进入Java执行委员会,因为我们认可他们对Java的的积极参与及其态度。

甲骨文有推动Java向前发展并且为数百万Java开发者提供统一Java标准的责任,并且很多执行委员会的委员们也表示同意这些标准。我们鼓励阿帕奇软件基金会重新考虑其所处的‘位置’,该基金会仍是继续推动Java发展的一个组成部分。阿帕奇软件基金会及其赞助的许多开源项目是Java生态系统的一个重要部分。”

不过从目前形势来看,阿帕奇软件基金会并不急于重新加入Java执行委员会。

4、最后再来一个疑问,ns1.dns.com.cn,我指了个域名。居然2个月不能正常访问了。我都没有注意过,看来以后不能用这类网站了,难道是因为域名是.cn的?可是这个域名也申请过备案、同时也上传过注册信息,也有个人资料上传等,可为什么就偏偏 不能访问了呢?真奇怪呀。

公司年夜饭

公司年夜饭

额,传说中的尾牙,多吃一点多吃一点。。。
不知道能不能抽中奖啊。眼精快绿了。。。。

鸡头要不要对着我呢?很是纳闷啊。。。。。

看情况,如果有盛况就手机上来发发微勃,没盛况嘛 ,吃好回家洗洗睡。

一年就这样过去了。

PS:一个奖项都没有中到郁闷啊。。。

Yii Rewrite中遇到的困惑

Yii Rewrite中遇到的困惑

用Yii开发的时候,总是会有涉及到rewrite,否则,网址里一堆 index.php?r=xxxx那就真的太长了。

关于rewrite,可以参考官方的guide,不过上面只有针对apache的htaccess配置。如果是nginx,你还可以搜索一下官方的wiki,有介绍nginx的配置的。只是官方上面用的方法是try_file,只针对高版本的。如果是低版本还是得用 if (!e $request_filename)这类的【更多设置请搜索google】我这里不详细说了。

今天在用官方推出的这一种rewrite功能【Parameterizing Hostnames 】的时候,出了点问题,该功能是:

Parameterizing Hostnames

Starting from version 1.0.11, it is also possible to include hostname into the rules for parsing and creating URLs. One may extract part of the hostname to be a GET parameter. For example, the URL http://admin.example.com/en/profile may be parsed into GET parameters user=admin and lang=en. On the other hand, rules with hostname may also be used to create URLs with paratermized hostnames.

In order to use parameterized hostnames, simply declare URL rules with host info, e.g.:

array(
'http://<user:\w+>.example.com/<lang:\w+>/profile' => 'user/profile',
)

The above example says that the first segment in the hostname should be treated as user parameter while the first segment in the path info should be lang parameter. The rule corresponds to the user/profile route.

Note that CUrlManager::showScriptName will not take effect when a URL is being created using a rule with parameterized hostname.

Also note that the rule with parameterized hostname should NOT contain the sub-folder if the application is under a sub-folder of the Web root. For example, if the application is under http://www.example.com/sandbox/blog, then we should still use the same URL rule as described above without the sub-folder sandbox/blog.

我在rules里写上了 "http://user.xxx.com/<_c:\w+>/<_a:\w+>"=>"user/<_c>/<_a>/"

然后发现访问 http://user.xxx.com/aaa/bbb/id/1的时候出现了404错误,找问题死活找不到在哪里。再转过头去看了很多其他的配置,发现都不正常。

然后,我尝试访问默认页,即没有参数的:http://user.xxx.com/default/index,咦,居然正常了。。但问题随之而来,其他链接都不正常,经过不停的测试测试再测试。最终发现,把""user/<_c>/<_a>/" 中最后一个 / 去掉就正常了。

那么,'<_m:\w+>/<_c:\w+>/<_a:\w+>' => '<_m>/<_c>/<_a>/' 和 '<_m:\w+>/<_c:\w+>/<_a:\w+>' => '<_m>/<_c>/<_a>' 的区别是什么呢?

仔细看了一下生成的链接,如果用第二种的时候,如果有多个参数,就转为 m/c/a?a=b&c=d 而如果用第一种就是生成 m/c/a/a/b/c/d 。这时候,系统可能会识别不出我这种用二级域名做rewrite的方式。于是,我去掉了最后一个“/”,一切都正常了。

期间,HM和Horadric.Cube多次对我帮助,告诉我不同的nginx参数的配置。灰常感谢。

Creating a absolute path from a relative URL

Creating a absolute path from a relative URL

上午hihiyou问我,如何把“http://www.ss126.com/shop/../../bigimg/../bigimg/china-ef.com_200951117215473416.jpg”转换成实际路径的时候,我写了一个简单的方法:

$url = 'http://www.ss126.com/shop/../../bigimg/../bigimg/china-ef.com_200951117215473416.jpg';

$pathinfo = array(
'path'=>'???',//相当于项目的根目录
'url'=> 'http://www.ss126.com/'
);

$url = realpath(str_replace($pathinfo['url'],$pathinfo['path'],$url)); //获取实际路径
//然后
if(strpos($url,$pathinfo['path'])!==false){//防止路径乱掉,或者进入其他目录
$url = str_replace($pathinfo['path'],$pathinfo['info'],$url);
}else{
$url = $pathinfo['url'];
}

结果,他告诉我,不是本地程序。然后找了这样的代码 。。。

<?php

$url = "http://www.goat.com/money/dave.html";
$rel = "../images/cheese.jpg";

$com = InternetCombineURL($url,$rel);

// Returns http://www.goat.com/images/cheese.jpg

function InternetCombineUrl($absolute, $relative) {
$p = parse_url($relative);
if($p["scheme"])return $relative;

extract(parse_url($absolute));

$path = dirname($path);

if($relative{0} == '/') {
$cparts = array_filter(explode("/", $relative));
}
else {
$aparts = array_filter(explode("/", $path));
$rparts = array_filter(explode("/", $relative));
$cparts = array_merge($aparts, $rparts);
foreach($cparts as $i => $part) {
if($part == '.') {
$cparts[$i] = null;
}
if($part == '..') {
$cparts[$i - 1] = null;
$cparts[$i] = null;
}
}
$cparts = array_filter($cparts);
}
$path = implode("/", $cparts);
$url = "";
if($scheme) {
$url = "$scheme://";
}
if($user) {
$url .= "$user";
if($pass) {
$url .= ":$pass";
}
$url .= "@";
}
if($host) {
$url .= "$host/";
}
$url .= $path;
return $url;
}

?>

好吧。我承认,上面这个更方便一点。

Python学习资源

Python学习资源

学习Python的时候,还是翻了一些资料,也看到了一些资源。收集着,以后慢慢看。

http://woodpecker.org.cn/abyteofpython_cn/chinese/index.html
嗯,http://woodpecker.org.cn/,这个网上有很多Python的资源哦。
然后在这个网站还有这些链接哦

都挺不错。也几乎点开看了。。相对于这个,我其实更喜欢这样的CHM文件,

这两个链接里,可是有CHM文件下载的哦。

转:PHP工程师面临的成长瓶颈

转:PHP工程师面临的成长瓶颈

不说太多的东西,做PHP做到后面,剩下的就不是代码问题了。而是对系统有多么深入的了解以及更多的架构问题,工匠和大师的区别在于,工匠只能、只会砌房子,而大师在砌房子 时候会思考。当然我只是一个工匠,说的难听一点就是代码编写员,再难听一点叫做埋雷手。

嗯,这是一篇关于PHPer未来成长热趋势的文章,它来自于PHP工程师面临的成长瓶颈:很不错。可以看看,内容如下:

  作为开发中应用最广泛的语言之一,PHP有着大量的粉丝,那么你是一名优秀的程序员吗?在进行自我修炼的同时,你是否想过面对各种各样的问题,我该如何突破自身的瓶颈,以便更好的发展呢?
PHP工程师面临成长瓶颈

  先明确这里所指的PHP工程师,是指主要以PHP进行Web系统的开发,没有使用其的语言工作过。工作经验大概在3~4年,普通的Web系统(百万级访问,千成级数据以内或业务逻辑不是特别复杂)开发起基本得心应手,没有什么问题。但他们会这样的物点:

  ◆除了PHP不使用其它的语言,可能会点shell 脚本。

  ◆对PHP的掌握不精(很多PHP手册都没有看完,库除外)。

  ◆知识面比较窄(面对需求,除开使用PHP和mysql ,不知道其它的解决办法)。

  ◆PHP代码以过程为主,认为面向对象的实现太绕,看不懂。

  这些PHPer在遇到需要高性能,处理高并发,大量数据的项目或业务逻辑比较复杂(系统需要解决多领域业务的问题)时,缺少思路。不能分析问题 的本质,技术判断力比较差,对于问题较快能找出临时的解决办法,但常常在不断临时性的解决办法中,系统和自己一步步走向崩溃。那怎么提高自己呢?怎么可以 挑战难度更高的系统?

  更高的挑战在那里?

  结合我自己的经验,我列出一些具体挑战,让大家先有个感性的认识。

  高性能系统的挑战在那里?

  ◆如何选择Web服务器?要不要使用fast-cgi 模式;

  ◆要不要使用反向代理服务?选择全内存缓存还是硬盘缓存?

  ◆是否需要负载均衡?是基于应用层,还是网络层? 如何保证高可靠性?

  ◆你的PHP代码性能如何,使用优化工具后怎么样? 性能瓶颈在那里? 是否需要写成C的扩展?

  ◆用户访问有什么特点,是读多还是写多?是否需要读写分离?

  ◆数据如何存储?写入速度和读出速度如何? 数据增涨访问速读如何变化?

  ◆如何使用缓存? 怎么样考虑失效?数据的一致性怎么保证?

  高复杂性系统的挑战在那里?

  ◆能否识别业务所对应的领域?是一个还是多个?

  ◆能否合理对业务进行抽象,在业务规则变化能以很小的代价实现?

  ◆数据的一致性、安全性可否保证?

  ◆是否撑握了面向对象的分析和设计的方法

  这里所列出的问题,你都能肯定的回答,说明在技术上你基本已经可能成为架构师了。如何你还不能回答,你需要在以下几个方向加强。

  怎么样提高,突破瓶颈

  如何你还不能回答,你需要在以下几个方向加强:

  ◆分析你所使用的技术其原理和背后运行的机制,这样可以提高你的技术判断力,提高你技术方案选择的正确性;

  ◆学习大学期间重要的知识, 操作系统原理,数据结构和算法。知道你以前学习都是为了考试,但现在你需要为自己学习,让自己知其所以然;

  ◆重新开始学习C语言,虽然你在大学已经学过。这不仅是因为你可能需要写PHP扩展,而且还因为,在做C的应用中,有一个时刻关心性能、内存控制、变量生命周期、数据结构和算法的环境;

  ◆学习面向对象的分析与设计,它是解决复杂问题的有效的方法。学习抽象,它是解决复杂问题的唯一之道。