Bookmarklets (like GMailThis, Tumblr, BlogThis!) are beautiful yet mysterious and very confusing.

Their source code is always scrambled (or obfuscated) - therefore people who even have some background in HTML and Javascript programming find it hard to analyze and understand the underlying logic or workflow.

For instance, the cryptic code that follows is a Tumblr Bookmarklet that will post a text snippet, image or video from your current webpage to Tumblr.

javascript:var d=document,w=window,e=w.getSelection,k=d.getSelection, x=d.selection, s=(e?e():(k)?k():(x?x.createRange().text:0)), f='http://www.tumblr.com/share',l=d.location, e=encodeURIComponent,p='?v=3&u='+e(l.href) +'&t='+e(d.title) +'&s='+e(s), u=f+p; try{if(!/^(.*\.)?tumblr[^.]*$/.test(l.host))throw(0); tstbklt();}catch(z) {a =function(){if(!w.open(u,'t','toolbar=0, resizable=0,status=1, width=450,height=430'))l.href=u;}; if(/Firefox/.test(navigator.userAgent)) setTimeout(a,0);else a();}void(0)

Now if we format or beautify the same code with proper indents, linebreaks and whitespaces, it would be more readable and make sense to most developers. See the same Tumble Bookmarklet code but reformatted:

javascript: var d = document,
w = window,
e = w.getSelection,
k = d.getSelection,
x = d.selection,
s = (e ? e(): (k) ? k(): (x ? x.createRange().text: 0)),
f = 'http://www.tumblr.com/share',
l = d.location,
e = encodeURIComponent,
p = '?v=3&u=' + e(l.href) + '&t=' + e(d.title) + '&s=' + e(s),
u = f + p;
try {
    if ( ! /^(.*\.)?tumblr[^.]*$/.test(l.host))
        throw(0);
    tstbklt();
}
..[snip]..
void(0)

This was done using the free online beautifier tool for javascript available at http://elfz.laacz.lv/beautify/? - it's an open source PHP script that you are free to use on your own server.

For formatting code written in PHP, CSS, etc, you may try the prettyprinter.de/ - similar to Javascript beautifier but gives more options for formatting the output.