前几天突然想写一个css的js压缩工具，于是这两天研究了一下几个js、css的压缩工具并且理清楚了一些概念和原理，下面总结一下。

前言

最近刷微博刷得有点过了，以至于我只想到这个标题。

今晚一直在看IE Blog，发现了很多关于IE10的新特性介绍，而且有些特性还是挺激动人心的。

我以为，IE10比IE9更具革命性，毕竟IE10是仗依着即将发布的Window8和Window Phone两个重要操作系统出来混的。

之前一直很少会关心IE，但是我一想到如今移动端对HTML5，CSS3给力支持的如此动人的景象，可能以后会被Window Phone的IE10捣乱，心怀不安，于是，我怀着忧国忧民的心情研究了一下IE10对HTML5的支持，现在汇报如下。

另外，需要说明的是，现在浏览器更新节奏比较快，所以要具体说明一下，如无特别注明，本文的IE10指的是IE10 Preview2 or above.

前言

跨域访问，老生常谈的话题了。网络上有一篇经典之作《JavaScript跨域总结与解决办法》介绍了几种基本的跨域访问的手段。

而这里，将要介绍的是不需要任何旁门左道的Ajax跨域访问。众所周知，由于同源策略，XHR对象是不能直接与非同源的网站数据交互的。而同源指的是什么呢？同源的范畴包括：规则(协议)，主机号(域名、ip等)，端口号。

但是随着开放，共享平台的流行，跨域访问的需求愈加强烈。目前最常用的跨域方案是动态加入script标签，这多少有点hack的意味，跨域访问似乎一直没有什么安全且光明正大的办法。

终于，HTML5提供的XMLHttpRequest Level2实现了跨域访问以及其他的一些新功能。下面我们会详细讨论一下，后面我还会稍微介绍一个在IE上的一个与XHR2类似功能的XDomianRequest对象。

前言

昨天去工作室和大家聊了一晚上，了解了工作室的一些近况，也顺便和大家分享了一些我这学期在美国做交换生和腾讯面试的经历。

因为昨晚没有投影仪，交流会也搞得特别狼狈，应师弟要求，今晚我把分享内容整理一下发上来。

今天写了一个CSS的小工具，也算是最近关于CSS和Web性能优化思考的一次实践。下面开始介绍一下，这个小工具主要功能有以下这些：

1. 代码压缩
2. 合并请求
3. 语法扩展
4. 缓存设置

代码压缩

这个小工具其实是一个Default.aspx页面文件，我们只要把它放到网站CSS文件夹里面，保证这个页面命名是默认首页，然后把我们原来引用的CSS文件夹后面加一个问号就行了。用我的博客举个例子，我本来文章页面中有三个CSS引用：

然后我们只要改成这样就可以了：

 这样之后有什么分别呢？加了问号之后，CSS引用都定向到我们的页面，页面根据后面的参数，读取CSS文件，然后把其中的无效空格，换行，注释全部清除掉。然后返回一个压缩后的CSS文件。可以点击下面两个链接看看压缩前后的效果：

压缩前：http://www.vinqon.com/codeblog/css/shCore.css

压缩后：http://www.vinqon.com/codeblog/css/?shCore.css

 前几天都在研究HTML5的媒体标签Audio和Video，本来打算写写笔记的，但把文章提纲列了出来后，又觉得如果展开来写的话内容实在太多了，于是，还是觉得编写一个Demo好了。

还是先上Demo，还是那句话，请使用Chrome浏览，Safari也可以。刚刚发现iphone也可以完美支持。

基本思路

这个播放器构思了两天，很多细节一直确定不了，很多想法都是Coding的时候爆发出来，然后临时加上去的，虽然是这样，但程序都写得很顺利，没有被什么问题卡住，整个播放器用了半个下午和半个晚上搞定。

目前播放器还很简陋，用户需要听音乐可以直接在输入框中写入歌曲，或者歌手，专辑之类的都可以。点击“我要听这首”，浏览器会发请求到服务器端，服务器到Soso音乐里面抓取，抓取的信息包括歌名，歌手，专辑，以及两个MP3地址。数据交给前端后，就自由发挥了。

HTML5的学习进度太慢了，今晚帮自己稍微做了一个计划，争取在这个月里面把下面这些HTML5都拿下来并且整理成博文。其实下面有不少点我之前已经接触过了，但是还是觉得要写成文章整理出来，才理解透彻，记忆深刻。

大概的计划如下，具体的再调整吧，如果写好了文章，我会在下面加上链接。 

昨晚玩了一晚上的canvas，主要时间是被一个小问题卡住了，我下面笔记一下。

最近很抓紧地再学html5，之前一直是看，感觉进度很慢，于是决定在这两个月都把很html5全部特性大概Demo一遍。

这次学习笔记是写关于使用canvas来处理图片，记得我一开始知道canvas可以读写图片像素的时候，肾上腺素立刻狂飙。随后，我脑海里立刻闪过很多web应用可以做，例如图片处理应用，今晚和楚越探讨了一下Photoshop里面的一些简易功用canvas实现的可行性。其实，不少童鞋已经实现了类似的应用。

我比较遗憾的是，因为没有图形学的基础，需要用点时间理解和学习一些关于色彩处理的算法。今晚我用了几个自己写的简单的公式稍微尝试了一下效果。

可以点击这里看Demo，兼容性方面，Chrome和Safair完美支持，其他的都有些悲剧。

下面开始笔记吧。

很少在这个Blog用Banner，在用163blog的时候，有段时间篇篇日志都做banner，但是到了后来一想到做banner就不想写日志了，所以之后就不了了之。而这次，纯属华丽欲发作。

说回正题，做3d效果冲动是来源于一次无意中看到的亚马逊广告，它是用Flash做的，把商品用3D围绕的效果展现出来。虽然不算惊艳，但是因为最近我在研究JavaScript上运动学，之前稍微玩了一下缓动，想再趁机会玩玩三角函数的运动。

幸亏我高中还是很认真学数学了，一些关于三角函数的概念还是记得的。要是当时老师用运动学角度来讲解三角函数，或者我数学不会那么差了，呃，这貌似物理老师做过。

昨晚一直在想这段程序这么写，想到失眠了。

多列等高布局很多时候都会用到，之前张望向我提出过这个问题，一直没有认真思考，今晚终于研究了一下，这里总结总结，收集到的方法大概有以下几种：

1. 使用背景模拟多列等高效果
2. 负margin-bottom和padding-bottom叠加法
3. 绝对定位法
4. 使用脚本实现

 如果大家有其他很好的办法，请留言指教。