Using SVG instead of raster graphics for web based UI controls/widgets?

I have implemented UI cont开发者_开发技巧rols using JavaScript, CSS and HTML (and SVG). I know that browser support for SVG as background-image is poor, but that does not concern me as the project is not going to launch anytime soon.

However, it feels painful to do things like CSS sprites. It is also a lot more painful to use Illustrator than Photoshop. I am wondering that is the main benefit of vector graphics (scalability) worth this? Do you think it's a good idea to use SVG instead of raster graphics for UI controls like checkboxes, buttons and such?

It's worth it. Think about people using an app on an iPhone, then using the same app on an iPad—scalability helps a lot. The most difficult thing is learning the tools necessary to producing the vector graphics. Illustrator isn't any harder than Photoshop, it's just different; you're learning a new paradigm for image editing/creating, as if you're jumping from Java to Haskell.