dSVG - A New Kind of Programming?

Gord Bowman writes "For anyone familiar with XML and, specifically, with SVG (Scalable Vector Graphics), you may be aware that SVG is increasingly being used for the creation of data-driven Web applications. But everyone has been doing so by handcoding script and/or XSLT, without the benefit of an IDE to help. Seeing such a need for a tool, my company (Corel) set about creating one." and 'lo, dSVG was born. Gord Bowman is the lead developer of dSVG and would like you to take a look at the dSVG specs (you can find the link, in the full article) and offer your comments.

"It quickly became apparent that while getting a grasp of XSLT is difficult and time-consuming, even more time-consuming was all the scripting it took to create the level of interactivity required on the client via script. Thus we set about creating a library of generic script functions that would assist developers in creating their Web apps. But it didn't take long to realize that this was no good--you can't data-map and transform (via XSLT) functions like you can markup. And, unlike markup, it's much more difficult to auto-generate and customize script via an authoring tool. So I set about designing an XML markup language, implemented with script (so as to work in any SVG viewer), which would describe UI controls and behaviours, so as to facilitate the creation of SVG-based Web applications.

It was a programmer's dream. I was essentially being paid to develop a new kind of programming language. One that, like XSLT, is XML-based but is more procedural in nature and thus easier for the average developer to grasp. It's also easier for non-developers to grasp it, thus bringing SVG and application development to a whole new class of user. A year later, dSVG (Dynamic SVG) was unveiled to the public as part of the Corel Smart Graphics Studio. And as of yesterday, the full dSVG 1.1 Specification and Test Suite became available for download.

The UI controls were designed to allow complete customization of appearance, and to allow for use with forms without being tied to a forms-specific model. The behaviors were designed to be generic and higher level than DOM methods, so as to be more intuitive to non-developers. The resulting markup language allows data-driven Web applications to be created with little or no need for scripting.

While script is very useful and powerful, markup has many advantages:

- markup is more easily understood by non-developers
- markup can be easily data-mapped and transformed using XSLT
- markup can be easily generated via an authoring tool and customized by the author
- markup is semantically meaningful, promoting interoperability on the authoring side
- markup can be standardized, thus helping the adoption of SVG

dSVG was implemented with script so as to work in different SVG Viewers. However, Corel has proposed dSVG to the SVG Working Group in the hopes that through a collaborative effort, dSVG will lead to the eventual creation of standard markup for UI controls and behaviors. These could then be natively implemented, bringing about even more advantages:

- faster
- less data to transfer
- less need for a script engine on small devices (which can take up a significant part of the footprint)

The dSVG 1.1 spec and test suite was posted for download with the goal of allowing the developers and non-developers to experiment with the markup and to provide feedback. This feedback will help me to improve upon dSVG and will also help the SVG Working Group to better assess how the developer community feels about such standard markup being added to the spec for the purpose of developing SVG-based Web applications.

I hope you will take the time to read through the dSVG spec, try out the test suite, and perhaps even create some of your own content. As the creator, I am obviously passionate and excited about dSVG. And having seen how quickly even non-developers can create Web apps, I feel certain that XML-based programming makes sense and is the way of the future. But being a long-time reader of Slashdot, I would love to hear what the Slashdot community thinks. dSVG may not lead to world peace, but I think it has the potential to change the fundamental way in which Web applications are created.

I look forward to hearing your comments.

Sincerely,

Gord Bowman
Lead Developer, Corel Corporation"

Comments

Sounds great...

[Tet]

...now all we need are some browsers with native SVG support. With the Mozilla SVG project still seemingly no closer to delivering a shippable release, and no hope whatsoever of MS releasing an SVG enabled IE, looks like we're stuck with the Adobe plugin for now. Until we get past that, I doubt SVG will enter the mainstream (more's the pity).

Re:Sounds great...

[fryguybob]

Yeah, once we get SVG browser support we can look forward to SVG banner ads.

Re:Sounds great...

[bwt]

