SVG rasterization within Safari in OS X vs iPad

Question

Level 1

10 points

SVG rasterization within Safari in OS X vs iPad

I viewed the exact SVG file in both Safari browsers on my iMac and my iPad. The SVG file is at this link:

http://upload.wikimedia.org/wikipedia/commons/6/60/CIE1931xy_CIERGB.svg

I was originally wanting to compare the color gamut differences between my 27" iMac and the new iPad (knowing that the new iPad display is very near studio quality in color gamut and contrast ratio).

I took screen shots from both the iMac and the iPad (I made the images as large as possible, however the 27" iMac didn't have as much vertical resolution as the iPad, 3rd generation). They are both in PNG format (I had to scale them down to fit the 450 pixel width limit for this post). The two versions of Safari actually rasterized the same SVG file differently as can be seen here:

This is from Safari in OS X (scaled down about 1/8th of the original)

This is from Safari in iOS (scaled down about 1/11th of original)

As you can see, the OS X version of the SVG rasterization has obvious saturation blocking, where as the iOS version on the iPad doesn't. Why the difference? (It's even more evident with the original 2 MegaPixel and 3 MegaPixel images.) At closer examination, I observed that OS X used subpixel anti-aliasing (the edges of the black numbers are colorful), where the iPad iOS didn't (the edges of the black numbers are grey, just as the menubar in OS X is).

Again, why the difference? (Anything to do with antialiasing differences, even though the saturation blocking is spread over many pixels?)

iMac, MacBook Pro, Mac OS X (10.7.2), Quad Core i7 2.8 GHz 16 GB RAM 6 TB

Posted on May 20, 2012 10:32 PM

Reply

Answer 1

May 21, 2012 3:59 AM in response to Gator TPK

Hi..

Why the difference?

More than likely two different operating systems. Mac OS X vs iOS.

Reply

Answer 2

Gator TPK Author

Level 1

10 points

May 21, 2012 10:39 AM in response to Carolyn Samit

Carolyn Samit wrote:

More than likely two different operating systems. Mac OS X vs iOS.

Of course I thought about that, but they both run Darwin version 11. I assume rasterization doesn't take place there in the UNIX core. Both versions of Safari run the same WebKit Engine, or is that where the WebKit engine differs? And of course, perhaps the rasterization occurs in the top level of the OS?

I guess, I'm wondering where does the rasterization really occur? They both run the same Darwin UNIX, and the same WebKit, so what process in the OS is different?

This would really suggest that iOS has more modern components than OS X. This isn't entirely surprising given that Mac OS X has been around for over 11 years, and iOS has started around 5 years ago. But neither supported SVG renderings (in Safari) 5 years ago either?

And if SVG support started in both iOS and OS X around the same time, then why the different rendering engines or rasterization?

I really think that the rendering occurs in the WebKit, and that must be where the differences are. But why, if it's a simple part of the WebKit, why do they look so different with color gradients? (Is one version more power efficient and turns out to be better and more advanced at the same time, the case in Safari for iOS?)

Reply