Vector background images vs raster background images

Question

I currently use a repeating pattern of raster images on one of my websites, which isn't so complex that it couldn't be converted to vector, but hasn't, as of yet, been scaled up to look decent on HiDPI/Retina displays.

I'm considering converting the raster pattern to vector, and setting the resulting .svg image as the background, but I want to know whether there are any disadvantages to using vector images in a website background.

Answer 1

• Depending on the complexity of the image (filters, masks, gradients...), it could consume more CPU to render the image; the good thing is that more and more graphic tasks are sent to the GPU, so that's not a big problem
• Not compatible with older browsers
• Browser support isn't perfect yet, so if you're using complex features, there might be differences in the way the final image looks

But I strongly believe that vector graphics have much more advantages than disadvantages, so go for it.