Playing with Programs

I spent a morning playing with GWT – the Google Web Toolkit at spa2009, during We like GWT, we think you will too by Stuart Ervine and Franck Rasolo.

I promised Sushrut Bidwai to write about my experience. Did I like it? Lets’ see.

What I liked:

• We (I paired with Marc Evers) completed a number of quite usable features in the span of a morning (thankfully we did not have to write much back-end database code, with java verbosity / xml-osity  or anotation-osity seems unavoidable).
• Writing javascript in java feels a bit odd (as a language, I am taken more with javascript’s flexibility than java’s mid-level-language ‘you must spell everything out n times’, but being able to apply merciless refactoring tools on the client side was quite nice.
• Realizing whether the piece we were working on was on the server or client side was a bit confusing at first.
• Having programmed with Wicket quite a bit lately, and writing a GTK desktop application in C#, the programming model was quite familiar. Having all the behaviour that is (part of) a screen in one place feels convenient (as opposed to e.g. ruby on rails where behaviour tends to get spread out over controller code, view code and javascript files here and there).
• The client side code provided by GWT for formatting currency and dates was elegant and easy to use (take that Java API! )

Puzzles:

• Marc felt the AsyncCallbacks instances that are needed to glue front to back – end were at the wrong level of abstraction. I feel that may be, but it is already a step up from having half of the mechanism in javascript and the other half in the server side language.
• When working on a user interface, I like to be able to see changes instantly, so that I can play around and see what works best (and yes, tests will be written at some point, before, after or during). Some changes we could try instantly, in the special GWT toy browser, others needed a lengthy compile.

Things I liked less

• Even for the sample application, the compile times (when we changed some parts of the code, otherwise we could reload in the special browser) were already quite long. I am used to instant modifications (ruby, perl etc.) or very fast compiles (java with wicket) and have no desire to go back to the days of program-compile-coffee-run . Apparently it can be reduced by generating client javascript for just one browser (and generate everything in the build for instance)
• Unit Testing the client side code is ’special’ – can not use JUnit apparently. (this is me being a customer – I want more! testing javascript code is special otherwise as well).
• The ide (intellij idea)seemed necessary to magically tie bits of client and server code together that belonged together.

Verdict: I am a bit conflicted. For AJAX-heavy (more likely: AJAX-only, GWT does not seem to be meant for unobtrusive javascript) web applications it seems quite productive. However I would worry about the long compile times (maybe less if I knew how to rapidly testdrive the whole thing – this may be a beginners’ perspective. However I also heard some of my tweeps complain about compiles that take a couple of minutes).

If you are curious and want to go out and play for yourself, the example code is accessible through the Spa Conference wiki.

The drupal teaser delimiter is <!--break-->
I make this mini-post, because I was struggling for half an hour to get a post to show on the front page of agileopen.net with a longer summary than the two lines drupal defaulted to, and searching for this gave me links to pages with erroneous descriptions of the break syntax…

Read the discussion of why this solution over other teaser delimiters to understand why it works this way.

This took a lot of searching etc. I tried compiling by hand – did not work. Tried installing separate .deb from ‘testing’ – did not work.
Finally tried the backport from debian.meebey.net – that worked: monodevelop packages for debian etch .

Don’t forget to apt-get upgrade your existing mono packages, if any. happy coding

At times I am becoming a laggard when it comes to upgrading stuff… However, I love upgrades that focus solely on usability. A while back I switched a couple of wordpress blogs over to subversion. Before that, upgrading was a pain (download zip, unzip, move files around, hope that it works etc.), now it is easy – kudos to the wordpress team!

I got curious after reading the sneak peek announcement. I started looking for a 2.5 tag in subversion  – turns out there isn’t one yet, so I switched to trunk (’trunk’ is a subversion naming convention for the latest version of something):

svn sw http://svn.automattic.com/wordpress/trunk

And it seems to work flawlessly so far! If you want to see which tags are available in subversion, they have a subversion browser , and a how to use subversion. If you haven’t done so already, I recommend you switch your existing wordpress over to subversion. It makes (security) updates much, much easier to install. Even if you want to play on the safe side and use only stable versions (in the browser they are located under ‘tags’), I recommend you read up on how to update your wordpress with subversion, and give it a spin.

Something else that’s working well for me is keeping a separate blog (this one) for testing/experimental purposes, and a ‘main’ blog elsewhere.

As you may see, I’m experimenting here with fluid layouts, using Yahoo’s YUI Grids CSS.

At first using a template from guihackrz – but it’s not called pre-1.0-something for nothing – the template has some defects.

I’m thinking of re-creating a fluid wordpress theme based on another theme, and using for instance the The YUI Grids Builder
to create a fitting layout.

Today I got at least a header image in (examples on the Yahoo site I saw so far were text and blocks) – simply adding a style with a link to the image for the #hd element was enough.

The theme from buzzdroid seems promising. It’s missing the tags in the post body, but that can be ‘re-used’ from the out of the box kubrick theme.

I’ve made good use of firebug to measure and improve performance on a number of websites – . A participant in a course recommended yslow when I mentioned firebug. Yslow is an extension for firebug that gives you a list of recommendations for making your web page load faster. Looks good – I’ll give it a try, even though I’m quite satisfied after the first round of firebug-inspired optimizations (making sure the cache settings of various sites actually work – so that a browser requests most rarely changing items like graphics and stylesheets only once).

Like with the firebug measurements, it does not help you with suggestions on how to make the inside of your website faster (e.g. number of database queries). However, with things like caching, you first reduce the number of page loads, so that you can later focus on the most important ‘inside’ things to improve.

firebug is a plugin for firefox that makes configuring out html pages and the stuff in it a lot easier – inspecting and modifying html, css, javascript and, last but not least, showing all the files that are loaded when a page loads. The last thing is great to check which things are cached (that makes a page much faster to load, and decreases the things your server has to serve – thus increasing its’ capacity).

I’m working on a couple of sites, and firebug has been very helpful. I especially like the javascript console, that helped me to get some difficult FireWatir tests to run – the console allows me to see what javascript works in the page, and do little experiments that I can then transfer to the test script once it works.

The only downside is that firebug does not seem to play nicely with some other firefox extensions (most notably web developer toolbar and possibly selenium), so if you try it out you might want to do so in a separate profile. I find the effort worth it though – firebug makes my try-automated integrationtest-code cycle a lot quicker…

Right now I have firebug side by side with jssh (the javascript shell needed by FireWatir), and that works well.

I’m brushing up on basic javascript.

I stumbled across links to kryogenix. Kryogenix has some very unobtrusive ways to do sortable tables, search keyword highlighting and explorer like tree views and more. Each of them requiring only that you include a javascript file, add a few lines of CSS stylesheet code, and (for the tree view and the table), add a “class” to one table or list. They are unobtrusive, in that your site will still work if javascript is disabled, or your browser does not support everything.

A simple explanation for adding and removing elements on a web page (using document object model (DOM) and javascript): javascript tutorial – dom nodes and tree .

The reason I’m brushing up on javascript, is that I want to write integration tests with FireWatir for pages that have a TinyMCE editor in them. I did an experiment and had it working before, I threw it away accidentally and have to re-create it. Throwing something away is a good way to really learn something (although it takes more time…). So the second time, I’m taking the time to understand more about modifying pages with javascript, documenting my trail for the next time, and save the results in subversion…

This list of favourite wordpress plugins is worth checking out. I’ve been only using a few so far, and am very happy with: akismet (anti-spam), Ultimate tag warrior (tagclouds) and some of the links in this post will be created by sh-autolink. I’m also still very happy with wordpress itself

plugins from the list that look attractive:

• Sidebar Widgets – reorganize the sidebar without modifying the template
• openid plugin – an open way for guests to keep their account data (such as e-mail addresses) in one place
• wordpress Admin Drop Down Menu

this list of related entry plugins contains a snippet for ultimate tag warrior that lists related posts based on their tags. Seems worth checking out.

Some plugins by Alex King that seem worth checking out :

• Articles – make a list of articles that you select outside the chronology
• Link Harvest – This plugin will go through all of your posts and pages and compile a list of all external links.
• Popularity contest – This plugin will help you see which of your posts are most popular

Charles Weir and yours truly made a small script to combine multiple horoscopes into one (the exercises some people come up with….:)

We completed a minimal implementation – only for taurus (could easily be parameterized in the next bit). It consists of a shell script that downloads a horoscope from yahoo, and downloads one from astrology online. It’s two scripts, since we extracted the extraction code for astrology online to a script called …extract.pl.

rm -f taurus*
rm -f daily.htm*
wget http://www.astrology-online.com/daily.htm 2> wget1.out
./extract.pl daily.htm > first.txt

wget http://astrology.yahoo.com/astrology/general/dailyoverview/taurus 2> wget2.out
cat taurus | grep Quickie  | sed 's/<.*b>(.*).*>/1/' > second.txt

cat *.txt

extract.pl :

#!/usr/bin/perl -w

while ( <> )
{
if (/CHANGE TAURUS/)
{
$printing = 1;
next;
}
if (/END TAURUS/)
{
$printing = 0;
}
if ($printing)
{ print ;}

}