Architecting Life » Tips

慎用 script 节点的 src 属性来传递参数

Xu Jiwei — Fri, 13 Nov 2009 14:49:45 +0000

在有些使用 javascript 来渲染数据的时候，为了能动态获取不同的数据，并且保持 javascript 代码的可扩展性，会将 javascript 代码中获取数据的部分需要的参数提取出来，做为参数放在 script 节点的外部。

一般来说，传递参数到 javascript 文件内部的方法有两种，一种是将参数写在一个 script 节点中，写成全局变量的方式的传递给紧接着这个 script 节点的外部 javascript 中，Google Analytics 就是使用这样的方式：

type="text/javascript">
var p1 = "v1", p2 = "v2";
</script>
type="text/javascript" src="foo.js"></script>

另外一种是将参数直接写在 script 节点的 src 属性中，相当于一个页面的查询字符串一样：

type="text/javascript" src="foo.js?p1=v1&p2=v2"></script>

不过，使用 script 节点的 src 属性来传递参数需要注意一个很重要的问题，那就是动态变化的 src 属性会导致缓存失效。

现在，为了网站性能的需要，一般都会将 javascript 文件放在独立的服务器上，并设置一个较长的过期时间，这样客户端只会在第一次访问网站时需要去下载这个 javascript 文件。但是，如果使用 src 来传递参数，就可能会使这种缓存策略失效。特别是 src 中存在动态参数的情况，例如统计脚本中如果有一个 ip 参数，那么访客每次连上线时，可能 ip 都会不同，就会导致 javascript 缓存失效了。

解决这个问题的方法也很简单，简单地的将 src 属性中的参数放到 script 节点的一个自定义属性中就可以了，例如 data-args，而 src 属性只需要保留一个时间戳就可以了。因为使用 src 属性来传递参数本来就需要定位 script 节点，所以改由 data-args 自定义属性来传递参数并不会增加额外的代码。只不过页面会通不过 w3c 的验证罢了 :)

<script type="text/javascript" src="foo.js" data-args="p1=v1&p2=v2"></script>

再次提醒，慎用 script 节点的 src 属性来传递参数 :)

[JavaScript] 慎用 somefunction.prototype

Xu Jiwei — Wed, 15 Oct 2008 03:01:19 +0000

在写 JavaScript 脚本的时候，为了创建一个类，如果不使用框架，一般情况我们都会使用 prototype 来给要创建的类增加公有方法，例如：

程序代码：[ 复制代码到剪贴板 ]

// code from xujiwei.cn
function Person(name) {
this.Name = name;
}
Person.prototype.SayHello = function() {
alert(‘Hello, ’ + this.Name);
}
Person.prototype.SayBye = function() {
alert(‘Goodbye, ’ + this.Name);
}

不过，有的时候，为了书写以及维护的方便，我们会把公有方法的声明写到一个对象里，然后赋值给 Person.prototype，例如：

程序代码：[ 复制代码到剪贴板 ]

// code from xujiwei.cn
function Person(name) {
this.Name = name;
}
Person.prototype = {
SayHello: function() {
alert(‘Hello, ’ + this.Name);
},
SayBye: function() {
alert(‘Goodbye, ’ + this.Name);
}
}

使用这种方式，在这个类具有大量公有方法的时候，就不需要维护许多的 Person 标识符，如果某一天这个类的名字需要改变，那么要改的地方只有两个，一个是 function 的声明，一个是 prototype 前面的标识符，如果是使用前一种方式的话，那么有多少个公有方法，就需要维护 N+1 个标识符了，虽然可以使用查找替换，但是从稳定上来说，查找替换可能会引起一些错误，这增加了维护的成本。

这种方式虽然给我们的维护增加了便利，但也引发了另外一个隐藏的问题，就是类的 constructor 属性丢失的问题。

程序代码：[ 复制代码到剪贴板 ]

// code from xujiwei.cn
function Person1(name) {
this.Name = name;
}
Person1.prototype.SayHello = function() {
alert(‘Hello, ’ + this.Name);
}
Person1.prototype.SayBye = function() {
alert(‘Goodbye, ’ + this.Name);
}
// code from xujiwei.cn
function Person2(name) {
this.Name = name;
}
Person2.prototype = {
SayHello: function() {
alert(‘Hello, ’ + this.Name);
},
SayBye: function() {
alert(‘Goodbye, ’ + this.Name);
}
}
alert(new Person1(‘Bill’).constructor);
alert(new Person2(‘Steve’).constructor);

运行上面的测试代码我们可以发现，Person1 的 constructor 属性为 Person1 类的构造函数，但是 Person2 的 constructor 属性却是 Object，那么在需要使用 constructor 属性来判断对象类型的时候，就会出现问题。

