Safari 6-Rendering-Probleme/Artefakte (auf Mountain Lion)

Letztes Update Ich habe gerade eine E-Mail von Apple erhalten, in der bestätigt wird, dass dieser Fehler in OS X Mountain Lion 10.8.3 behoben wurde


Ich habe Probleme beim Rendern mit Safari 6 auf verschiedenen Systemen, auf denen Mountain Lion ausgeführt wird, und ich kann keine Lösung finden. Ich habe einige Screenshots angehängt, um das Problem zu beschreiben.

Update Weitere Untersuchungen deuten darauf hin, dass dies nur bei 2012er Mac-Modellen ein Problem sein könnte, insbesondere bei denen mit HD4000-Grafik.

Update Es scheint, dass die Artefakte nicht immer sofort angezeigt werden und einige Neuladungen und/oder das Schließen/Neuöffnen von Registerkarten erfordern, bevor sie angezeigt werden.

Update Das Problem wurde als kein WebKit-Fehler bestätigt und wurde als Fehler bei Apple gemeldet (Problem 12750455 von Simon Fraser).

Twitter Bootstrap-Website auf Safari

Twitter Bootstrap-Website auf Safari

Twitter Bootstrap-Website auf Firefox

Twitter Bootstrap-Website auf Firefox

Teak's jsfiddle auf Safari

Teak's jsfiddle auf Safari

Teaks jsfiddle auf Firefox

Teaks jsfiddle auf Firefox

Links zu den auf den Screenshots gezeigten Websites:

Ich habe versucht, den Text ein wenig zu bearbeiten, aber bevor ich versuche vorzuschlagen, ob eine andere Website besser wäre, und sie zu migrieren, können Sie klären, wonach Sie hauptsächlich suchen? Möchten Sie, dass es um JQuery geht, das einen Patch benötigt, oder um WebKit/Safari? Wir konzentrieren uns hier mehr auf Benutzer, und obwohl einige Programmierer und Webentwickler sind, sind wir nicht der beste Ort für Kenntnisse auf Codeebene und Fehler-/Regressionsebene. Wir können Sie darauf hinweisen, wie Sie einen Fehler bei Apple melden, aber im Allgemeinen haben wir hier keine detaillierten Fragen und Antworten zu HTML/CSS/JS.
Mir geht es vollkommen gut ... imgur.com/a/vICCs Ich verwende Safari 6.0.1 unter OS X Lion 10.7.5
@bmike Ich vermute, dass dies ein Mountain Lion-Problem und kein HTML/CSS/JS-Problem ist.
Ich habe gerade einen Kollegen gefragt, der auch Mountain Lion betreibt: Da gibt es keine Probleme. Die Ursache des Problems bleibt mir also ein Rätsel.
Vielleicht liegt es an der HD4000 Grafikkarte.
@ René OK - hier ist alles in Ordnung - wollte nur sichergehen, dass Sie sich Ihrer Optionen bewusst sind. Können Sie auf eine Stelle im Internet verweisen, an der andere Ihr Problem sehen und replizieren können? Es sieht so aus, als hätte DaviesGeek versucht, jQuery herunterzuladen, und kann Ihre Störungen nicht replizieren.
Interessant: Ich kann die Zeilen vor dem Wortproblem auf der jQuery-Seite bestätigen. Aber ich kann die Probleme auf der Bootstrap-Seite nicht bestätigen. Habe einen MBA 2012 mit einem HD4000 GFX.
Ich sehe seltsame Artefakte in der Web-App, die ich auf RETINA MBP Pro in Safari 6 entwickle. Frage mich, ob es sich um ein Safari-Rendering-Problem auf RETINA handelt.
@René Laut blackpixel.com/blog/2012/02/radar-or-gtfo.html ist es eine gute Idee, doppelte Fehler bei Apple zu melden, also ist es wahrscheinlich eine gute Idee, wenn Sie sie auch melden!
@OllyHodgson danke, ich werde sofort einen doppelten Fehler melden!

Antworten (6)

Es war ein Fehler in Safari, behoben in OSX Update 10.8.3!

Das Hinzufügen des relevanten Zitats der Update-Notizen würde beispielsweise den Wert Ihrer Antwort erheblich steigern.
Es wurde nicht wirklich in den Update-Notizen vermerkt, aber es hat es gelöst. Ich habe es vor und nach dem Update selbst versucht.
Anscheinend wurde es von Apple mit der Veröffentlichung von Mountain Lion 10.8.3 + Safari 6.0.3 in dieser Woche behoben.

