杰拉斯的博客

我们在前面的几节中分别讲了提高网站性能中内容、服务器、JavaScript和CSS等方面的内容。除此之外，图片和Coockie也是我们网站中几乎不可缺少组成部分，此外随着移动设备的流行，对于移动应用的优化也十分重要。这主要包括：

Coockie:

1. 减小Cookie体积
2. 对于页面内容使用无coockie域名

图片：

1. 优化图像
2. 优化CSS Spirite
3. 不要在HTML中缩放图像
4. favicon.ico要小而且可缓存

移动应用：

1. 保持单个内容小于25K
2. 打包组件成复合文本

(阅读全文…)

在第一部分和第二部分中我们分别介绍了改善网站性能中页面内容和服务器的几条守则，除此之外，JavaScript和CSS也是我们页面中经常用到的内容，对它们的优化也提高网站性能的重要方面：

CSS：

1. 把样式表置于顶部
2. 避免使用CSS表达式（Expression）
3. 使用外部JavaScript和CSS
4. 削减JavaScript和CSS
5. 用<link>代替@import
6. 避免使用滤镜

JavaScript

1. 把脚本置于页面底部
2. 使用外部JavaScript和CSS
3. 削减JavaScript和CSS
4. 剔除重复脚本
5. 减少DOM访问
6. 开发智能事件处理程序

(阅读全文…)

在本系列的第一节中，讲了提高网站性能中网站“内容”有关的10条原则。除了在网站在内容上的改进外，在网站服务器端上也有需要注意和改进的地方：

服务器部分

1. 使用内容分发网络
2. 为文件头指定Expires或Cache-Control
3. Gzip压缩文件内容
4. 配置ETag
5. 尽早刷新输出缓冲
6. 使用GET来完成AJAX请求

(阅读全文…)

Yahoo!的Exceptional Performance团队为改善Web性能带来最佳实践。他们为此进行了一系列的实验、开发了各种工具、写了大量的文章和博客并在各种会议上参与探讨。最佳实践的核心就是旨在提高网站性能。

Excetional Performance团队总结出了一系列可以提高网站速度的方法。可以分为7大类34条。包括内容、服务器、cookie、CSS、JavaScript、图片、移动应用等七部分。

其中内容部分一共十条建议：

一、内容部分

1. 尽量减少HTTP请求
2. 减少DNS查找
3. 避免跳转
4. 缓存Ajxa
5. 推迟加载
6. 提前加载
7. 减少DOM元素数量
8. 用域名划分页面内容
9. 使frame数量最少
10. 避免404错误

(阅读全文…)

缘由

JavaScript 数组去重经常出现在前端招聘的笔试题里，比如：

有数组 var arr = ['a', 'b', 'c', '1', 0, 'c', 1, '', 1, 0]，请用 JavaScript 实现去重函数 unqiue，使得 unique(arr) 返回 ['a', 'b', 'c', '1', 0, 1, '']

作为笔试题，考点有二：

1. 正确。别小看这个考点，考虑到 JavaScript 经常要在浏览器上运行，在千姿百态的各种浏览器环境下要保障一个函数的正确性可不是一件简单的事，不信你继续读完这篇博客。

2. 性能。虽然大部分情况下 JavaScript 语言本身（狭义范畴，不包含 DOM 等延拓）不会导致性能问题，但很不幸这是一道考题，因此面试官们还是会把性能作为一个考点。

在继续往下阅读之前，建议先实现一个自己认为最好的版本。

直觉方案

对于数组去重，只要写过程序的，立刻就能得到第一个解法：

function unique(arr) {
	var ret = []

	for(var i = 0; i < arr.length; i++) {
		var item = arr[i]
		if(ret.indexOf(item) === -1) {
			ret.push(item)
		}
	}

	return ret
}

直觉往往很靠谱，在现代浏览器下，上面这个函数很正确，性能也不错。但前端最大的悲哀也是挑战之处在于，要支持各种运行环境。

(阅读全文…)