The Design of Software (CLOSED)

A public forum for discussing the design of software, from the user interface to the code architecture. Now closed.

The "Design of Software" discussion group has been merged with the main Joel on Software discussion group.

The archives will remain online indefinitely.

graphics programming on AJAX-based sites

I feel like I should know this, but how are the graphical user interfaces done on AJAX-based websites such as Gmail? 

As best as I can figure out, that level of graphics programming on rich internet applications that is not done with Flash is done with SVG.  Using SVG to create the level of graphics that a lot of Google applications have requires effort (and knowledge) that only very large development shops can expend.
Tuesday, May 30, 2006
Today creating Ajax applications is complex work, which only large companies like Google can afford. Besides many other new technologies will be available, each suitable for certain tasks, for example X3D for virtual reality or 3D-games.

SVG, Adobe’s XAML and Microsoft’s XAML are great technologies to build 2D-graphics applications, having their own relative strengths and weaknesses.

Many companies (e.g. working to build next generation frameworks to address this problem. One interesting idea is to build Ajax GUI API for next generation applications is presented at:

Today, even Microsoft is using SVG to display maps on Mozilla  and Google is using VML in IE(processor to SVG/XAML). The question is not, if we use SVG/MXML/XAML to build 2D/3D applications but when we will be forced to use them to build applications.
Tuesday, May 30, 2006
HTML.  Nothing particularly fancy.  They use VML for the route overlays on Google Maps, but other than that, it's pretty much all HTML.
SomeBody Send private email
Tuesday, May 30, 2006
That is how all things start: small experiments and slowly they add more and more. Next thing are interactive landmark with pop-up windows and step-by-step increments to differentiate their offerings.

The significance of this is: Microsoft is forced to use SVG (which is competitive technology to their own upcoming XAML) to match the Google maps.

The Vector Graphics are essential to build future graphics applications. DHTML and GIF images have many limitations. For example, how one can show Airplanes in air space, using GIF images. It is very hard to do manipulations such as scale, rotate or change color of the GIF images, where as these operations can be accomplished by simple changing one or two attributes for the vector based images.

If it is a GIF image, a DHTML application needs a GIF image for each angle to show the direction. If we create one image for each 4-degree increment, it needs 90 images per each color. The download speed will be unacceptable. Just few thoughts!
Wednesday, May 31, 2006
"Today creating Ajax applications is complex work, which only large companies like Google can afford"

That's not true at all! Technologies like Ruby on Rails make it almost trivial to do AJAX. And Google have just released their Web Toolkit which generates JavaScript from Java code.
John Topley Send private email
Wednesday, May 31, 2006
IMHO, I have to disagree with you. Google’s Web Toolkit is not very useful to build data intensive applications. The Java API is just replacement to HTML/JavaScript.

One can only create static (i.e. non-data driven) web pages. If one needs to access any data from the server to initialize some of the components in the web page, the web page need to have code to make Ajax calls to get data and use DOM to update the HTML elements.

It adds lot of overhead, for example, for a Java developer, many JSP files to serve the Ajax calls and potential errors, in case of the exceptions such as missing data or database quarry files (after the page already been loaded). The Ajax calls are not always reliable, as you can see in Google maps. Some of the map pieces occupationally do not reach, while in other cases they do reach out of order. Handling these exceptions in the web page already being displayed is hard.

OP, is talking about graphics development using SVG. The vector graphics programming is ten times more complex than HTML. I don’t think any one wish to write do complex math and create primitive GUI elements for polygons, arcs and eclipses etc. We need a rich set of reusable GUI components comparable to Java/Swing. What we need is Ajax GUI platform that is as simple to program, as Windows/VB.
Wednesday, May 31, 2006
"What we need is Ajax GUI platform that is as simple to program, as Windows/VB."

Something like this?
A little older than the term "ajax", too.
Berislav Lopac Send private email
Wednesday, May 31, 2006
"The Ajax calls are not always reliable, as you can see in Google maps."

Just like a normal page load isn't always reliable?  Prototype etc. makes it easy to watch your connections and handle errors.  Just like any other programming if you do it quick and dirty you get quick and dirty results.  But you don't have to do it that way.

"Some of the map pieces occupationally do not reach, while in other cases they do reach out of order."

I don't think this is an AJAX issue.  I'd think this is more due to bugs/infrastructure issues in a large system/dataset i.e. images of the entire surface of the earth at different resolutions, as supplied by various 3rd party sources.  Serving this amount of data isn't so straightforward i'd imagine.
wt Send private email
Thursday, June 01, 2006
Please look at the Vector Graphics code for to create a custom button:

Built-in buttons are just as simple as HTML button, but it is lot of code to create a custom component. This certainly makes a case for reusable Java Classes for custom GUI components, such as GWT, Bindows or Online GUI Widgets. Let the best idea win.
Let the best idea win
Thursday, June 01, 2006
Here's the Google web toolkit:

It provides components that you debug in Swing and "compile" to JavaScript when you're done.

Another common Java/JavaScript toolkit is Direct Web Remoting (DWR).  It automatically exports Java method calls and objects to JavaScript.  It can be found here:

If you are talking about vector graphics in AJAX, you've got to have a look at Walter Zorn's graphics library!  Here's that link:

Have fun ... it's not that hard but, as stated above, plan ahead!
Steve Moyer Send private email
Monday, June 05, 2006

This topic is archived. No further replies will be accepted.

Other recent topics Other recent topics
Powered by FogBugz