Ich kann bestätigen, dass dies ein Fehler mit der Intel Graphics 4000 GPU ist. Ich sehe die Grafikartefakte auf meinem 13" Retina MacBook Pro und nicht auf meinem älteren MBP mit Mt. Lion und einer Nvidia Geforce GPU.

Ich habe Erfahrungen aus erster Hand mit diesem Problem, als ich versuchte, CSS-Schaltflächen für Websites zu entwickeln ...

Ich glaube, die Artefakte können reproduziert werden, indem CSS3 border-radiusin Verbindung mit einer box-shadow. Obwohl es offensichtlich auch unter vielen anderen Umständen passiert. (was ich bestätigen kann)

Hier ist ein Link zu einem Fehlerbericht auf der Webkit-Website (obwohl ich nicht sicher bin, ob er dorthin gehört):

https://bugs.webkit.org/show_bug.cgi?id=103087

Und die SO-Frage, aus der es kam:

https://stackoverflow.com/questions/13505314/artifacts-on-css-rendering-box-shadow-on-safari-6-0-2-on-mountain-lion

Danke, dass du das geteilt hast. Ich bin jedoch nicht davon überzeugt, dass es sich um ein Webkit-Problem handelt, da dieses Problem spezifisch für OS X Mountain Lion und nur mit HD4000-Grafiken ist.

Dies ist kein Intel HD 4000-Fehler. Ich kann diesen Fehler nur von Safari auf Intel HD 4000 sehen. Wenn ich eine Seite mit (Opera, Chrome, Firefox) öffne, kann ich diesen Fehler nicht reproduzieren

Eine schnelle Lösung für dieses Problem ist die Verwendung einer Transformation für das Objekt mit dem Border-Radius oder einer anderen schadensverursachenden Eigenschaft. Auf diese Weise erzwingen Sie ein Neuzeichnen mit der Grafikkarte, und das Problem wird behoben.

Wenden Sie die folgende Eigenschaft an: -webkit-transform: translate3d(0,0,0);- Und Sie sollten in Ordnung sein.

Hat nicht unerhebliche Leistungseinbußen, wenn Sie es auf ein div anwenden, das viele Dinge enthält, aber umgeht den Fehler.
Leistungskosten? Ich würde gerne ein paar Daten dazu sehen. Alle zusätzlichen Kosten sollten von der GPU übernommen werden.
Eine Nulltransformation erstellt eine Hintergrundtextur für dieses Element auf der GPU. Dies macht das Verschieben des Elements billig, da es sich eher um eine Zusammensetzung als um eine Farbe handelt, aber es macht Änderungen am Element teurer (z. B. Text-, Dimensions-, Stiländerungen), da eine neue Textur auf die GPU hochgeladen und das Element neu gezeichnet werden muss . Sie nehmen auch GPU-Speicher in Anspruch, was bei Telefonen ein Problem sein kann.
Danke für das. Irgendwelche guten Empfehlungen für Informationen zu diesem Thema?

Hier sind Dinge, die ich tun würde, wenn Sie keinen Link zu etwas bereitstellen können, das im Internet live ist, damit andere es kopieren / herausfinden können, was passiert.

  1. Probieren Sie einen nächtlichen Webkit-Build aus, um zu sehen, ob es sich um einen behobenen Fehler handelt, der jedoch nicht versendet wird. http://nightly.webkit.org

  2. Entfernen Sie alle Erweiterungen von Safari, um sicherzustellen, dass es nicht von einer verursacht wird.

Ich habe Links zu den auf den Screenshots gezeigten Websites hinzugefügt.
Ich habe Ihre beiden Vorschläge ausprobiert, aber leider haben sie nicht funktioniert.

Ich kann diesen Fehler auch auf dem Retina 15" MacBook (osx 10.8.2, Safari 6.0.2) bestätigen.

Mein MacBook hat auch Intel HD4000, aber auch Nvidia GT 650M für das externe Display.

Um alle anderen Möglichkeiten außer der Grafikkarte (Treiber) zu eliminieren, habe ich einen Thunderbolt-zu-DVI-Adapter verwendet, um ein externes Display an die Nvidia-Karte anzuschließen.

Ergebnis: Keine seltsamen Linien und freakigen Jquery-Effekte!

Fazit: HD4000 (Treiber) Problem.