I agree completely that browsers need to support SVG, and until this is more advanced, tools like the one in this article are getting ahead of things (not that that's necessarily bad). People should vote for Mozilla bug 122092: "Enable SVG support". Ultimately, this needs to be done without plugins -- its really just another image format.

The Konqueror browser seems to have a push to get SVG going too: KSVG, but it has a way to go ("Release 0.1 pending").

There are a good set of SVG resources for Linux. The Apache Jakarta projects java SVG viewer, Batik is probably the farthest along.

Re:Sounds great...

[Anonymous Coward]

People should vote for Mozilla bug 122092: "Enable SVG support"

Voting doesn't write code. Writing code writes code. You can vote for it all you want, but if nobody writes it it won't make a difference.

On the other side, if you write the code for it, and give it to Mozilla, then nobody will need to vote for it.

Goodbye RFC, hello Slashdot

[Psychic Burrito]

Shouldn't new standards be introduced using RFCs? I'm not sure if it's a good trend when they are presented first on Slashdot...

Re:Goodbye RFC, hello Slashdot

[Homology]

Shouldn't new standards be introduced using RFCs?

Well, from download page we have :

This file contains the proposal submitted to the World Wide Web Consortium (W3C) SVG Working Group to enhance SVG's support of enterprise application development for dynamic interfaces

along with an EULA whose length put even the MS one to shame.

However, I can't download the proposal without first agreeing to the EULA, so good riddance. If I was sufficiently interested I probably could look it up at W3C site.

Re:Goodbye RFC, hello Slashdot

[Gord Bowman]

dSVG is NOT a spec being proposed by the W3C. It's something we came up with ourselves for our product, and then proposed to the SVG Working Group. The concept of having "standard" markup for UI controls has been around a long time, but it hasn't happened yet. Maybe we're not asking enough people if it's what they really want or not. And if we want it, does it belong in SVG or should it be something larger and more generic in its own spec? And the idea of using XML for procedural programming is pretty new, I think. At least I had never found another example of it. Maybe someone else knows of one though. Regardless, I strongly believe in asking communities what they want rather than telling them what they want, and I also strongly believe in getting ideas and constructive feedback from people outside of the SVG-world. I couldn't think of a better forum than Slashdot to solicit that type of feedback.

Re:Goodbye RFC, hello Slashdot

[russcoon]

Gord,

Using XML for procedural programing isn't new. ANT comes to mind. Unfortunantly it turns out it's a really crappy language to program in (overly verbose, etc...). It does, however, make a decent glue language for putting down the declarative portions of a GUI.

As for the usage of XML-ish markup to define widgets, that's also not really very new. XUL, GLADE, netWindows (my project) all come to mind. The problem is tying them to data and programatic constructs. It's nice to see you're taking a similar tack with your wiget set as we are, however I tend to think that the minute you start writing standards around your toolkit, you only decrease your room to improve in the future. The community, i hate to say it, really doesn't know what they want which is why innovation is so powerful. It takes independent thought and originality to come up with someone else's old hat, and it seems you have that in spades. The trick is to not imagine that the community at large is imbued with the same qualities. The world at large doesn't care. You have to reach people with a need for what you want to do. The are the only ones that really matter.

A small dev team of people that grok what you're talking about and are interested in assisting you in making things better is usually going to yeild significantly better results than throwing something to the winding and seeing what takes off. In the worst case, you've satisfied the needs of the people that have needs in the first place, which isn't a bad place to be (although it can surely be obscure).

Anyway, I'd like to talk with you more about your toolkit. Your email addr isn't in your profile, so you can reach me at alex@netWidows.org.

Regards.

Holy legaleze Batman!

[PDHoss]

Can someone summarize if I am going to get 20-to-life and a cellblock husband if I download the spec?

Jeez, how many paragraphs into the legal requirements do you have to be before you realize that ain't reeeeeal conducive to getting people to beta/bug track/improve your product for free?

PDHoss

Future possibilities for improvements

[Gord Bowman]

Wow, this actually got posted. Cool. Let me first say that the dSVG 1.1 spec is still evolving. There's lots of room for improvements. For instance, there's an 'if' element, but no 'elseif' or 'else' elements yet. Those are obviously needed. I originally thought that a DTD could not (or should not) define an element as being dependent upon a sibling, but after talking with some XML experts at the SVG Open conference in Vancouver this past week, I see now that I was wrong. Another needed feature is some kind of a fallThrough="true|false" attribute for the 'case' elements within a 'switch' element--mimicking the 'break' statement but in a more XML-ish way.

One huge area for improvements is in the design of the skins. It seemed like a good idea at the time, but I now see that it has limitations both for performance and for the creation of custom UI controls. More on that in a separate comment...

The fact that dSVG is implemented with script is, for now, a good thing because it allows us to make changes to the spec without the viewer, since the implementation gets passed along with the content. And for previously written content, the Corel Smart Graphics Studio (CGSG) IDE will automatically convert from the old version of dSVG to the new version (via XSLT).

I have a big list of ideas for improvements, but it's back at home and I'm still in Vancouver for a few more days attending meeting (so I apologize in advance if I am not always responding in a prompt manner). I'm really interested to see what other developers think of the spec thus far and how it could be improved.

Re:Examples, Applications ?

[Gord Bowman]

You can find some demo apps at www.corel.com/smartgraphics/resources. As for apps created by customers, I don't know.

As much as this interests me, forget it!

[Jack William Bell]

There is no way I am going to 'read and understand' all that legal language. I would rather create my own competing specification than do that.

So, either release it under a license I can understand (one consisting of ten or less paragraphs) or forget it!

Can you please post the spec by itself?

[tmoertel]

I am interested in reviewing the spec, but it's presently tied to the test-suite software, which is locked away behind a long, complicated, and scary-looking license agreement that I'm not comfortable agreeing to. Could you please provide a link to just the spec?

Since you have already submitted the spec to the W3C SVG WG, it's already public knowledge, and there's no reason to hide it behind legalese, right? Can't you just provide a link straight to it?

I'm sure a lot of other people are more interested in the spec than anything else. If you want them (and me) to take a look at dSVG, please make the spec available by itself.

Thanks!

Re:Can you please post the spec by itself?

[Gord Bowman]

Hmm. That's a good idea. It's actually my fault, really. They asked me if I could post just the spec and I said that the spec currently linked to the slides in the test suite and that I thought most people would like to actually play around with it. So they said, okay, but we'll need a EULA then. And I said, okay, and then went off to my SVG Open conference. So yes, I'll look into just posting the spec without all that legaleze stuff. It's the weekend, though, so I doubt it would happen until Monday.

adverts?

[mz001b]

I think this should have read:

"Hi, my company just came out with a new product and told me that I get a huge stinkin bonus if I managed to get an advertis^H^H^H^H^H^H^H^Harticle on it posted on /., so please click on this link..."

Any patents involved?

[Homology]

dSVG is NOT a spec being proposed by the W3C. It's something we came up with ourselves for our product, and then proposed to the SVG Working Group.

Since this appear to be a product by a comercial company, it sort of begs the questions : Is any patents filed relating to this, or is any existing patent involved? This includes any technology necessary to implement dSVG.

I apologize if I appear impolite, but I'm getting cynical as I age.

Re:Windows only?

[Tumbleweed]

Personally, I would not buy the product no matter what platform it runs on because of the (sad) state of SVG support in the browser market, and the foreseen SVG support in the coming years. With IE not being updated for the next 2 years, only Mozilla, Opera, & KHTML variants will be likely to have any decent SVG support anytime soon, and even that is just a possibility, and hardly a foregone conclusion. Your product may be the greatest thing for SVG that has come along (not that that would be saying much, considering), but SVG support, for all _practical_ considerations, is nearly non-existent in browsers, and as a percentage of the surfing public goes, will remain so for years to come. Your product seems like a solution waiting for a market to develop. I don't think that market is GOING to develop for another 2 years, at the soonest. We'll have to wait and see if Microsoft deigns to include usable SVG support in the Longhorn-generation of IE, or whether they cripple & abandon it like they did PNG support. If the latter is the case, then your product may never be useful enough for Corel to continue to support unless Mozilla/Opera/KHTML-based browsers actually start taking significant browser marketshare away from IE.

Good luck on what seems like a fun project, though. Some people will certainly find this product useful, but whether it's enough of a customer base to continue development on is a big guess. Risk big, win big, though!

Re:Windows only?

[appleLaserWriter]

Mr Bowman,

I represent a growing provider of diverse Internet services. We have determined that the Linux platform is by far the most cost effective platform for new projects. Because we have selected Linux as the standard server platform, we find that Apple's Unix-based OS X platform is ideal for desktop use by designers and engineers who produce our new projects. Although we consider tools that require the Windows platform, we are most seriously interested in products that support OS X or Linux. In our experience, many other growing internet ventures hold a similar opinion.

Flash vs. SVG

[Gord Bowman]

Some people think SVG and Flash directly compete, and others say no. But let's compare them for the case of creating data-driven applications. If you think that you don't have to code in Flash, then you must not have used it. It uses ActionScript, which is like a stripped-down ECMAScript (I think). But it's script. They have a UI for generating it, but it's mainly a succession of dropdown menus to finally insert an 'if' statment. So you're not freed from the need of actually knowing how to program or anything. But even if you did want to use a proprietary binary standard to create an enterprise-class data-driven application, can you and should you? Macromedia recently has tried to enter the Enterprise space to do this, but the idea of using a proprietary solution does not sit well with everyone. Especially when the alternative is to use a complete XML solution from beginning to end. Data-driven graphics and data-driven applications are just now starting to take off. And most of them are using SVG because it's an XML-language--thus you can data-map it easily with XSLT. Many argue that while SVG may be able to compete in the multi-media space, that's not where its strength lies. It's strength is in the visualization of data.

Re:Flash vs. SVG

[russcoon]

Gord,

I think you're going to find out that developers at large aren't going to enjoy "programming" in XML. It is overly-verbose for anything but data and meta-data transfer (and many will argue that it's highly inefficient at even that). Programmers and you and I know them want their if statments to look as close to pseudo-code as they can get (hence we have Python and Perl). All of that said, your toolkit still hinges ona a glue language (JS) to make SVG (a declarative style language) even become a programming language in the first place. Therefor the dependency on JS doesn't go away at all. In fact, you've only made your programming environment even more brittle (what are the odds you'll get good debugging info from a dsvg environment?) while continuing to mix data and program in a way that has some deeply negative security ramifications.

So anway, even if Flash and SVG don't compete, dSVG turns SVG into a Flash competitor, except that it's a "complete xml solution from end to end". Frankly, I'm not sure what that buys you.

The point of CSS is to seperate style from structure, and the point of XML is to encode meta-data that would otherwise be lost. Unless you can make a compelling argument that scripting constructs are meta-data that should be encoded, I'm going to continue to have a very hard time buying that programming as such belongs in your markup as anything other than CDATA sections. Yes, it has semantic meaning, but not semantic meaning for data! XSLT treads this line pretty narrowly, and I think it winds up on the right side of the fence in most places, but it again suffers from all of the problems anyone else that tries to make imperative constructs out of markup winds up with, and that's not a good thing.

We doen't use column-based programming languages any more for a lot of very good reasons. Why would we ever want to return to their equivalent if it's only more verbose?

So we can put an XML stamp on it? What does that buy us?

Anyway, Flash and SVG+JS are competitors, Flash and SVG without scripting are not. End of story.

Example Markup - checkBox and setData

[Gord Bowman]

For anyone scared to death by that EULA (I've been assured it's harmless), here is a couple of checkboxes that change the data of a text element. More examples to come.

Gord

<svg xmlns:dsvg="http://www.corel.com/schemas/2002/dSVG 11" xmlns:xlink="http://www.w3.org/1999/xlink" height="410px" width="744px" onload="init(evt)" viewBox="0 0 744 410">
<script type="text/ecmascript" xlink:href="dsvg11/dSVG.js"/>
<script type="text/ecmascript" xlink:href="dsvg11/baseUI.js"/>
<script type="text/ecmascript" xlink:href="dsvg11/constraint.js"/>
<script type="text/ecmascript" xlink:href="dsvg11/button.js"/>
<script type="text/ecmascript" xlink:href="dsvg11/setData.js"/>

<dsvg:checkBox toggle="true" xlink:href="dsvg11/skinCheckBox_Default.svg#skinCh eckBox" autoScale="true" disabled="false" selected="false" height="12" width="12" y="70" x="50" label="Check Box 1" id="checkBox1">
<dsvg:setData value="Sample of setting data." elementID="checkBoxLabel" id="dsvgUniqueID_8"/>
</dsvg:checkBox>
<text y="80" x="150" fill="green" id="checkBoxLabel">label</text>
<dsvg:checkBox toggle="true" xlink:href="dsvg11/skinCheckBox_Default.svg#skinCh eckBox" autoScale="true" disabled="false" selected="true" height="12" width="12" y="120" x="50" label="Check Box 2" id="checkBox2">
<dsvg:setData value="Sample of setting data." elementID="checkBoxLabel2" id="dsvgUniqueID_9"/>
</dsvg:checkBox>
<text y="130" x="150" fill="green" id="checkBoxLabel2">label</text>
</svg&g t;

Re:Waiting for SVG pop-up windows.

[Tet]

Is there something new you're offering (other than a different set of lawyers) that we should be noticing?

Let me see:

• The ability to navigate using the traditional back/forward buttons (although I believe the lastest versions of Flash support this to some extent).
• The ability to resize text so it's halfway readable.
• The ability to cut and paste text.
• The ability to use my standard ctrl-pageup/pagedown keys to switch between tabs in Mozilla (as well as other browser keyboard accelerators) without them getting intercepted by the Flash plugin.
• The ability for search engines to index the content I'm presenting.

There are many reasons why Flash is fundamentally flawed, and SVG is a much better solution in the long run. Only time will tell if the market is able to see that.

Integration! Integration!

[fm6]

I agree. SVG lovers place too much emphasis on interactivity. Maybe someday SVG will challenge JavaScript, but right now that's less important than the fact that graphic support in current web browsers is screwed. Right now, most web graphics uses some kind bitmap. There's either lossless or lossy compression, but there's still too many bits, even if you have a fast connection. Nor do web sites like paying for the extra bandwith. SVG deals with this problem very neatly.

(No, I didn't forget PNG. It has some technical and ideological advantages, but browser support is still, well, incomplete.)

So what's wrong with SVG plugins? They don't exploit the full power of SVG. It's not just a graphics format, it's an XML application. In other words, it's a markup language, just like HTML. A good XML-aware browser (something both IE and Mozilla pretend to be) shouldn't isolate SVG from the rest of the document.

Consider the gif-filled Slashdot page you're looking at right now. They have gotten rid of a lot of bitmaps (though the left hand clickbar looks slightly less cool as a result). But they still use some weird little bitmaps, plus a lot of weird tables and font kludges that are hard to maintain and tend to be browser dependent.

There's a simple fix: put SVG support in the browser (it is a W3C invention after all) and allow indiscriminate embedding of XHTML and SVG in each other. (Not to mention any other XML applications the browser happens to support.) The Mozilla people know this, but still consider SVG support experimental and non-standard. This has been the status quo for quite some time, and given AOL's abandonment of Gecko, is not likely to change.

Maybe if Mozilla had concentrated on basic technological improvements like this and less on eye-candy and silly features... well, AOL, would probably still have screwed them over. But I might feel bad about it.

KHTML looks to be the new leader in open-source web browsers. And their does seem to be a lot of interest in using the engine to render SVG. Alas, the KDE people still think of SVG as something you embed in something else.