Heluyao的博客 {11gz.com}

看了一篇关于jQuery性能提升的文章，十分认同，总结一下(原文一共是十点，我省略了一部分)：

1.尽量只用id选择器和标签选择器，比如jQuery(“#selector”)、jQuery(“TagName”)，减少class选择器的使用，避免伪类选择器和属性选择器。

2.查找子节点时推荐使用find，比如jQuery(“body”).find(“p”)。

3.利用delegate将事件委托，例如给一个长列表逐个绑定事件，就可以使用delegate。delegata方法请参看jQuery API。

4.尽量减少DOM结构的改动(如.append()、.insertBefore()和.insetAfter())，避免不了也要记得先合并再一次性插入，大范围的DOM结构改动，可以利用detach方法先取出，操作好之后再插入。detach方法请参看jQuery API。

5.循环，尽量使用js原生的for或while，减少使用jQuery的each方法。

原文比较详细的并以数据说明了造成性能问题的原因，有兴趣就马上猛击过去了解。

1.按颜色合并，将颜色调色板相近的图标组合在一起。
2.避免不必要的空白(通常我会留出1px的距离)。
3.水平排列，而不是垂直。
4.将保存为png8格式。
5.先优化一遍图像，再合并成sprite。
6.通过控制大小和对齐减少反锯齿像素的数量。
7.避免使用对角线渐变，无法被平铺。
8.最好避免在ie6下中使用alpha透明图像，若一定要用就保存在单独的sprite中。
9.使用马赛克式的渐变。
10.要特别注意logo的质量。

优化PNG格式的图像

推荐工具：Pngcrush(http://pmt.sourceforge.net/pngcrush/)

其他工具：PNGOUT,OptiPNG,PngOptimizer

剥离JPEG的元数据

什么是 元数据？

1.注释。

2.应用程序定义的内部信息（如photoshop）。

3.EXIF信息。

工具：jpegtran(http://jpegclub.org)

将gif转换成png

如果gif图像中不包含动画，那就转换到png。转换后还要记得用Pngcrush优化哦！

优化GIF动画

工具：Gifsicle(http://www.lcdf.org/gifsicle/)

在线优化图像——Smush.it

前面提到的事情它都能胜任，只是在JPEG上为了保留版权信息没有剥离元数据。

使用渐进JPEG格式来储存大图像

这个能让图像在浏览器中逐步进行渲染。要注意的是文件比较大时才考虑使用该方法。

避免使用AlphaImageLoader

增加了代码的维护成本，还会造成直接的性能损耗。替代方案是使用VML或者采用渐进增强思维。

避免对图像进行缩放

比如将一张400×400的图缩放至200×200。缺点是既降低了图片质量又增大了下载量。

不要忘了favicons和Apple触摸图标

让文件更小且被缓存。

最近这小日子太舒坦了，几乎天天都在庆祝。今天刚好给博客装了个wap插件，现在手机也能更新博客了。晚上没事又睡不着就随便记录几句吧！

2011挺顺的，工作和生活上都是。今天lp医院的产检结果很好，小baby很健康，三维bc让我第一次见到他（她）的样子，还挺漂亮的，lp说小家伙长得像极了我，哈哈！再等将近4个月他（她）就出生了，期待啊！

2011当然不会放慢学习的脚步啦！主要精力还是放在javascript,html5,css3上，将之前已读过的几本js方面的书又重读了一遍，加深印象以便更好的融会贯通，都有《JavaScript高级程序设计》、《深入浅出JavaScript 》、《JavaScript DOM编程艺术 》，还读了《html5高级程序设计》，基本了解了canvas、web storage、web sockets、web workers、geolocation、离线应用，目前正在读《高性能网站建设进阶指南》一书，在网站性能优化方面可谓是受益匪浅，未来的日子里准备拜读《JavaScript设计模式》和《高性能JavaScript》两本大作，最近还大致上了解了nodejs(在服务端跑的javascript)并系统的学习了淘宝玉伯的seajs(异步无阻塞和代码模块化)，js方面还是有一段很长的路要走的；至于css3，说到底就是增加了一些新的Selectors和特性(比如渐变色、圆角边框、阴影、多重背景图、透明度、css动画、css3D渲染…)，后端的一些技术也慢慢深入(php)，服务器方面的经验也有了一定积累；还有过一段时间的actionscript(as2)开发经历，独立开发了一个音乐播放器并实现了歌曲列表和lrc动态歌词的功能，升级了网站的视频播放器，添加了分享、颜色调整、尺寸大小调整等等。

其实总结起来也没什么，又要感叹“时间太瘦，指缝太宽”了！每天时间不够用啊，看来好好管理自己的时间是十分重要的！

抓紧时间睡觉了，要不明天上班又没精神了。听完这首我不知道名字但好听的歌…Zz Zz……

项目地址：minify

作用：合并(减少HTTP请求)、精简、Gzip压缩和缓存JavaScript和CSS文件。

配置：Apache+PHP，开启Mod Rewrite。

下载：minify_2.1.3.zip

安装：解压后将min文件夹复制到网站根目录。

使用：

整个过程非常简单，只要你的服务器配置支持到位，基本就是傻瓜式的操作了。如果要配置得更加详细，比如缓存文件、控制是否压缩代码…等等，那么请参看Minify CookBook和Wiki，也可以看口碑网UED的文章在服务端合并和压缩JavaScript和CSS文件。

效果预览：http://11gz.com/demo/js-ajax/minify/index.html，请配合相关查看http请求记录的工具(HttpWatch/FireBug)浏览该代码。

未知原因，feedsky的RSS托管服务不能正常使用，好几天前的事情了。今天将blog的订阅地址换成feedburner，还请有兴趣的朋友更新一下订阅地址！

http://feed.11gz.com/heluyao

不得不感叹一下，feedburner的速度是严重快过feedsky，据说稳定性也超强！

如果你也离不开google reader、Gmail…等等，可以尝试以下方法，也许日后这样也不行了，那就默默祷告吧！

修改host文件，添加如下内容并保存。

203.208.39.22 webcache.googleusercontent.com
203.208.39.22 mail.google.com
203.208.39.22 www.google.com.hk
203.208.39.22 www.google.com

开始 > 运行 > 输入cmd > 继续输入ipconfig /flushdns > 关闭“命令提示符”，ok了！

现如今，node大热，不弄弄，那不落伍了！服务器端嘛，首先还是配置环境，第一步走出去了，后面的就好说了，一步步来嘛！我平时都是用的windows，这里就只记录windows啦！

第一步：安装Cygwin

Cygwin网站：http://cygwin.com/，Cygwin是什么就不多说了，反正是必须的！先下载setup文件，就算安装完了这个文件也别删，以后万一还有用得着的地方！如果首次安装有些包忘记装了，还得用这个再次安装！我一开始就忘记了好几个包，导致浪费了好多时间！主要是记得第一个界面时选择“install from internet”，否则就会失败！

这里要装的包有：

Devel

• gcc-g++: C++ compiler
• gcc-mingw-g++: Mingw32 support headers and libraries for GCC C++
• gcc4-g++: G++ subpackage
• git: Fast Version Control System – core files
• make: The GNU version of the ‘make’ utility
• openssl-devel: The OpenSSL development environment
• pkg-config: A utility used to retrieve information about installed libraries
• zlib-devel: The zlib compression/decompression library (development)

Editor

• vim: Vi IMproved – enhanced vi editor

Python

• 全部

Web 分类

• wget: Utility to retrieve files from the WWW via HTTP and FTP
• curl: Multi-protocol file transfer command-line tool

接下来就是下载了，有朋友建议选择日本的镜像，挺快！然后就是漫长的等待了。

如果你是win7用户

1. cmd命令行
2. 进入cygwin安装目录下的bin子目录
3. 运行ash.exe进入shell模式
4. ./rebaseall -v
5. 没有错误，完成，exit退出ash，关闭命令行窗口

第二步：安装Node.js

1. 运行Cygwin
2. 输入 wget http://nodejs.org/dist/node-v0.4.7.tar.gz 回车，下载node.js安装包。
3. 输入 tar xf node-v0.4.7.tar.gz 回车。
4. 输入 cd node-v0.4.7 回车。
5. 输入 ./configure 回车。
6. 输入 make 回车，可能要等一段时间！
7. 输入 make install 回车。

一切正常的话，node.js安装成功！现在可以输入 node –version 回车，查看node.js版本啦

第三步：设置DNS并创建测试文件

cygwin的安装目录下找到etc文件夹，创建一个resolv.conf，添加代码：


nameserver 8.8.8.8
nameserver 8.8.4.4


保存，关闭！

现在可以开始测试了，返回父目录，也就是cygwin的安装目录，新建一个js文件，命名test.js，输入：

回到cygwin命令窗口中输入 node /example.js 回车。

命令窗口中显示 Server running at http://127.0.0.1:8888/

打开浏览器，输入http://127.0.0.1:8888/，成功了吧！

npm下载、安装、使用

npm是nodejs的软件包管理器，可以用它安装所需软件包并发布自己为nodejs写的软件包，它还管理软件包的依赖关系并做了其它一些很酷的事情。

1. 一行命令下载并安装npm

   $ curl http://npmjs.org/install.sh | sh

2. npm安装node扩展包，同样是一行命令下载并安装好软件包

   $ npm install <包名>

一些链接：

• node.js官方
• node.js项目地址
• howtonode
• Stackoverflow
• 豆瓣：node.js小组