What is the trade off between hosting icon/picture image files versus drawing them? Is there one? Is this method (drawing through js) better if client download speeds are really slow?
It's when you need small variations, e.g. in color, size or shape, or some animation, that benefits kick in. Also, you can put all icons in the same easily cacheable JS-file.
Even if the icons where regular images I would use either data uris or an image sprite.
But if you want to do much more complex vector graphics you should probably consider using .png or .gif instead