江边潮未尽，枫红一季秋

最近花了比较多的时间在自己开发的一个数据库监控系统上。监控系统的架构很简单，主要用shell+perl+SQL采集数据到一个MySQL数据库中，然后使用php来做web展示。对于仅仅定位于团队内部使用的小系统来说，这样的架构足够了，简单有效。

为了将数据库中的一些详细数据展示到web页面，采用了PEAR::HTML_Table，可以将SQL查询的结果直接转换成html表格。HTML_Table功能比较单一，如果要实现分页与排序的功能，还需要借助SQL语句。在MySQL中，如果要根据选择的任何一列都能用来排序的话，只要该列没有索引，就必须filesort进行实际的排序。由于系统中没有引入cache层，每次页面刷新都要到数据库中执行排序的SQL，性能是比较差的。

因此便想用javascript在客户端实现分页与排序，数据库中只要一次性选出需要的数据即可。jQuery是目前比较流行的一个javascript框架，以前也是久闻其名，但一直没有用过。Google了一把，发现其用法还是非常简单的，短短几行代码，就可以实现我所想要的效果。jQuery功能强大，但其实就是一个120K左右的js文件，并且还支持插件，分页功能就是通过一个叫tablesorter的插件实现的。

使用jQuery+Tablesorter实现客户端分页与排序，只需要10几行代码足矣。唯一的要求，就是html的table标签内要包含thead和tbody部分，这可以调用HTML_Table::getHeader()生成thead，调用HTML_Table::getBody()生成tbody部分。然后在需要展示数据的页面引入jQuery和Tablesorter的js库文件，再加上几行代码即可实现客户端javascript对数据table的分页与排序，并且还支持动态修改每页数据行数，支持多列排序等。具体的例子和代码，都可以在本文的链接中找到，就不在这里多说了。

Web开发我是外行，几年前学了点php的皮毛，知识已经多年没有更新过了。Ajax和web2.0的年代，javascript确实重新焕发了青春，像jQuery这样的框架，真的是不可多得的好东西，对于像我这样的初学者，也能很快上手做出相当不错的页面效果，这才是技术的生产力啊。

当然，在客户端做分页和排序有利也有弊。因为所有数据是一开始就全部从数据库中选取并返回客户端的，如果数据量比较大，那么第一次加载页面的时间就会比较长，并且可能占用客户端过多的资源。所以必须仔细权衡，在合适的场景用合适的技术。