Chrome Canary Fixes Rendering Issue with Retina MacBook Pro
by Anand Lal Shimpi on June 12, 2012 5:58 PM EST- Posted in
- Mac
- Apple
- MacBook Pro
- Chrome
If you read our initial analysis of the MacBook Pro's new Retina Display you will know that application support is necessary to get the most out of the display. The situation is really quite similar to Retina Display enabled apps for the iPhone and iPad. Generally speaking app developers will need to supply higher resolution assets for use on Retina enabled Macs. All of Apple's existing rendering and display APIs already have support for the Retina Display, however those applications that have their own custom renderers may need updating.
In the case of Google Chrome, the browser uses Apple's text display API but renders to an offscreen canvas before scaling the text and displaying it on a web page. The offscreen render procedure is not Retina aware, and thus you get the nasty result you see above (the image on the left is what you get with Google Chrome, the image on the right is from Safari).
Thankfully the problem is non-existent in Google's Chrome Canary (screenshot below), a developmental build of Chrome that forgoes a lot of validation testing. Canary is useful for quickly getting feedback on new features without any concern about breaking stuff.
From left to right we have Google Chrome, Chrome Canary and Safari. Google still renders text differently from Safari but it's no longer ugly.
Facebook
Twitter
RSS
11 Comments
View All Comments
habadacus - Sunday, July 22, 2012 - link
Hey all,My Setup:
Retina MacBook pro running Windows 8 / Bootcamp
Resolution: 2880x1800
DPI: 200% (Custom Setting)
Bootcamp Drivers Installed
Just some information on using bootcamp and Windows 8 (and I presume 7) on retina for Chrome. As with OS X, I found Chrome to have blurry text. However, I also found that the Canary build (22.0.1214.0) for Windows does NOT address the issue.
What I DID find, however, is a somewhat workable solution.
Inspired by this post here:
http://productforums.google.com/forum/#!topic/chro...
If you set Chrome to run in compatibility mode to turn on "disable display scaling on high dpi settings", then after running chrome, within chrome settings, change the page zoom to 200%, then the display is crisp and beautiful, or at least compatible to Internet Explorer 10 in desktop mode. This worked with all versions of Chrome, not just Canary.
The PROBLEM is that, while the page renders well, the controls (tabs, address bar, settings button, etc.) are tiny.
For me, I can put up with tiny controls rather than blurry pages until a fix/update ultimately resolves the issues, and diehard chrome users may feel the same way.
As an aside, I noticed when you enable High DPI settings in Windows (again, in my case, 200%), IE actually sets all pages to "zoom" to 200% anyway. I guess this is similar to what I mentioned above for Chrome, although this is automatically set by IE.
As another aside, I noticed in my setup that IE back/forward buttons are tiny, so is the address bar, tabs, etc. I only mention it because it seems to be exactly the same problem as Chrome using the settings I mentioned above with high dpi display like the rMBP.
Anyway, hopefully this helps someone using bootcamp in the interim until Microsoft/Google, etc. can update the software to work well on rMBP (and presumably any other HighDPI displays that may be coming).