Mac retina display worth it update#
Mac retina display worth it pro#

(If a website doesn’t load correctly, most users’ first instinct is to refresh.)

It should correct itself after a refresh.

(If a browser window had one device pixel ratio the last time, it likely still has the same device pixel ratio the next time.)

It should make a good guess about your device pixel ratio.

When we approached the problem of server-side device pixel ratio detection on desktop at Facebook, we set several criteria:

Mac retina display worth it update#

Our solution needed to be ready for these changes and update the server with the new device pixel ratio appropriately. A browser window can be moved back and forth between the two displays meaning the device pixel ratio can change after page load. A browser window on the built-in display will have a device pixel ratio of 2 while a browser window on the external display will have a device pixel ratio of 1.

Mac retina display worth it pro#

A MacBook Pro with Retina display can be attached to external display that is not Retina. The new problem for us was a changing device pixel ratio on desktop. Google’s Nexus One has a device pixel ratio of 1.5 and the Galaxy Nexus and Galaxy Note both have device pixel ratios of 2. Apple’s iPhone 4 and iPhone 4S both have Retina displays with a device pixel ratio of 2. Handling the device pixel ratio is not a new problem for mobile web developers. These images will be down-scaled, which will reduce the pixel-level detail on small icons and make them less crisp. We also don’t want to send images that are too large. The MacBook Pro with Retina display will up scale these images to twice their original size, which produces a blurry or pixelated result.

Most images have a limited amount of detail and most websites only send images designed for a device pixel ratio of 1. Unfortunately, the problem is a little more complicated for images. In places where a 12pt font is called for, it will render a 24pt font at half the size to make the letters look crisper. Instead, the MacBook Pro with Retina display uses a 2×2 square of pixels to draw the same amount of content the previous MacBook Pro would draw with only a single pixel. This would make normal-size websites appear very tiny and make them very difficult to read. While the Retina display has twice as many pixels per inch as the previous MacBook Pro, it doesn’t display content at half the size. The reason for having a device pixel ratio is simple. Unfortunately the device pixel ratio is only reported through JavaScript, which means developers won’t know what it is until the page has already started loading. This means we need to send images that are twice the size of our normal images to these displays. In the case of the MacBook Pro with Retina display, the device pixel ratio is 2. This ratio tells developers how many times larger than normal an image must be to take advantage of all the pixels the display has to offer. The MacBook Pro with Retina display presents a new challenge for desktop web development: the device pixel ratio. The last project I completed before I left was to help improve the user experience on Apple’s MacBook Pro with Retina display and future high resolution displays. As an intern on the user interface engineering team this summer, I helped build UI components that can be used across Facebook.