因此，在写 JavaScript 类的时候，如果不需要使用 constructor 属性来获取对象的类型，那么个人比较倾向于使用第二种写法，但是如果需要使用 constructor 属性以实现自己的反射机制或 GetType 函数等等，那么就要使用第一种写法。

当然，如果在实现自己反射机制或 GetType 函数时并不依赖 constructor 属性，那么两种写法都是可以的了，例如额外维护一个成员变量，用于标识自身的类型等。也可以使用一些现成的JS框架，有一些框架已经实现了JS中类的实现等，例如 js.class，这就看个人需要进行取舍了。

ASP中使用FileSystemObject时提高性能的一个小技巧

Xu Jiwei — Fri, 16 May 2008 14:45:30 +0000

在封装自己的FileSystemObject库的时候，测试的时候发现在文件夹或文件很多的时候，效率很低，显示一个文件夹需要2秒甚至更多，这让我很是奇怪，因为显示文件夹及文件信息的时候直接都是使用Folder及File对象的属性，这应该不会引起性能上的问题，但是事实却说明我的想法过于简单了。

按个测试了一下可能会是哪些属性引起的性能问题，在去掉Type也就是类型属性显示的时候，性能有了很大提高，之后的测试也证明了是Type属性的使用导致了性能问题。

仔细想了一下，Type引起性能低的原因应该是，引用Type属性所得到的是文件的具体类型信息，也就是我们在资源浏览器里看到的那样，比如TXT文件的类型就是显示为“文本文档”，但是这个类型信息却是存储在系统中，通过文件扩展名进行关联的。在FSO中使用Type属性的时候，对于每个File对象，FSO都需要根据扩展名去系统中检索这个扩展名对应的类型名称，这样，就极大的降低了性能。

因此，在使用FileSystemObject时，如果可以不使用File或者Folder对象的Type属性，就尽量不使用。

希望此文对你有所帮助。

by Xu Jiwei

提高Vista开始菜单文件夹展开速度的小技巧

Xu Jiwei — Sun, 04 May 2008 12:44:35 +0000

用了Vista一段时间，总是觉得Vista的开始菜单里的文件夹展开速度很慢，以前配置不是很好，可以理解为配置的原因，但是现在配置应该也不差了吧，怎么会还是这样呢。

某天玩电脑的时候突然想到，会不会是那个“高亮显示新安装的程序”的原因，试了一下，开始菜单里的文件夹展开速度果然快了很多。

如果你的Vista在进入开始菜单，展开文件夹的时候速度也是很慢的话，不妨试试禁止“高亮显示新安装的程序”，步骤是：在开始的微软徽标上右击，选择属性，然后进入“开始”菜单选项卡，点击“自定义”，打开“自定义’开始’菜单”对话框，在列表中找到“突出显示新安装的程序”，取消选中这个项目，然后确定两遍即可。

用好HoeKey：用快捷键控制iTunes

Xu Jiwei — Fri, 02 Mar 2007 13:28:17 +0000

用 Apple 的 iTunes 听歌很长时间了，特别喜欢它的保存音乐文件夹有序这个功能，这样我就不用愁添加mp3的时候再去管理文件夹了，以前用Winamp时就没有这个功能。

但是有一点，Winamp可以设置全局快捷键，可以让我在不打开播放器窗口的情况下控制mp3的播放，而iTunes就没有。于是用了这么长时间iTunes，一直是在托盘图标的菜单点控制mp3的播放。但是前些天在做东西的时候突然想到怎么去控制iTunes的播放，于是用Spy++截取了一下在iTunes窗口里用应用程序级快捷键控制播放时所用的消息，得到参数，然后又想到HoeKey可以自定义消息快捷键，于是就改了一下配置文件，使HoeKey能控制iTunes播放。

在iTunes窗口里，可以用Ctrl+→来播放下一首，Ctrl+←来播放上一首，使用空格键来暂停和开始播放，而使用的消息分别是WM_KEYDOWN和WM_CHAR。

于是，可以在HoeKey的配置文件中加入以下行：

~Z=Msg|iTunes|256|37|19202049    ; iTunes - Prev
~X=Msg|iTunes|256|39|19333121    ; iTunes - Next
~32=Msg|iTunes|258|32|18874369    ; iTunes - Pause

其中，~ 在HoeKey中对应的是 Win 键，Z 和 X 分别对应相应的字母键，而32对应的则是空格键，256和258分别是 WM_KEYDOWN 和 WM_CHAR 的值，后面跟的两个数字是参数，表示按下的键及控制键状态，这里不详细说，具体可以查阅MSDN。

那么，加了这些配置之后，就可以使用 Win+Z 让 iTunes 播放上一首歌，Win+X 播放下一首歌，以及使用 Win+空格来控制暂停和播放了。