Jump to content
Search Community

Safari Retina Mac blurry text

RolandSoos test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

First of all, I do not have retina Mac to test, so I was unable to create Codepen with the issue, sorry for that :( I ask this question here as you might saw this issue in the past and you might be able to give me advice how to solve the issue.

 

Site where you can check: https://tpt.ischanging.com.au/

 

The problem is that the animated text on the top is blurry on retina iMac with Safari 12. It is sharp on retina iPhone. You can check the attached screenshot where the lower text sharp and the top is blurry.

 

Capture.PNG

Link to comment
Share on other sites

I didn't really notice it on my retina mac, but my eyes aren't the best :) It looks like you set force3D:true but you might want to avoid that because some browsers rasterize things in a speed-optimized way (which can look more blurry). If you leave it on "auto", GSAP will switch back to a 2D matrix at the end if/when possible. But I saw that you also set will-change but that's another one that I'd recommend being very careful about. See https://greensock.com/will-change. Maybe try removing both of those and see how it looks. 

Link to comment
Share on other sites

Thanks for the reply. I was able to emulate retina on a normal monitor by adding the following command to terminal:

sudo defaults write /Library/Preferences/com.apple.windowserver.plist DisplayResolutionEnabled -bool true

Then I switched to HiDPI mode at half resolution: hidpi-mode-system-preferences.png

Then I was able to narrow down the issue and ended up the following: https://jsfiddle.net/y9k64ush/

 

You can change the font size to make it more visible. I think I'm going to make a bug report for WebKit/Safari

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...