Blogs

The other day, this book ended up on Andre’s desk from O’Reilly: slide:ology – The Art and Science of Creating Great Presentations. This book is less science and more art, but it’s full of inspiration and practical advice for people giving presentations. As someone who has seen a few talks, good and bad, a lot of this book rings true. In fact I think a lot of Nancy Duarte’s philosophy is similar to Edward Tufte, who is also a great presenter in his own right and a philosopher of the art of presenting – except maybe for the idea the Powerpoint is a tool to be tamed rather than one to be left out entirely.

Pick up a copy here.

Today our video Live-Lessons came out featuring over 8 hours of video instruction with complete code samples covering topics in JavaScript and general Ajax development. We’re really proud of this package and think that many of our customers would probably enjoy this material. If you are interested in honing your JavaScript skills, understanding more about the language fundamentals, or techniques in debugging – you’ve got to check this out.

Get it here!

Here is the complete lesson plan:

8+ Hours of Video Instruction

1.        Introduction to AJAX Learning Objectives         7:06

2.        JavaScript Basics Learning Objectives   82:15

3.        Ajax Debugging Learning Objectives     25:20

4.        The XMLHttpRequest Object and Data Learning Objectives 29:15

5.        Introduction to Ajax Frameworks Learning Objectives    127:45

6.        Test-Driven Ajax Development Learning Objectives       49:40

7.        Offline Ajax Learning Objectives          47:45

8.        Ajax Security Learning Objectives         41:39

9.        Ajax Usability Learning Objectives        36:44

10.       Ajax User Interface Patterns Learning Objectives          38:51

I wrote a fairly basic but handy JavaScript Object Inspector and Logger that works across different browsers. I call it “NitobiBug“.

Read all about it’s features here. I did a video tour also, which you can see here (turn down your volume – its loud!).

Check out the live demo here.

Essentially, what it does is provide a logging utility like Firebug’s console.log that properly inspects objects and shows you it’s members. If you log errors it formats them nicely too. If you inspect DOM elements with it, it attempts to show you where on the page they are and calculate their widths and heights and positions on the page. You can resize and drag NitobiBug around the page, and it tries to remember where you put it.

I use it all the time while I’m working on RobotReplay so I figured maybe other people would too. It’s certainly not the only such tool out there but I think it’s decent. Anyway, your comments are welcome!

Opera has released an alpha version of their answer to Firebug – DragonFly. Its a JavaScript/CSS/DOM/HTML/General debugger for your web apps. It has a lot of the features of Firebug and Drosera, but with some special sauce too.

The really cool thing about this tool is it assists with device-development too. Opera is the browser of choice on a lot of mobile devices, Nintendo Wii, and such. Firefly – er, DragonFly - helps us debug pages running natively ON those devices, which is an outstanding feature. I haven’t had occasion to try it out yet but will soon.

We use this service all the time. I used it on Nintendo.com, and I’m sure many of you could use it to. If you ever need an activity indicator, and want to be able to customize the background color, etc.. check this out:

http://www.ajaxload.info/

Love the token Web2 BETA logo up in the top right corner.

I was amazed to discover that the old Microsoft Compiler, QuickBasic lives on in some schools and actually has a developer community around it still. I remember doing Mode13h coding in QuickBasic to make little games and whatnot. Those were the days. Interstingly, QuickBasic 4.5 is still available for download on MSDN, whereas Windows 95 is not.

• QuickBasic on Wikipedia
• QuickBasic Community Site (QuickBasic News)
• QuickBasic Clone (FreeBasic)

Â

I recently decided I wanted to be able to play music from my MP3 library in my livingroom. Simple right? Well not if you are a technophile and gadgetophile like myself.

I ended up with an AppleTV (which I still haven’t unboxed) and a small media server for my music. My first problem was that my music library is totally disorganized with improperly tagged music, duplicates, and other junk riddled througout. I took it upon myself to fix this. Here’s what my research turned up.

Original Library size: 93GB

First step: Import it into iTunes and let iTunes organize your library. This will convert all your silly WMA’s and whatnot into M4a’s, get rid of the corrupted files and other junk that somehow crept into those directories over time. It will also do some filtering for files with wacky filenames (which probably arent valuable music anyway). This got rid of about 10GB of junk.
Next: Get yourself a free copy of Picard by MusicBrainz. This will do 3 things for you:

