Silence & Solitude makes...

Pu's mind space

重开博客记

又开始写博客了,感觉不错.
博客中断的直接原因是VPS和域名服务到期而我想更换,所以没有直接续费仅仅作了简单的备份.间接的原因则是换工作之后生活节奏和状态的改变.我发现换了一个闲的工作之后反而没有了加班加点之后继续利用剩余时间学习的劲头了,奇怪.
间断的一年中除了换工作,还有两件事情.
一个是戒烟复吸了.看起来之前的战略上轻视对手是正确的–我一开始就知道我可以轻易地戒掉,但是战术上显然不够重视,以至于几个月之后重又复吸起来.
一个是碗碗死掉了…
好吧,经历了这么些事情现在又到了一个平静地状态,让人觉得下一个时间轴上的坐标性事件可能要在很久之后了—日子在加速,我在静静的颓败.重开博客大概也是因为有这种恐惧的驱使吧.
不管怎么样,现在又启程了,日子快也好慢也好,我认真地记录.

和一只兔子

周天的早晨,去阳台放碗碗进屋,然后回头去刷牙煮咖啡。它就这么跟着我转啊转,我到哪里它就跟到哪里。我停下来,摸摸它,然后继续干我的事情,它还是这么跟着我,我感到一阵愧疚,不知道该如何满足它,我不能承受它抛弃整个自我而全身心的就这么蹦跳着跟着我。

我突然想到,所谓感情,譬如除却了言语和物质的男女之恋,也不过如此而已。你不可能了解她,她也不会了解你,你喜欢它阳光下的绒毛,它喜欢你的温暖(或者食物)你们仅仅为了互相的陪伴和跟随就可以付出自己全部的感情。

序曲,前戏和其他

电影《Leon》里的变态警察如是说:

screenCapture

leon

序曲让人热血沸腾,它是如此铿锵有力,但序曲过后,说实在的,真他妈的有点闷。

我深以为然,听一支摇滚,在安静中你期待第一个音符的出现,想要知道叩开你心扉的是一个琴键的敲击,一个有力的鼓点异或是吉他的一下拨动。好吧,是吉他,一段清澈的solo,哦也,架子鼓也加进来了,电子音,旋律快起来了……一切都很带感,直到一个意料外的人声合着一团乱麻的乐器音开始唱歌了。怎么说来着,boring,你可以把播放器最小化开始刷微博或者干其他什么了。

在这个周末的早晨,睡到10点自然醒,起床洗漱,打开阳台的窗,阳光照进来。我打开音乐,开始煮咖啡,拖地,把洗衣机里装满衣服并让它转起来,淘米熟饭,把冰箱里的肉拿出来放进微波炉化冻,把蔬菜切块……我就这样饿着肚子,忙活了一个多小时,在洗菜切菜时陆续听到滴滴咚咚的声音:微波炉说化冻成功,电饭煲说饭已OK,洗衣机喊我转完啦。那种感觉真的很美妙,一切都生机勃勃,所有的事情都有条不紊地走向成熟,呵呵,好一个周六清晨的居家交响乐。闻着烹香的米香肉香咖啡香,坐在干净的餐桌旁,突然觉得这一切有点奢侈,我想要留住它,可是肚子实在饿得受不了了,狼吞虎咽起来。8分钟后,我一早上梦幻般美丽的2小时结束了,留在我面前的是油腻的餐盘,难听的音乐,还有需要晾的衣服。说实话,饱着肚子看油腻的饭菜就和一次错误的高潮之后看留下的精液一样恶心。当我眼中烹香美味的肉末茄子变得恶心时,我知道,序曲过去了。Oh,no,亚美爹,嘛跌。

其实又何止是一个早晨呢,一段音乐,一根烟的事件里,或者一次性事,或者一场爱恋里,都有这种序曲美妙过程无聊(甚至事后懊悔)的起伏啊。
你会记得第一次约会时风的沁凉,却记不清第23次做爱的地方。你喜欢点起一支烟的从容,却不喜欢匆匆掐灭的慌张。你们慢聊,我先刷碗去了——哈哈,这样在序曲戛然而止才是正道吧!

angular.js的缓存设置

有些浏览器或用户把缓存开着,对于一些没有加时间戳的RESTFUL资源,需要强制禁用缓存。

