Google Suggest Dissected Follow-up...
Thanks for all of the feedback, good and bad - if I couldn't take criticism, I wouldn't be posting things publicly, right? My New Years Resolution is to think about what I am writing, and improve my writing ability.
I just wanted to make sure that everyone understands that what I was writing about in my last post was an attempt to learn, and in turn teach people about the client-side technologies used within Google Suggest. The true technology, as many people pointed out, is the incredible back-end search / server technology, which isn't about to be duplicated by anyone that wasn't already reverse engineering everything that Google is doing. I'm hoping to that we can all start building better web interfaces and that they become common-place a year or two from now. I'm not trying to undermine / undo someone's hard work at Google. For those that weren't technical enough to understand what I had written, I haven't hacked or cracked anything :)
I have some good ideas for some other cool interfaces and client/server things I'd like to look at and investigate over the next couple of weeks - stay tuned.
12 Comments:
I cant believe anyone has criticised you for your excellent dissection of the Google code which is totally public anyway (thats the problem with client side web code, anyone can get at it). If anything, youre helping rush in the next wave of web applications that can stream data in asynchronously without page loads by doing this. Ive already looked at incorporating this technique into my own site redesign, because it puts me as the developer back in control of the user experience. For example, If I want to put up a "loading, please wait" indicator up when someone clicks a link, not have the page refresh and layout redownload, and avoid frames, its now possible.
A side effect of this ability to download data without page refreshes could be that flash, and flex/laszlo etc, may not be the future of the web any more.
Pete King.
Excellent job, please keep it up. I am starting a project to revamp an existing web-app and have been scouring the net for tips and the latest tech. Your article was very enlightening, and started me thinking
about what can be done client side with javascript.
There's not nearly enough thoughtful discussion of programming techniques out there and what is available tends to be pompous academic ranting so, thank you.
The cool user interface is not really what's cool about it. What's hard is to do something good with JavaScript, which Google has succeded with. Implementing the same UI with a regular programming language is not a big deal.
Everytime I see JavaScript on a page, it looks like a desperate call for real client side programming.
HTML has never been good for application development. Isn't it time to realize that and find a technology that has both the advantages of web and of OS applications?
This is something I've been working on for an internal database. It's helped me solve two problems I've been working on. 1. Getting IE to work consistantly, and 2. Finding a better way to control the frequency of requests, I was working on the problem serverside.
I've been putting off working on this until Firefox 1.0 was released, as I won't develop anything that works only in IE.
The application I'm working on is for autocompleting sales orders when the customer info has been entered in previously. Also I'm using this to quickly pull up information from a work order database.
Another use is to generate dynamic forms based on information filled into the form and other specific infomation in the database.
Would the original un-obfuscated gpl source be useful?
http://cvs.sourceforge.net/viewcvs.py/gallery/gallery2/lib/javascript/AutoComplete.js
It also needs this:
http://cvs.sourceforge.net/viewcvs.py/gallery/gallery2/lib/javascript/XmlHttp.js
I'm sure that it was changed when implemented at google, but this works.
Great Stuff! Investing time and energy in breaking this stuff down and sharing it with the developers at large is probably the best way to start moving the masses toward better interface driven "web apps".
I came across http://www.walterzorn.com about a year ago and his drag and drop javascript library inspired me in the same way.
It looks really good now, Chris. I can appreciate the extra effort you've put into your spelling and grammar.
I'm looking forward to reading your future posts.
Cheers,
Matt Ryall
Just had a quick read through your initial Google Suggest Dissection - nice stuff, and I must say I'm glad I found your site. I'll definitely be back to read more. (Oh - I went to UW as well (90-94/5), grew up in Ottawa and played sports against Pete Worthing, and am in Ottawa blogging right now. Small world...)
Cheers,
Derek Featherstone
Great job on dissecting the javascript code!
I only found out about xmlhttprequest last week myself, and already tried to implement a small script that takes advantage of the asyncronous nature of the object.
I'm running a nucleus site (though most of the nucleus code was re-written to fit our needs), and one of the "hacks" was that in the post page there's a link text-box which doesn't exist in nucleus. After some basic url-validation, the url is sent via xmlhttprequest to a local page that tries to see if the entered url is valid. (Had to figure out the hard way that xmlhttprequest doesn't allow direct connects to a page outside the host... or does it?? Haven't been able to figure it out).
The xmlhttp part works excellently, as it has a relatively simple part to perform. "GET" the local page and display the text it produces (using the innerHTML property for a < span > tag), which contains information on the validity of the entered link (bad host, '404', etc)!!! Instant, dynamic and powerful url validation!
I think for the first time I will tip my hat to Microsoft.. :)
Hi Chris,
Nice job! Reading through your posts and Google's javascript codes definitely taught me some tricks.
Google's code is nice, however, seems cache of results, that is, "_resultCache" in your code or named "Ua" in the original one, is an "Object", which makes it possible to insert or read records, but cannot delete any.
just my two cents, if you guys r going to have a lot of records sending back in your projects, such as the dictionary one, maybe the performance could be improved by replace the "Object" with a "HashTable".
Yeah there's no "HashTable" in Javascript language, however it could be realized using "Array".
yours,
athos.
codes, from Internet :) :
///// Hashtable in JavaScript /////
function Hashtable() {
this.clear = hashtable_clear;
this.containsKey = hashtable_containsKey;
this.containsValue = hashtable_containsValue;
this.get = hashtable_get;
this.isEmpty = hashtable_isEmpty;
this.keys = hashtable_keys;
this.put = hashtable_put;
this.remove = hashtable_remove;
this.size = hashtable_size;
this.toString = hashtable_toString;
this.values = hashtable_values;
this.hashtable = new Array();
}
/*=======Private methods for internal use only========*/
function hashtable_clear(){
this.hashtable = new Array();
}
function hashtable_containsKey(key){
var exists = false;
for (var i in this.hashtable) {
if (i == key && this.hashtable[i] != null) {
exists = true;
break;
}
}
return exists;
}
function hashtable_containsValue(value){
var contains = false;
if (value != null) {
for (var i in this.hashtable) {
if (this.hashtable[i] == value) {
contains = true;
break;
}
}
}
return contains;
}
function hashtable_get(key){
return this.hashtable[key];
}
function hashtable_isEmpty(){
return (parseInt(this.size()) == 0) ? true : false;
}
function hashtable_keys(){
var keys = new Array();
for (var i in this.hashtable) {
if (this.hashtable[i] != null) keys.push(i);
}
return keys;
}
function hashtable_put(key, value){
if (key == null || value == null) {
throw "NullPointerException {"
+ key + "},{" + value + "}";
}
else{
this.hashtable[key] = value;
}
}
function hashtable_remove(key){
var rtn = this.hashtable[key];
this.hashtable[key] = null;
return rtn;
}
function hashtable_size(){
var size = 0;
for (var i in this.hashtable) {
if (this.hashtable[i] != null) size ++;
}
return size;
}
function hashtable_toString(){
var result = "";
for (var i in this.hashtable) {
if (this.hashtable[i] != null)
result += "{" + i + "},{"
+ this.hashtable[i] + "}\n";
}
return result;
}
function hashtable_values(){
var values = new Array();
for (var i in this.hashtable) {
if (this.hashtable[i] != null) values.push(this.hashtable[i]);
}
return values;
}
First, thanks for the dissection! It is far from complete but much work has been done.
Second, the ac.js from Google is copyrighted and was never released in public domain or whatever. Ask a lawyer, using ac.js (or derived code) is a no-no for a commercial project. People, beware.
Third, the backend is not that big actually. I've just made up an autocompleting text box on ac.js for all MSDN functions. p3-500 + FreeBSD + mod_perl + Tree::Trie (which is not that fast) work nice IN REAL TIME. One shitty box serves a hundred thousand terms. Google Suggest index is probably 10 to 100 times bigger, so i'd estimate about 50 good boxes as a backend.
Hi Cris. I have another un-obfuscate code in http://hamadrias.freezope.org/gmail_script.js
(use save as...)
Post a Comment
<< Home