I'm using Raphaël.js to draw some small circles (2-4px radius), which is done through SVG on all browser except IE. The circles don't look smooth to me, so my question is:
Antialiasing is done via the SVG renderer, so you'd need to look at the client that is showing the SVG. The problem, however, is that what you're drawing is too small to be antialiased well. If you've got a 2px radius circle it's basically rendered as a diamond because that's the closest you can get to a circle at that size. The first pixel of radius is used for the core of the circle, the second pixel used to give a little bit of rounding, but it's so small that it looks like a diamond.
Anti-aliasing needs some extra pixels to work with and such small shapes don't provide much. Unless you scale up your images, they won't get antialiased.
On further experimentation, I think the trouble is not so much that the SVG was not antialiased (indeed, I found when drawing lines that I usually wanted to disable antialiasing by setting shapeRendering to crisp-edges; see this issue) as that I wanted even smoother edges on my circles than the antialiasing provided.
To achieve this in Raphaël.js, you can set the fill and stroke colors separately. For instance, on a white background, setting the stroke to a lighter color than the fill achieves the desired effect.