我碰到这个问题时首先想到在HTML开头写上

<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="0">

结果发现并不起作用,因为上面的代码只是不缓存页面,页面里的内容全是用ajax请求动态获取的,而ajax请求的路径被记录并缓存了。所以上面三行不起作用。

正确的做法是设置ajax请求头,对于jquery.ajax来说比较容易了,简单加个参数就好了;对于angular里面的$http、$resource这种封装得比较深的,可能就不知道怎么设置了,经过查阅API,发现可以设置$http的defaults,于是有了下面的写法

//禁用缓存
app.run(function($http) {
     $http.defaults.headers.common={
       'Cache-Control' : 'max-age=0',
     'If-Modified-Since':'0'
     };
});

其中app是angular module,上述代码片段放在app刚被定义之后即可起到全局作用。经试用可以解决问题,遂录于此,共鉴。

HTML5新增元素的CSS特性

我们基于HTML4和CSS2.1形成了对网页展示的一套理解。现在HTML5和CSS3也都出来了,网上一些针对各自特性的说明文章不少,但很少有联系起来讲的。即面对这些新特性,原来HTML4和css2.1之间的协作方式或者说化学反应的规律有没有变?两者有没有因为各自的强化而对语义–表现的分工有所僭越?我觉得这是一个比较重要却又被忽视的讨论。譬如内联元素,块级元素的概念是否被颠覆?这篇小文就来关注这个问题,也希望其他类似的着眼于前端体系的变化而非特性变化的讨论能多一些。

###什么是内联什么是块级
根据w3c标准,块级元素就是能直接出现在BODY元素下的元素,而其他的是内联。(这就算是定义了?)

(幸好还给出了可操作层面的)其他三个:
1.内容模型:块级可以包含块级和内联,内联只能包含内联。
2.样式方面:(通常)块级换行,内联不换行。
3.Directionality(不懂,不译)

这其中只有第二个有方法论层面的意义,所以我们不妨写几个元素,看看是否换行。类似这样的:
他们之间的对话

<dialog style='margin-top:20px;background-color:navy;'>
    <dt>老师</dt>
    <dd><p>你作业做了吗</p></dd>
    <dt>学生</dt>
    <dd><p>做完了</p></dd>
</dialog>
 <time style='line-height:10px'>9:00</time>    <header>header</header>
<section>section</section>
<video src="洋葱.mp3" controls='true' class='box' style='line-height:200px;'></video>
<video src="洋葱.mp3" controls='true' class='box' style='line-height:200px;'></video> 
<nav>nav</nav>
<article>article</article>
<span>span2</span>
<footer>footer</footer>
<figure class="block box">
我本身是不是块级蒜素figure</figure>
<span>asdfasf</span>
<meter class="box" value="9" min="0" max="100" low="65" high="96" optimum="100">88</meter>       
<span>yes</span>
<aside class='block'>goodee aside Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate velit aliquid blanditiis laboriosam nam, nisi, vel aut suscipit, accusamus culpa iusto tempore praesentium et sapiente aspernatur quod ullam, reiciendis laborum!
</aside>
<span class="block box">i;m span</span>

<progress class='box' value="44" max="100">现在已经进行了多少了</progress>
<span class="block box">i;m span</span>

###按老概念分类HTML5新元素
通过观察上面的HTML的表现,我给出利用“是否换行”这一准则判断出的新HTML5元素的分类吧:
块级:

  1. header
  2. hgroup
  3. section
  4. nav
  5. footer
  6. article
  7. aside
  8. figure
  9. figcaption

内联:

  1. time
  2. meter
  3. progress
  4. video
  5. audio
  6. wbr
  7. bdi
  8. mark
  9. canvas
  10. track
  11. output

弄不明白:dialog keygen datalist;后面两个应该是内联。

###结语
这么分类之后一看,基本上结构化的元素还是块级,一些直接描述末梢文本语义的还是内联。元素的显示效果(是否换行)和语义(表示文件结构还是表示文本含义)的对应关系还是和HTML4保持一致的。所以,HTML5没有那么神秘,熟悉4的老人完全不必怵之。

Tricks--Protocol Buffer for Node.js的一个坑

