摘要：
昨天把 biz-to-me 升级到支持 HTTPS 了，为此研究了一下如何让 Heroku 上跑的 Node.js 应用支持 HTTPS。我发现并没有任何文章描述这个具体的流程，只有零碎的信息，所以在此记录一下。 首先，Heroku 应用要支持 HTTPS 必须要是付费的等级，最便宜的是每月 $7 阅读全文
随笔分类 - JavaScript
如何捕获和分析 JavaScript Error
2014-03-17 05:58 by Cat Chen, 10130 阅读, 收藏, 编辑
摘要：
前端工程师都知道 JavaScript 有基本的异常处理能力。我们可以 throw new Error()，浏览器也会在我们调用 API 出错时抛出异常。但估计绝大多数前端工程师都没考虑过收集这些异常信息。反正只要 JavaScript 出错后刷新不复现，那用户就可以通过刷新解决问题，浏览器不会崩溃，当没有发生过好了。这种假设在 Single Page App 流行之前还是成立的。现在的 Single Page App 运行一段时间后状态复杂无比，用户可能进行了若干输入操作才来到这里的，说刷新就刷新啊？之前的操作岂不要完全重做？所以我们还是有必要捕获和分析这些异常信息的，然后我们就可以修改代码 阅读全文
「云端 JavaScript 漫游指南」
2011-08-09 00:00 by Cat Chen, 4044 阅读, 收藏, 编辑
摘要：
7 月 30 日在 w3ctech 的 JavaScript 活动广州场 讲了一节「云端 JavaScript 漫游指南」，实质上就是 Node.js 入门讲座。希望通过这一节讲座，让原本熟悉 JavaScript 的前端工程师尝试使用 Node.js 开发一些应用，探索 Node.js 为 Web 开发带来的可能性。这场讲座上主要使用了两个小 demo 来解释 Node.js 的一些基础概念，并且展示了如何把自己的应用部署到云端。需要使用 Node.js ，最起码你要知道 CommonJS Modules 的概念，然后你才能在一个 js 文件里面使用另一个 js 文件实现的功能。这是通过 r 阅读全文
为什么 script 标签不能写成自关闭形式
2011-07-08 13:50 by Cat Chen, 5375 阅读, 收藏, 编辑
摘要：
今天早上在 Stack Overflow 看到了这个问题： Why don't self-closing script tags work? 。答案给出的解释是，在 XHTML 的标准里面规定非 EMPTY 标签不能使用自关闭形式。注意这里使用的是全大写的 EMPTY ，所以我不把它翻译为「空白」。那么 EMPTY 到底是什么呢？写过 DTD 的人应该知道它是个关键字，用来指明一个标签的内容必须是空白，而不能包含文本内容或子节点。看看具体的例子就很容易明白了：<!ELEMENT img EMPTY><!ATTLIST img %attrs; src %URI; #RE 阅读全文
在 JavaScript 中监听 IME 键盘输入事件
2011-05-29 22:26 by Cat Chen, 10152 阅读, 收藏, 编辑
摘要：
在 JavaScript 中监听用户的键盘输入是很容易的事情，但用户一旦使用了输入法，问题就变得复杂了。输入法应当如何触发键盘事件呢？是每一下击键都触发一次事件，还是选词完毕才触发事件呢？整句输入又该如何触发事件呢？不同的操作系统和不同的浏览器对此有不同的看法。在最糟糕的情况下，用户使用输入法后浏览器就只触发一次 keydown ，之后就没有任何的键盘事件了。这对于 Suggestion 控件的实现来说是个大问题，因为 Suggestion 控件需要监听文本输入框的变化，而事件是最准确也最节省计算资源的做法，如果换成轮询的话性能就可能受到影响。 首先，要监听启用输入法后的击键事件应当使用 ke 阅读全文
Tangram 前端库通过 Github 开源了
2010-12-24 16:20 by Cat Chen, 8426 阅读, 收藏, 编辑
摘要：
Tangram 是百度内部一直在开发和使用的前端库之一，功能与 jQuery 、 Prototype 等库类似，主要功能是简化 DOM 操作，并且扩展 JavaScript 语言。这部分功能准确来说属于 Tangram Core ，另外一个叫做 Tangram Component 的库提供一些类似 YUI 、 Sencha 这个级别的组件。之前 Tangram 说要开源很久了，一直卡在流程上，并且也有人觉得必须把库做得足够好了才好意思拿出来开源。我个人的看法是，跟 John Resig 的一样，前端库应该从第一天开始就开源，因为就算你不开源别人也一样能看到，所以还不如开放出来接受别人的贡献。如 阅读全文
John Resig 见面会视频
2010-11-23 00:28 by Cat Chen, 3497 阅读, 收藏, 编辑
摘要：
上个星期 John Resig 来到了中国，谋智网络跟 CSDN 组织了一场 John Resig 见面会。 John Resig 在大会上介绍了 jQuery 的两个新特性（暂时还是插件）： Data Link 以及 Templates 。引入这两个插件后，前端的数据呈现及交互将变得更简单，开发数据驱动型 Web 应用的成本也会随之而降低，估计将来我们能够见到更多基于 jQuery 的数据交互型... 阅读全文
如何让你的网站支持 IE9 Pinned Site (Part 2 - 实战)
2010-11-17 00:02 by Cat Chen, 3184 阅读, 收藏, 编辑
摘要：
该如何展示 IE9 Pinned Site 呢？我可以写一个新的应用，完全是为了展示 Pinned Site 的特性，但这样就像是为了实现这些特性而利用这些特性。所以我想还是升级一个现有的网站好了，这样更能说明 Pinned Site 是如何起到优化用户体验的作用的。我选择了 hack 现在的百度地图。由于 IE9 正式版还没有发布，所以我 hack 的代码暂时也不能发布到线上，只能私下玩玩。在这... 阅读全文
如何让你的网站支持 IE9 Pinned Site (Part 1 - 理论)
2010-11-16 19:19 by Cat Chen, 3816 阅读, 收藏, 编辑
摘要：
Windows 7 任务栏有何不同自从 Windows 95 开始，任务栏就一直没什么变化，都是一个个长条表示正在运行的应用程序，直到 Windows 7 。 Windows 7 的任务栏发生了巨大的变化，这个变化其实就是更像 Mac OS X 的 Dock 了。无论是否在运行的应用程序，都可以在任务栏上占一个位置，并且这个位置可以固定下来，让用户可以更方便的操作这个应用程序。从此，任务栏由单向地... 阅读全文
百度前端技术交流会视频及讲稿下载
2010-11-07 20:35 by Cat Chen, 13295 阅读, 收藏, 编辑
摘要：
10月份的最后一个周末，百度前端研发部尝试了第一次的对外技术交流活动，尽管只是在官方博客上做了宣传，仍然收到近 200 人的报名。考虑到场地限制，发出去了 100 个邀请，最终来参加的有 130 人。活动邀请了来自豆瓣、新浪、腾讯、百度前端研发团队的4位工程师来做演讲，内容涉及前端框架、开发流程以及团队合作方式。以下是他们演讲的视频及讲稿下载。百度前端基础平台与架构分享Youku 高清版本豆瓣前端... 阅读全文
用 JavaScript 对 JSON 进行模式匹配 (Part 2 - 实现)
2010-07-15 14:58 by Cat Chen, 3683 阅读, 收藏, 编辑
摘要：
在上一篇文章里，我们完成了 Dispatcher 类的接口设计，现在我们就来考虑一下如何实现这个类。Notify & Capture要实现 notify 和 capture 就太容易了，我们只需要把 capture 传入的 handler 都保存下来，然后在 notify 里面找到匹配的 handler 就可以了。var filterHandlerBundles = [];Dispatch.cap... 阅读全文
用 JavaScript 对 JSON 进行模式匹配 (Part 1 - 设计)
2010-07-13 14:04 by Cat Chen, 4341 阅读, 收藏, 编辑
摘要：
在《从 if else 到 switch case 再到抽象》这篇文章里面说到，解决 if else 和 switch case 分支过多的一个方法，就是做一个专用的 dispatcher ，让它来负责进行筛选与转发。至于筛选条件的描述，模式匹配是一种很常见也很好用的方式。在 JavaScript 里面，用 JSON 来描述模式又是相当方便的事情，所以我们来做一个 JSON 模式匹配工具吧。用例设... 阅读全文
从 if else 到 switch case 再到抽象
2010-07-05 14:04 by Cat Chen, 15975 阅读, 收藏, 编辑
摘要：
大家觉得在接手遗留代码时，见到什么东东是最让人感到不耐烦的？复杂无比的 UML ？我觉得不是。我的答案是，超过两个 else 的 if ，或者是超过两个 case 的 switch 。可是在代码中大量使用 if else 和 switch case 是很正常的事情吧？错！绝大多数分支超过两个的 if else 和 switch case 都不应该以硬编码（ hard-coded ）的形式出现。复杂... 阅读全文
能承载移动 Web 应用的唯一浏览器： Mobile Safari
2010-01-30 14:02 by Cat Chen, 5276 阅读, 收藏, 编辑
摘要：
最近拿 iPhone 、 Android 、 Windows Mobile 这三个平台上的内置浏览器来做了一番对比，结果是只有 iPhone 的 Mobile Safari 能够承载现代化的移动 Web 应用，其他移动浏览器的设计思路还停留在上个世纪──能看网页就行，不存在移动应用一说。我用来做对比的平台是 iPhone 2.0 、 Android 2.0 、 Window... 阅读全文
编写 iPhone Friendly 的 Web 应用程序 (Part 7 - 多点触击)
2009-11-24 22:33 by Cat Chen, 3494 阅读, 收藏, 编辑
摘要：
这个系列的上一篇文章差不多是两年之前的事情了，在这两年里Mobile Safari并非停滞不前，从iPhone 2.0开始Mobile Safari就加入了对多点触击的支持，现在我们就来看一下我们可以利用它来干什么。相信很多人都看过WPF为Surface设备做的一个简单demo，也就是在桌面上显示若干张照片，你可以通过单点触击拖放，也可以通过多点触击缩放和旋转。这在iPhone上能够做到，甚至在M... 阅读全文
十分钟内学会：控制浏览器是否缓存网页状态
2009-10-09 14:59 by Cat Chen, 7628 阅读, 收藏, 编辑
摘要：
Question在Firefox等浏览器中，如果你打开一个页面并进行若干操作，例如在文本框进行输入，甚至点击按钮进行Ajax操作更新页面局部，这些操作的结果都会被缓存下来。在你点击链接离开这个页面后，如果你通过后退按钮回到这个页面，你会发现它仍出于你离开时的状态，而非页面刚刚加载好后的初始状态。在一些情况下，这样的缓存方式是符合我们预期的；但在另外一些情况下，我们更希望页面恢复到初始状态，或者说让... 阅读全文
你的网站「被兼容」了吗？
2009-09-17 15:35 by Cat Chen, 5000 阅读, 收藏, 编辑
摘要：
一般情况下，我们只会讨论我们的网站如何主动兼容某某浏览器，被动地等待浏览器来兼容我们的网站是不切实际的幻想——哪个浏览器会那么伟大，原意主动为一个不兼容的网站而作出改变呢？IE8就是这样一个伟大的浏览器，Microsoft就是一家这样伟大的企业。故事是这样的，我们有一小段JavaScript依赖于userAgent属性，同样是用IE8进行浏览，在测试环境上userAgent... 阅读全文
jQuery is DSL (Part 2 - jQuery)
2009-08-17 00:01 by Cat Chen, 4634 阅读, 收藏, 编辑
摘要：
jQuery的Internal DSL形式在上一篇文章里面，我们了解到了Internal DSL的具体形式，形如：/* Method Chaining */computer() .processor() .cores(2) .i386() .disk() .size(150) .disk() .size(75) .speed(7200) .sata() .end();然后我们在看看一段... 阅读全文
jQuery is DSL (Part 1 - DSL)
2009-08-10 23:47 by Cat Chen, 6884 阅读, 收藏, 编辑
摘要：
jQuery刚刚出来的时候，我没有太多关注它，觉得这不过是Yet Another JavaScript Library。早期的jQuery专注于DOM节点的筛选与操作，不提供众多的基础类扩展，更不提供UI组件，因此体积能够做到很小。然而，我实在看不出它和我熟悉的Prototype比有什么明显的优势——jQuery能做的各项独立的操作，Prototype都能做。后来用jQue... 阅读全文
让 JavaScript 轻松支持函数重载 (Part 2 - 实现)
2009-07-02 15:51 by Cat Chen, 4361 阅读, 收藏, 编辑
摘要：
在上一篇文章里，我们设计了一套能在JavaScript中描述函数重载的方法，这套方法依赖于一个叫做Overload的静态类，现在我们就来看看如何实现这个静态类。识别文本签名我们先来回顾一下上一篇文章中提到的Overload用例： var extend = Overload .add("*, ...", function(target) { }) .add("Boolean, *, ...", ... 阅读全文