Why I gave up on JQuery UI's autocomplete

20 October 2010   3 comments   Javascript

http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/

Mind That Age!

This blog post is 7 years old! Most likely, its content is outdated. Especially if it's technical.

Powered by Fusion×

I was happily using Jörn Zaefferer's jQuery autocomplete plugin but then I found out that it had been deprecated and I should instead use the jQuery UI's autocomplete plugin instead.

After "upgrading" I started getting suspicious. Is it actually worse than the old one?

First, about the CSS. If you're not already loading the jQuery CSS you would have to add an extra 21,000 bytes file (which loads 80Kb of images) as opposed to the old jquery.autocomplete.css which was only 810 bytes.

Secondly, the new jQuery UI Autocomplete plugin didn't support any nice highlighting so you have to write your own and it can quickly get ugly. I wrote one myself and it gets nasty and you have to do your own escaping.

Thirdly, if you just need the autocomplete you'll also need UI core, UI position and UI widget. The minified file weighs in on 19Kb. The packed jquery.autocomplete.pack.js weighs in on just 8Kb.

Fourthly, speed. The jQuery UI Autocomplete feels more sluggish in loading and rendering. Granted, in my work I often have Firebug switch on but just generally it feels slower when using. Perhaps I've made it extra slow with my hackish attempt to make it highlight.

But... Although the list of options available in the old Autocomplete the number of options available in the new jQuery UI Autocomplete seems pretty nifty too. You mileage will vary. Another benefit of the jQuery UI Autocomplete is that it now seems the more maintained project. I don't see a lot of activity but at least it doesn't say "Deprecated" like it does on the old Autocomplete.

Comments

Waldemar Kornewald
We've published the source of our autocomplete fork here:

http://bitbucket.org/twanschik/nonrel-search/src/tip/search/media/search/

It provides a much better user experience. E.g., you can click, hold the mouse button, and move the cursor. In the original implementation this would select text. Now it behaves like the desktop counterpart. Also, when you click inside the text box it'll automatically open a little tooltip indicating that this text field has auto-completion. Too often this is far from obvious. Also, the text field has a mode in which it acts like a drop-down field with auto-completion.
Richard
I have many issues with the new official plugin as well.

For instance, the delay does not seem to work consistently - try setting up an autocomplete with a remote source, set the delay to say 3 seconds, then keep spamming any character key - the autocomplete should never trigger the ajax request, but after the initial 3 seconds, it triggers constantly.

or try hitting a space, then the autocomplete will trigger after every single character thereafter.
Michael Morgenstern
To be fair, a lot of that load is already cached by the browser.
Thank you for posting a comment

Your email will never ever be published


Related posts

Previous:
Nasty JavaScript wart (or rather, don't take shortcuts) 18 October 2010
Next:
How I made my MongoDB based web app 10 times faster 21 October 2010
Related by Keyword:
A quicksearch for Bugzilla using Autocompeter 27 January 2016
Some tips on learning React 04 August 2015
Autocompeter.com 02 April 2015
Difference between $.data('foo') and $.attr('data-foo') in jQuery 10 June 2012
QUnit testing my jQuery Mobile site in full swing 17 March 2011
Related by Text:
Local NodeJS development environment with Nginx 01 September 2010
US License Plate Spotter (part 2) 08 August 2012
Crash-stats just became a whole lot faster 25 August 2015
Ultrafast loading of CSS 01 September 2017
EditArea vs. CodePress 03 January 2008