Google Protocol Buffer协议凭借其突出的性能,目前用的越来越多,概念介绍这里就不展开了,直接主题。话说官方支持的实现语言有三个:C++,Java,Python。Node.js开发想用的话似乎用得比较多的是这个库:ProtoBuf.js,我们的坑就从这里开始。

具体代码就不贴了,之前一直正常,后来某一天我重新npm install之后,返回的数据就不能用PB解析了。我追着代码走,发现了ProtoBuf.js有一个依赖项:ByteBuffer.js。ProtoBuf在使用ByteBuffer时有段内省的代码instanceOf来判断是否是ByteBuffer的实例。问题在这个上面,联想到我是重新npm install之后出的问题,我想到自己的外部项目也依赖了ByteBuffer,于是检查外部的package.json发现对其依赖写的是:"bytebuffer":"latest",而ProtoBuf内部的package.json对其依赖写的是"butebuffer":"2.3.1",我于是立刻去github上查看,果然ByteBuffer刚刚升级到3.0.0版本。也就是说两边的ByteBuffer不是同一个版本,导致了instanceof自省失败。遂把项目对bytebuffer的依赖固定到2.3.1版本,问题解决。

教训:
Node.js的依赖库不要用latest,谁让它这么火呢,三天两头就有各种新的变化。

想法:
Node.js的库依赖能否最小化,即npm install时候能否加入这样一种优化机制,对于共同依赖的库根依赖能覆盖叶依赖?

PS:
这个BUG是个老梗了,我几个月前记录现在才整理的。应该不会重现了,目前(2014-10-30)protobufjs稳定在3.0.0,而bytebuffer的版本是3.
1.0,没有兼容问题。但是教训仍有意义,故此记下。

Tricks--修改Sublime text3自带的snippet

(本文针对windows系统而言。)
在sublime下面新建自己的snippet还是比较方便的,但是如果希望修改其自带的snippet,可能无法直接从菜单中找到相应的操作。其实也不难。
到sublime text3的安装文件夹(默认是c:\program files\sublime text)——而非用户数据文件夹——下,进入Packages子文件夹,然后用压缩工具打开其中的sublime-package文件,编辑其中的sublime-snippet文件。譬如HTML.sublime-package用winrar打开后可以编辑其下的html.sublime-snippet文件(譬如加入<meta charset='utf-8'>)。保存后重新打开sublime text试试看插入html的snippet,就已经加入了相应的行。

<转/译>开始设计之前

译序

最近几天搞css搞得头昏脑胀,我们新来的年轻设计师给的设计稿和切图都很“完美”,但就是实现起来觉得很不符合HTML的特性,总觉得不像一个“页面”。我是不打算打算学习设计了,但是如果设计圈的孩子们都能像下面这篇文章的作者那样务实,大家切切图写写正常的网页,把加班的时间省下来去上上网,刷刷dribbble之类的不也挺好嘛。

该译文来自quora上的一个问题:在设计的流程和工具上有哪些有用的小窍门;以下是回答


呃,先声明一下比起窍门来本文更像是一种理念,一下作答。
由内而外地设计,而不是由外而内。这里有一篇我之前写的有关这个想法的东西,刚才编辑了一下以适应普通设计而非页面设计。


别再“语不惊人死不休”听上去有点奇怪,但这是真的。作为设计师,我们总是想着让人们惊叹,因为我们喜欢听人们“哇哦”的声音。我们崇尚新颖的,创新的,非传统的设计,我们认为别人也喜欢这样。现在更糟糕的是我们甚至开始谋求圈内人的“哇哦”声了(如dribbble.com),因此这限制了我们的意图。


如今拿到一个项目,设计师们马上就开始用最新颖的方式来开始“加大筹码”,姑且这么说吧。他们开始设计图形,颜色,图标,按钮……哦,对了,不能忘了还有最近才看到的那种牛逼哄哄的动画特效。但请停一下,发生了什么?


我们迷路了,我们忘记了为“谁”设计“什么”,以及“为什么”要设计在不停创新的路上,我们忘记了为“用户”来做我们的设计。我们同样设计的是“信息”,最后我们忘记了我们为什么要设计:是为了信息能够更好地被传递和理解