• Picard will scan your library and identify all of the known music files based on Amazon.com data (and their own database as I understand it). Tell it to rewrite your ID3 tags and blow away the old ones. It’s quite accurate. Then tell it to rename all the files and organize it into a new folder (not your iTunes folder). It will normalize all the artist names (so “feist” and “_feist” and “feiST” all become “Feist”, etc) and fix the track names and so-on.
• This will leave about 30% of your music yet-unidentified and untagged. Run the ’scan’ feature of picard on these remaining titles. This will take a digital ‘fingerprint’ (called a PUID) of the MP3 and try to identify it based on the online database. My experience was that this is VERY accurate.. really cool. Budget a full day and night for this process if you have a lot of music. It’s totally automated so you don’t need to be in front of your machine.
• This will leave you with about 15% of your music unidentified. You can then run the ‘Cluster’ feature of Picard on these titles. Picard will try to group your mp3’s into artist and album groups based on their tags and titles. I only kept a small number of these because I dont really want music that isnt properly tagged. I mostly kept the obscure ones that were tagged but didnt show up on Amazon.com.

The remainder of music I then deleted. zap!

Now you will want to get yourself a tool to help remove duplicate music (of which I had a LOT.. evidently from Limewire downloads and whatnot). I forked out $20Â for a program called Abee MP3 Duplicate Finder. This is overall a good program but VERY buggy (maybe it was just in Vista that it was buggy). Eventually I got Abee to identify tracks that were similar based on title, tags, and song length (really clever). Then it recommends which ones to delete and keep based on bitrate and song length (also clever). I looked at other programs for this part of the process but liked Abbe the best.. again.. beware. Some of the bugs I encountered were:

• The 2nd time I ran Abee it double-counted all my music. Had I gone ahead with the delete, it would have erased ALL my music. If this happens. Uninstall Abee completely, delete the folder from Program Files, reboot, and reinstall.
• Some songs it couldn’t delete for some reason.. Just press OK when this happens.. I dont know why it does this.
• Occasionally it threw more serious errors. This only seemed to happen when I was running other programs at the same time (like Firefox or Explorer). Don’t do this. If it happens. Uninstall, delete, reboot, reinstall as before.

Final Step: Clear your iTunes library and re-import all your music.

Once that was all done I had successfully trimmed my library down to 1 copy of each track and properly named, labelled, and tagged music. I let iTunes run all night and it got all the volume levels and downloaded album art.

The Final De-crufted Library size: 43GBÂ

Anyway, that was my experience. Thought some of you might at least find it interesting. Would be interested to hear what other people have done.

So I was looking into in-browser compression for my RobotReplay work..

This is actually a really hard thing to Google because of the confusion with gZipping JavaScript resources for lower file sizes on the web. That particular problem is easy to solve and commonplace. What’s really unique and interesting to me are the applications of gZipping content in JavaScript for offline storage or delayed transmission, or for compressing Ajax requests over an uncompressed connection. It could also be a little useful for the purposes of encoding your data from prying eyes.

Why we might want to perform gZip compression in a JavaScript program:

• Reduce data footprint before storing in offline storage (IE UserData, Flash SharedObject storage, sessionStorage, globalStorage, Google Gears, etc etc) since all of these have limits to how much you can store.
• Reducing bandwidth requirements for transmitting large amounts of data via an Ajax or cross-domain XHR request.

I can’t think of any others right now but I found this showing a working proof of concept of LZ77 (gZip) compression in JavaScript. There are some ‘catches’, however.

This was only really useful if you are compressing large-ish amounts of data (10K+) or the benefits derived from compression don’t outweigh the costs, which are: larger footprint for your JavaScript program, the inherent hassle of dealing with compressed data, and also performance.

Also, this proof of concept really illustrates how SLOW JavaScript is in general. Even compressing small amounts of data can take several seconds. So I wanted to find a better way to do this. So I worked on finding another (better) way to compress the data.

Then I had an idea.. what about using Flash to do the same thing and then use ExternalInterface to marshal between your JavaScript program and the Flash movie? It was worth an experiment.

So here is a demo showing compression of text data using the same algorithm in JavaScript and AS2 (Flash 9) via external Interface.

Note: in the chart below, smaller is better.

Again the demo is here: http://blogs.nitobi.com/alexei/demos/compression/index.htm

Download the source here: http://blogs.nitobi.com/alexei/demos/compression/nitobi_js_compression.zip

I stumbled onto a really interesting proof of concept today for doing Huffman-style tree compression in Ruby. The other popular symmetrical (ie: lossless) compression schemes being LZ77 (think: gZIP), and of course RLE (run length encoding.. think: GIF, PCX) Check out Building Huffman Compression in Ruby.

This may be somewhat academic because it’s worth noting that the core Ruby classes often include Zlib as part of their base compilation giving developers access to high-speed, robust gZip LZ77 compression out-of-the-box.

I’m going to do another post tomorrow on the theme of compression.

I’m always having trouble getting accurate window geometry values for the various browsers/doctypes and edge cases in between. So I never lose the link again, and to share the wealth I’m posting an exceedingly valuable link to Quirksmode on this subject:

http://www.quirksmode.org/js/doctypes.html