[messages] [Developers] Re: Roadmap for VASSAL 4

Joel Uckelman uckelman at nomic.net
Mon Mar 28 05:13:59 MST 2011

Thus spake Michael Kiefte:
> As for JavaScript itself, I see dynamic typing as a debugging nightmare.
> We're actually trying to go in the opposite direction with better defensive
> programming practises. In addition, we're currently looking at ways to
> expand our capabilities not restrict them further (e.g., better graphics/3D
> engine).

I was curious to see what could be done with JavaScript as it is now,
so I worked up two demos over the weekend, one using the HTML5 canvas,
and one using regular DHTML techniques. I've put the demos here for you
to try:


(Both archives have the same content, download the one you prefer.)

Once you've unpacked the archive, browse to launch.html, where you'll
find a link to each of the demos. In each demo, you should be able to
drag around the pieces. In the elements demo, dragging on the map pans

I learned a few things by doing this:

1. The canvas demo is unusable for me. It turns out that this has
nothing to do with the huge map image---it's just as bad when there's
no map image. What does matter is the size of the canvas. It works well
for me at 1000x1000, but 8000x3000 is 24 times larger. I don't know how
the canvas is implemented in Firefox 3.6.16, but it seems that they're
not using algorithms which scale up well.

Also of note here is the fact that every canvas example I was able to
find on the web assumes that you'll have about 10 objects on your
canvas, so does collision detection by searching the whole object list
and testing each one for hits, and also repaints the whole canvas every
time something changes. If you do either of these, instead of using a
quadtree for collision detection and repainting only changed regions,
you can't even get a 1000x1000 canvas to work well with 100 objects on

2. The elements demo works well for me. It's also 245 lines of code, 41
of which are just HTML. The reason it's so small is that all I had to do
was write event handlers for some mouse events. The browser is already 
providing all of the collision detection, repainting, drag and drop,
and image loading. We have thousands of lines of code in VASSAL for doing
essentially the same thing.


More information about the messages mailing list