号外号外，iSpriter更新啦！

什么？你不知道iSpriter是什么？那你太out啦，必须先看看这个文章了。简单的一句话介绍：基于NodeJs的开源CSS精灵图合并工具，不用改变原有的 css 编写方式，就能自动帮你解决 css sprite 的合并问题。目前源码托管在 github（https://github.com/iazrael/ispriter），欢迎各位同学来一起完善。

由于最初写的时候不怎么注意代码自量，写得比较搓。在应用在几个项目之后，修复了一些 bug，发现再加新功能比较困难。最近终于下决心重构了下，并在重构的基础上增加了一些新特性。

目前 iSp......

文本框是Web输入必不可少的一个控件，虽说现在有了很多所见所的的编辑器，但是在做一些输入比较简单的功能的时候，总不能引入一个庞大的编辑器代码是吧？比如说，syntax-heighlighter 的代码输入框。

一般情况下，textarea写些示例代码已经够用了。但是遇到需要缩进的时候就比较蛋疼。页面上的Tab按钮默认行为是跳转焦点，无法实现对文本框的内容进行缩进。如果要缩进，就得自己敲4个空格，天啊，敲死我咩～～

所以，想要不蛋疼，就得做hack。more

话说textarea有两个很好用的属性，selectionStart、selectionEnd（不确定ie是否有这......

最近做的一块功能，需要在页面A中，用iframe嵌入一个页面B。本来嘛，这是件easy到吃生菜都没那么容易的事。问题在于：iframe的这个页面B，也继续嵌入了另一个页面C。其实呢，这还是个正常得不能再正常的事。然后呢， 那个呢，在B页面iframe C页面的时候，就产生了一个历史记录了。表现就是，原来不能点击的后退按钮变得可点击了。是不是有点乱，看看下面的示意图：

由于这个页面是个Web App，同时要保证浏览器的前进/后退/刷新按钮可用。无端端的多出个没意义历史记录，而且这种历史记录，点击后退时是不会有hashchange和popstate事件触发的，兼容起来是相当的狠蛋......

话说昨天在写在线素描的时候，想着给画布加上些网格，就跟PS里面的一样。但是用canvas画是不行的（注：不是它不行……），图片又让我不齿，就作罢了。

今天想着要不尝试着用CSS3画一个，找了些资料，看了下CSS3的所有属性，竟然也被我找到画网格的方法了，喔～哇哈哈哈～～

这些属性就是——linear-gradient、background-size，大家鼓掌欢迎他们～

那到底要怎么做呢？我们暂时不考虑网格，先想想，怎么画一条横线呢？more

……（10分钟过去鸟）

好，看下面的代码（只贴了webkit的实现，其他的太多，不想写，下同～ <......

一、引子

话说前阵子想把一张照片转换成素描，然后发个微博。结果发现mac上没找到能直接转换素描的软件（PS不算，可要好几步呢），坑爹啊～～google 了下，Web上竟然也是没有直接把照片转换成素描的东西，连让我包含期望的美图秀秀（Web版）竟然都没有素描功能，T_T。

手机上是有很多这类app，但是我只是想一键转换下，发个微博嗟，至于这么折腾么……

所以自己动手整一个在线版的吧，没怎么用过canvas，正好可以顺道熟悉下。等不及的童鞋可以先到这里看看效果（http://appx.imatlas.com/sketching/）。

二、怎么转换

刚冒出这个想法的时候，简直......

项目开发中，经常会用到的图片进行修改，而CDN都会对图片做cache，如果图片更新了不做其他处理的话，用户端的图片则无法更新（删浏览器cache刷新除外）。

因此每次修改完图片，都需要去更新css所引用的图片url。通常的做法是给图片后面加个时间戳，如：./images/sprite.png?20120714001。但是人工修改这东西是个挺蛋疼的事，咱是程序员， 不应该干这些繁杂无趣的事对不对。

所以阿拉整了个python脚本来干这事（貌似最近写脚本写上瘾了，汗-_-||）。原理是读取css文件，遍历图片url，然后读取图片的svn版本跟url带的版本号比较。如果比较新则更新u......

用Wordpress写技术文章，经常都要插入一些代码。代码高亮的插件就不说了，目前本人感觉最好用的还是SyntaxHighlighter，具体使用也不说了，网上也有同学写个SyntaxHighlighter for Wordpress插件，简化了插件的嵌入。

这里要说的是，插入代码的时候，需要切换的html源码视图，然后自己打入<pre></pre>标签，并把代码贴入。是挺简单的，但是对于我这种懒人来说，这可是相当的烦呀。于是花了点时间，给wordpress的编辑器加了个按钮，一点击就可以插入代码了，是不是很爽咧，哈哈～～more

效果图如下，按钮只在可......

废话不说，直接正题吧。

最近项目有个需求要用js计算一串字符串写入到localStorage里所占的内存，众所周知的，js是使用Unicode编码的。而Unicode的实现有N种，其中用的最多的就是UTF-8和UTF-16。因此本文只对这两种编码进行讨论。

下面这个定义摘自维基百科（http://zh.wikipedia.org/zh-cn/UTF-8），做了部分删减。

UTF-8（8-bit Unicode Transformation Format）是一种针对Unicode的可变长度字符编码，可以表示Unicode标准中的任何字符，且其编码中的第一个字节仍与ASCI......

惊喜，最近版的NodeJs（目前是0.6.19）提供的msi安装包已经把npm打包进去啦，感兴趣的朋友可以到官网下载。如果你很懒，点这里直达，^_^。

下载后的msi直接双击运行，不过不能选安装路径，有点令人不爽～～强暴的装在了“C:\Program Files\nodejs”。

安装完成之后会自动把安装路径加入%path%，之后就可以为所欲为的用node和npm啦，哈哈哈～

安装模块

npm install intelligent-spriter

卸载模块

npm remove intelligent-spriter

附上个安装截图

......

一、引子

根据雅虎的网站优化准则，合并页面用到的图片，可以减少加载时发起的http请求数目，可以加速页面加载。具体能提速多少，本人没测试过，也就不好说了。

话说这排手上的项目里用到的图片都怎么合并，并不是不想合并，而是一个个图片去拼实在是太累了啊。另外桂总做的autosprite又还没成型，未能支持旧有项目；自己做的AutoSprites也是一个烂摊子——java写脚本功能的代码真不是一般的痛苦啊；至于炜哥的GoPng在线合图工具，说实话，这类需要人工定位图片的工具，我着实不喜欢。还是那句话，我可是个程序员呐，这种机械化无趣的工作就该交给电脑来完成，不然电脑是拿来干嘛的？

二、所......