Category: Ajax

GWT 2.0: Cool Beans on In Browser Development Mode

gwt

I have a short list of things that I don't like about GWT. They are:

  1. You have to use a special browser to debug in Java. That browser doesn't always behave the way IE or Firefox or Safari does. And you need OS specific distributions which can make it a little tricky to share a project between developers with different OS platforms.
  2. GWT apps download as a massive hunk of code. There's no way to dynamically load code as you need it.
  3. Building UI's dynamically, through a sort of XUL mechanism is a pain in the ass for non-standard components. Just talk to the Vaadin folks about the hoops they had to jump through.
  4. The annoying dependency on SWT for tests.

So, what does 2.0 promise? To resolve these four things, and a few more. Check out the GWT 2.0 Milestone 1 release announcement:

In-Browser Development Mode: Prior to 2.0, GWT hosted mode provided a special-purpose "hosted browser" to debug your GWT code. In 2.0, the web page being debugged is viewed within a regular-old browser. Development mode is supported through the use of a native-code plugin for each browser. In other words, you can use development mode directly from Safari, Firefox, IE, and Chrome.

Code Splitting: Developer-guided code splitting allows you to chunk your GWT code into multiple fragments for faster startup. Imagine having to download a whole movie before being able to watch it. Well, that's what you have to do with most Ajax apps these days -- download the whole thing before using it. With code splitting, you can arrange
to load just the minimum script needed to get the application running and the user interacting, while the rest of the app is downloaded as needed.

Declarative User Interface: GWT's UiBinder now allows you to create user interfaces mostly declaratively. Previously, widgets had to be created and assembled programmatically, requiring lots of code. Now, you can use XML to declare your UI, making the code more readable, easier to maintain, and faster to develop. The Mail sample has been updated to use the new declarative UI.

Bundling of resources (ClientBundle): GWT has shipped with ImageBundles since GWT v1.4, giving developers automatic spriting of images. ClientBundle generalizes this technique, bringing the power of combining and optimizing resources into one download to things like text files, CSS, and XML. This means fewer network round trips, which in turn can decrease application latency -- especially on mobile applications.

Using HtmlUnit for running GWT tests: GWT 2.0 no longer uses SWT or the old mozilla code (on linux) to run GWT tests. Instead, it uses HtmlUnit as the built-in browser. HtmlUnit is 100% Java. This means there is a single GWT distribution for linux, mac, and windows, and debugging GWT Tests in development mode can be done entirely in a Java debugger.

Looks like Xmas has come early. I've been working with the browser plugin for a little bit and it is just a joy to use. One down side, of course, is that Intellij 9.0 will be out of date re: GWT the day it is released. ;-)

Topics:

Javascript debugging and testing in the wild (Prototype bug when using array.flatten in IE)

I had to dig into a production issue the other day that presented itself like this:
There was a piece of javascript code that iterated over some dom elements, gathered ids into 2 arrays, ran a validation check, and then flattened the arrays to add them to the url.

