论坛首页 Web前端技术论坛

提示补全组件:Kissy Suggest

浏览 19120 次
该帖已经被评为良好帖
作者 正文
   发表时间:2009-07-18  

去年针对谷歌的搜索提示,发过一篇文章:从谷歌的一个Bug说起,谈谈键盘事件的兼容性。从那时开始,就一直想写一个适应中国本土环境的提示组件。

 

前不久做淘宝首页的性能优化,淘宝原来用的是 YUI AutoComplete, 但因其庞大的体积(压缩后 30k, 还需依赖 30k 的 datasource 组件),同时对中文输入法的支持不好(这是英美人士永远难以发现的 bug),使得 YUI AutoComplete 显得很鸡肋。这次做性能优化,索性重写了一个提示组件,目标是精简够用,适应本土环境

 

suggest.png

 

重写后的组件压缩后约 10k, 仅依赖 YUI2 的 yahoo-dom-event. 目前在淘宝已全面应用一个多月。现在开源出来,希望能对需要此功能的兄弟们有所帮助。源码地址:

 

http://kissy.googlecode.com/svn/trunk/src/suggest/

 

suggest-yui2.js 是源码,test.html 是测试页面,demo.html 是实例,demo-google.html 是利用该组件给谷歌恢复搜索提示的小玩意。如果在项目中真实使用,需要加载以下两个文件:

 

http://kissy.googlecode.com/svn/trunk/lib/yui2/yahoo-dom-event.js
http://kissy.googlecode.com/svn/trunk/build/suggest/suggest-yui2-min.js

 

可以很自信地说:这个组件目前无论在细节还是性能上,都是数一数二的。

 

欢迎试用和有效的建议。

 

PS:很感慨 Google 的产品,精致小巧,非常注意细节。Google 英文首页的搜索提示,看似简单,但极不简单。对键盘和鼠标等事件的细节处理上,没有看到比 Google 做得更好的。Kissy Suggest 在交互细节上基本上做到了和 Google 的一样,同时增加了对本土输入法的支持。

   发表时间:2009-07-18  
添加了下 svn 的 mimetype, 现在 demo 可以直接打开看了
0 请登录后投票
   发表时间:2009-07-19  
能做一个基于jquery的版本么
0 请登录后投票
   发表时间:2009-07-20  
谢谢楼主了,楼主能否谈谈后台应该如何优化处理呢?
0 请登录后投票
   发表时间:2009-07-20   最后修改:2009-07-20
太棒了。
原来一直以为很简单,后来写了才发现,太麻烦了。结果有一大堆细节问题 
lz这个太好了
0 请登录后投票
   发表时间:2009-07-20  
一直以为这个东西是很容易的,看到LZ说要几十K的JS,吓了我一跳.
我来研究研究看看LZ的杰作
0 请登录后投票
   发表时间:2009-07-20  
楼主这个补全比较强大好像呀,输入拼音也可以
0 请登录后投票
   发表时间:2009-07-21  
dingyuan 写道
能做一个基于jquery的版本么

之前在外文网站看过,好像有基于 jquery 的
0 请登录后投票
   发表时间:2009-07-21   最后修改:2009-07-21
淘宝?? 没有license问题吧?
0 请登录后投票
   发表时间:2009-07-21  

Jquery版本的请看这里http://www.vulgarisoip.com/2007/08/06/jquerysuggest-11/

0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics