I have a large SVG graphic for the background of my site. See an example here: http://jsfiddle.net/aAwgU/4/embedded/result/
body{
background: url(http://www.thedavidcummings.com/images/html.svg) no-repeat fixed right;
background-size: auto 100%;
}
It works fine in Chrome and Firefox, but in Safari navigating the page and resizing the browser page is extremely slow, and the page completely crashes on my iPhone. Is this a bug in webkit?
Is there a way to make my .svg more WebKit-friendly? Or should I just use an image? SVG is ideal because of the small file size (only 7k.) The smallest .png equivalent I was able to make was 150k. I want to keep the dimensions big so that the image scales well.