On firefox, opera, and chrome this was working correctly, and had been tested by the developers, but on IE 7 it isn't working, and the problem wasn't detected until it made it out to production. (Which raises a point about testing in IE during QA, which I'll get to in a sec).

I started my investigation doing what I'd call "poor man's debugging", putting some alerts in, breaking up the code a bit to make it easier to inspect, etc. Normally I don't do this when testing in Firefox, because I have Firebug, but in IE I always seem to start with the basics to get my bearings, then quickly move to a more pragmatic approach.

Then I started using firebug-lite, confirming that I can see the info I need, and I reverted my changes to the code so that I could verify that I hadn't introduced any issues.
Continue reading »

Don’t be lazy, download a good browser

Why are we developers still taking a hit for Microsoft's IE6 by doing additional work for it? Well we are certainly not eager about it . "The Market" is directing us by showing us that people use it a lot.

The market says that about 15% of people today are using IE6 which is 8 years old now.

Nothing to be surprised about.

Recently, we at Pathfinder were presented with statistics of usage for a desktop software created in-house showing the biggest drop in workflow at software installation reinforcing the point that people have a hard time installing software, so why would they go around installing a new browser when they already have one? Most people are under the impression that "the site" or "the internet" doesn't work and not the browser they are using and there's nobody there to tell most people what the problem really is.
Continue reading »

Topics: , , , ,

GWTUML – Just Enough UML for Wikis

r243screenshotFlorian Mounier has spent the last six months developing GWT UML, a slick little UML diagramming tool written in, obviously, GWT. It's smooth, good looking, supports class, object and sequence diagrams. You can save your diagram as a url or export it to an SVG. You wouldn't try to do model driven development with it, but for embedding in a development wiki, this thing could rock.

You can find more information at the google code project and check out a demo here.

Topics: ,

IE8: That Sinking Feeling

power dump

When a new browser comes out, like IE8, the verdict usually rolls in over the course of a few weeks as our QA testing on various web projects bumps up against its limitations. It's too early for us to render a verdict, but the signs have not been good and continue to be negative.

The evidence continues to trickle in. Louis-Rémi Babé weighs in with his grim assessment:

  • The JavaScript performance on IE8 is still lousy.
  • Useful tags such as <canvas>, <svg>, <video> are still missing.
  • CSS3 is minimally supported. (I agree that this is good news for web developers since we get to charge more money for all the extra effort that goes into IE8 work.)

To top it all off, Vector Markup Language (VML) is freshly broken. It's one of those sad and frustrating stories. Read up on it here and feel sorry for all of those framework developers who have to crowbar in several hacks for all of the garbage in IE8.

Topics: ,

IT Mill Toolkit 5 out of Beta

itmill_logoWith the release of IT Mill Toolkit 5.3.0, the server-side RIA framework is now ready for production. I announced the initial release of 5.0 back in December of 2007. Since that time, IT Mill 5 has gone through several revisions and the release of GWT 1.5 (which means you can use Java 5 now on both the client and the server). As a reminder, server-side RIA frameworks let you write your app completely in the server and uses a client-side Ajax engine to render the interface. The nice wrinkle with IT Mill is that both the server side and the client side are written in Java, so if you want to add a component, you don't have to break out the JavaScript (see the extensive and high quality reference manual for details on how to develop your own custom components in GWT). If you're a Java shop, that's got to be a good thing.

Chicago JavaScript Meetup Group draws a big audience with varied skill levels

Chicago JavaScript Meetup Group

The Chicago JavaScript Meetup Group spurred more than 50 of its members to brave harsh weather Thursday night for the group's fourth free get-together since its founding last October.

Organizer Vlad Didenko led the charge with an in-depth look at Firebug, while assistant organizer Justin Meyer contributed a discussion of Ajax fundamentals.

Continue reading »

jQuery 1.3: Good stuff, but the API browser’s the real news

jQuery logo

I'm as geeked about jQuery's 1.3 release as the next developer. But I'm even more excited about the new API browser developed by Remy Sharp and available here.

For as long as I've been a jQuery user - going on 18 months now - I've been frustrated by the slow speed and sometimes intermittent availability of the jQuery documentation site. Now we've got a blazing-fast API browser that presents jQuery Core and jQuery UI side by side in the same cool interface. Better yet, it's available as an Adobe AIR app for offline viewing. Sweet!

I could quibble about the lack of bookmarkable URLs and the occasionally sparse documentation of corner cases. Instead, I'll just remain upbeat about this huge step in the right direction. No matter how intuitive jQuery's API, it's a powerful library whose roster of methods continues to grow. Nothing speeds up development faster than quick, persistent access to quality API documentation.

jQuery 1.3: Plugins continue to migrate to the core

jQuery logo

jQuery celebrated its third birthday Wednesday with the release of the brand-new 1.3 version. This latest release includes a bunch of cool new stuff which has already been discussed to death elsewhere. To me, however, the most interesting aspect of jQuery 1.3 is the movement of former plugin functionality to the core library.

Live events are a new twist on the venerable, and indispensable, Live Query plugin, while the upgraded, more granular effects queues were previously tackled by add-on authors. IMHO, this kind of migration is A Good Thing, providing greater parity with other core JavaScript and effects libraries (such as Scriptaculous's FX queue) while offering compelling feature differentiation (event binding throughout the full lifecycle of an Ajax page).

2009 Prediction – The End of Ajax

It has been a good run, but Ajax the buzzword will dip below the radar in 2009. That's not to say that we'll all stop writing JavaScript and using XHR in the coming year -- quite the contrary. Full 100% of web applications will incorporate Ajax technologies, we just will use the "Ajax" buzzword less and less, much as "HTML" became just another acronymic noun in the early days of the web. So that's not really controversial.

What's really going to happen in 2009 that will impact all of us RIA developers? The first raft of Ajax-enable webapps will be undergoing maintenance. Supportability is the real test of frameworks, architectures and designs. How easy are they to support? How painful is the life of a maintenance programmer working on a Dojo codebase versus a JQuery codebase?

We've been emphasizing the use of application level MVC frameworks here of late.Why? Because we feel that the best and most sustainable metaphor for RIA's is that of the desktop component GUI, not of the souped up webapp -- client/server making its triumphant return. Without this guiding principle -- that we are writing applications that consume backend services rather than backend services that display interfaces -- we face escalating development and maintenance costs.

I hope then to see two front end web development trends for the coming year:

  1. Abstraction away from the underlying browser platform. Widgets, components, whatever you call them; the average front end web developer shouldn't have to tangle with the DOM or low-level browser events.
  2. Adoption of application level MVC frameworks like PureMVC. A standard way of wiring up complex GUI's will save us from ourselves. See Swing for a cautionary tale of woe.

What are you predictions for the coming year?

GWT and the Discipline of MVC

When you're developing a desktop or GWT application you're going to go through a bunch of iterations, tweaking the UI, adding components, etc. Sometimes in all of that work it is very tempting to take a shortcut and update a view directly from a controller (label.setText(model.messsageString)). That way lies madness. Before long you've got your view code strewn across the length and breadth of your application. Change the view or some aspect of the model and you're on a refactoring of biblical proportions.

In fact there's never a good time to break out of MVC, but sometimes you just don't know what sort of Observable your model should be. Will you be using a table, a tree, some custom component? In those situations I try to preserve MVC while punting the hard decision until later. To this end, I've written a little set of utility classes called SimpleModel. How do you use SimpleModel?
Continue reading »

Topics: , ,

Pimp my jQuery: Five plugins to replace the features Prototype and Scriptaculous users expect

jQuery logo

Ajax pros, especially in the Rails world, often know the Prototype and Scriptaculous JavaScript libraries inside and out. When faced with the prospect of writing on top of the competing jQuery framework, they may quickly stumble upon seemingly missing features.

The culprit? jQuery's less-is-more approach, in which advanced or specialized features come via plugins instead of the core library. The greater reliance on single-purpose plugins gives jQuery a lean footprint and a vibrant ecosystem, but they come at a cost. You often must rope in several plugins to accomplish things Prototype and Scriptaculous can do out of the box.

If you want to encourage your team to step out of the Prototaculous mindset, it helps to have a readymade list of plugins that approximate those libraries' core features. At this point jQuery and Prototype approach feature parity, but once Scriptaculous is in the mix, jQuery relies on multiple plugins to keep up with the Joneses. Here's a quick stab at how to trick out jQuery:

Continue reading »

GWTQuery – JQuery-like Syntax in GWT

Many times open source projects are mute -- they have insufficient documentation. Good technical blogs can function as a sort of ad-hoc documentation. That's what I've tried to do, most recently with my series of posts on GWT and OpenSocial. Vinay, over at Web Technology I/O, often does the same. He's got a great post about Ray Cromwell's GwtQuery (JQuery-like syntax in GWT) and how to make it work.

I've been tinkering with this tool as well and am going to do my own writeup, but thought I'd give you all the heads up. BTW, according to Vinay, the compiled GWT JavaScript for GwtQuery clocks in at 712 bytes!! So much for GWT bloat.

Topics: , ,

GWT, Gadgets and OpenSocial, Part 2

Note: It is assumed that you know your way around GWT and Eclipse for purposes of this tutorial.

While developing OpenSocial applications can be a bit tricky, getting set up to develop can be a real pain in the neck. For this installment of OpenSocial and GWT, I'm going to go through the basics of setting up a simple Hello World gadget with iGoogle. We'll get into the details of signing up for other OpenSocial containers, testing, and so on, later. Right now we're just going to do the basics.

So, what do you need to build a Google Gadget with GWT for iGoogle? You need the following:

  1. The Google Web Toolkit
  2. The GWT Google Gadget API
  3. An account on iGoogle
  4. Access to the iGoogle sandbox
  5. Some public server space so you can serve up your gadget to iGoogle

Continue reading »

The Hidden Power of Canvas

Projective TransformWhenever we have Flash versus DHTML discussions in the office, someone usually utters the words "you probably can't do it, unless you used Canvas and some fancy JavaScript..."

At times that can seem like a cop out, an admission of defeat in the face of the Flash arsenal of graphic effects. Somtimes, like today, it seems more like a visionary declaration of the power of Canvas. Check out Steven Wittens' use of Canvas for projective texturing. Maybe there is a little bit more coolness left in these Ajax bones.

Topics: , ,

Launch: Pathfinder Newsletter

    Get a monthly update on best practices for delivering successful software.

    Subscribe via email


    Subscribe via RSS      RSS icon

Topics

Search

WordPress

Comments about this site: info@pathf.com