自从我们迷路之后,我们就开始由外而内地设计上了。换句话说,我们开始专注于有关设计的一切而非内容本身。这有两个效果:一是它忽略了内容(设计的全部原因),而是它把重点全部倾向到了只有其他设计师才会注意的方面——新奇。


但是用户不是设计师。在累了一天之后,他们需要的是不闹心的,尊重正常操作习惯的,文字大而合理的,颜色对比足够的设计。设计师的任务是为用户吸收和理解信息一路保驾护航,而不是隔三差五的让他分心。说到这,你该问了:那我要怎么做呢?


由内而外地设计!首先弄清楚内容及其来龙去脉。这是哪种类型的内容?严肃的?激动人心的还是有趣的。我们要达到什么目的?增加注册量,下载量,捐赠量还是仅仅传达一个消息?


我们的受众是什么样的?他们有多少时间,岁数多大?老人,年轻人,是潮人吗?他们将在3寸的手机上看到内容还是在30米的路边广告牌上看到?


注意:下面的内容并无定式,随个人理解。内容传达给你什么信息,你将如何处理它,它将已怎么的方式被接受,用哪种字体展示在公众面前。


一旦你找到了内容的展示欲和内在需求,倾听它吧。它会将你引导到正确的关注点上,引导你获得关键信息。然后就简单了,就是文字嘛,顶多加上字体,行距,尺寸等一起搅拌搅拌,然后再用框架以最少的线条和留白把文字框起来,注意只有文字信息,没有颜色、纹理、图像等等,一概没有。


一旦你把内容(关键信息)设计完了,开始添点必要的图形元素吧。一些配色,纹理方面的细节,为区分交互的和普通的内容而增加一些吸引力深度(多样性)。除非有充足的理由支持,不要添加其他任何东西。一旦你完成了,重新评估一下你刚做的,删掉一切不需要出现的部分。


请记住,整个过程是关于内容的,而不是关于你自己的。em>你是这个作品的设计师这一简单事实已经影响了这个设计,不要担心这样的设计没有打上你的烙印。从你开始接手他的第一刻开始,你已经主宰和占有了整个设计。


总之:设计是一种交流,而最好的交流就是信息清晰,意图被理解,而且是用最少的言语,动作和花里胡哨来达成的。不要设计成像政治家的演说那样天花乱坠,忽而煽情忽而严谨,却使听众如坠五里云雾。


原文地址

<评>这本书能让你戒烟

无聊翻起了这本书,写这篇文章的时候也还没看几章,只是突然想到一点其他的,就先放下了。

首先说一下,书本身还是不错的,至少就我看的这几页看,作者成功地让你在战略上藐视了戒烟这件事,至于战术上有没有什么独到的地方,我还没看,过两天再说。

我只是在读的时候冒出一个问题。作者是33年的大烟枪,机缘巧合戒了烟,然后出于爱钻牛角尖的性格和悲天悯人的情怀,开起了戒烟所,并出了这本书。字里行间我能体会到英国人的求真和天然的容易接近真理的天赋,说实话我对作者本人是很尊敬的,但是不能跳出不做事的人爱对别人做的事情做价值评判——甚至还站在比他们‘高’的角度去做这一怪圈,我自然而然地就想到:对于一个前半生吸烟而后半生劝人戒烟的人的人生意义,该怎么评价?

其实我小时候也考虑过类似的问题。我念的初中是一个乡镇小初中,教学质量不高,没出过什么人才。偶然听父母辈的人聊起某某去县城当老师了,是我们现在的老师教出来的得意门生,生活滋润云云。我就在想我们的老师该如何评价他的这位学生呢,如果他教育出来的学生后来都成功地当上了老师,这样就能教出更多的人才——比如老师,如果不考虑社会分工的话,这样的效果能算成就吗?类似地还有念大学得知某某专业的就业前景就是当本专业的老师……

是不是觉得怪怪的?这样的事情总是不经意地把你拉向了希绪弗斯的人生观上。诚然,人不能两次踏进同一条河流,表象上的轮回中熵是增加着的。即使是没有任何创造的老师也为人类认知的延续做出了贡献。一群吸了半辈子烟尔后花了半辈子劝人戒烟的人也使人们加深了对欲望,毒品等问题的认知。但我还是觉得这样的轮回不是人生的意义,总该有超越有变化在的吧。