操作dom记得使用createDocumentFragment

最近在做一个需求： 乱序排列一个列表，每次刷新都不同，怎么做呢？
1. 把元素取出，获得元素列表
2. 使用数组的sort函数，进行排序
3. 乱序函数很简单： function rand(){ return (Math.round(Math.random())-0.5); }
4. 返回的数组再插入页面里面使用appendchild，但是由于操作对象很多，速度不快，突然记得这本书里面写过文档碎片的事情，所以尝试了一下，果然速度快了些，分享一下。

所以大量的dom操作，一定记得使用createDocumentFragment ，一次性插入。 性能的提升是巨大的。

jquery的john resig同学说道：
A method that is largely ignored in modern web development can provide some serious (2-3x) performance improvements to your DOM manipulation. 


使用这个方法可以提升 (2-3x)倍的性能

这里是链接：http://ejohn.org/blog/dom-documentfragments/

他的测试如下：

Browser	Normal (ms)	Fragment (ms)
Firefox 3.0.1	90	47
Safari 3.1.2	156	44
Opera 9.51	208	95
IE 6	401	140
IE 7	230	61
IE 8b1	120	40

淘宝把自己的默认搜索换成了search.taobao.com了

谈点感受
1.去掉了分类这个概念，搜索少了一种更精确直达目标的方式，对于淘宝的搜索引擎来说，是否做到了公平的概念，是否热门分类就会出现在更高的位置？ 当然我不知道算法，对于淘宝来说，这样也许有更多的商业考虑； 对于商家来说，不是一个好消息，我想转化率也许会有所降低

2.从分词和搜索结果来看，我一直关注的一些关键词，似乎搜出来的结果少了许多，比如创新t3.。。

3.多了销量和信用的排序，不多说，呵呵，新商家越来越难混了。

4.筛选这里还是没有等宽排列，内容如果层次不齐，看起来费力，没原来好

5.强调了保障，不过放在哪个位置，更像排序，而不是筛选

6.前端优化了速度，不错。 

7.字体和颜色都变了，价格的颜色改变一时让人难以适应，因为商品点进去详细页的颜色还是老的，要注意统一的风格啊。。

8.最后说下，最好给用户选择使用哪种搜索，这样强推，实在是难受

灵活使用js事件代码，减少页面内存消耗

js事件代理简单得来说，就是通过js事件的event.target对象来判断你要操作的对象，这样你就不必在每一个元素都绑定事件处理程序，有效地减少了内存的消耗，循环的操作，好处多多。

比如一个弹出菜单，原来的做法是每一个按钮都注册一个onmouseover事件，现在你可以把事件注册到按钮的上层节点上来监听，通过判断发生事件的节点来进行一些列操作。 代码可能如下：

$('new-menu').addEvent('mouseover'，function(){ //绑定到new-menu这个节点上

    if(event.target.tagName == 'STRONG'){  //判断是不是你要的那个对象
var tab = $(event.target);    
var menuc = $(event.target).getNext();
event.stop();
    }
}); //代码基于mootools框架


如果一个页面有10多个弹出菜单，5个tab切换，每个切换有3个tab页，使用事件代理就得到的好处就是减少了76%的事件处理函数，页面对于内存的占用应该会有所提升，所以我还是喜欢使用事件代理。

当然事件代理也不是万能的，比如一些接口事件是不支持这个方法的，这里有一篇文章，可以参考下：http://cssrainbow.cn/index.php/code-snippets/javascript-code-snippets/1058.html

Page Speed 1.6 Beta 已经发布 支持firefox3.6

使用firefox3.6的开发朋友终于可以用page speed 了。

pagespeed1.6 beta下载


来看下 Page Speed 1.6增加了什么特性

• Specify a character set early - If you don’t specify a character set for your web pages or specify it too low in the page, the browser could parse it incorrectly. You can specify a character set using the META tag or in the Content-Type response header. Returning charset in the Content-Type header will ensure the browser sees it early. (See this Zoompf post for more information.)  更早地定义字符编码设置
• Minify HTML - Top performing web sites are already on top of this, right? Analyzing the Alexa U.S. top 10shows an average savings of 8% if they minified their HTML. You can easily check your site with this new rule, and even save the optimized version.  最优化html代码
• Minimize Request Size - Okay, this is cool and shows how Google tries to squeeze out every last drop of performance. This rule sees if the total size of the request headers exceed one packet (~1500 bytes). Requiring a roundtrip just to submit the request hurts performance, especially for users with high latency. 最小化请求大小