
Ich habe einige sehr, sehr merkwürdige Probleme mit Chromium unter Windows 10 und 11 festgestellt. Ich habe zwei verschiedene Chromium-basierte Browser (Chrome und Brave) ausprobiert und bei beiden ist das Gleiche der Fall.
Ein wenig über mein Setup: 1x 4K-Monitor, 1x 1440p-Monitor, 1x 1080p-Monitor, Ryzen 3900X, RTX 3070 und 32 GB RAM. Alle Monitore sind in Windows auf 100 % DPI eingestellt und laufen auch mit den neuesten Nvidia-Treibern in nativer Auflösung.
Wenn ein Browser auf meinem 1080p-Monitor maximiert ist und eine Animation abgespielt wird, wie etwa „jemand schreibt einen Kommentar“ von Facebook oder einfach nur normale CSS-Animationen, beginnt die Videowiedergabe auf den 4K- und 1440p-Monitoren vollständig zu verzögern, was dazu führt, dass die Videos irgendwann hängen bleiben (unendliches Puffern). Sobald ich die Registerkarten wechsle oder die Animationen auf dem 1080p-Monitor anhalten, wird das Video wieder abgespielt.
Ursprünglich hatte ich dieses Problem unter Windows 10, aber ich beschloss, meine SSD komplett zu löschen und Windows 11 zu installieren. Ich installierte Brave und beschloss, keine Einstellungen aus Chrome zu importieren, sodass es eine perfekte Standardinstallation war. Allerdings tritt genau das gleiche Problem auf.
Wenn ich die Hardwarebeschleunigung in chrome://flags deaktiviere und die Browser neu starte, funktioniert es einwandfrei. Die Videowiedergabe ist in Ordnung, obwohl 4K 60 FPS auf YouTube manchmal etwas ruckelt. Wenn ich den Browser nicht maximiere und er nur in einem Fenster läuft, funktioniert es ebenfalls einwandfrei.
An diesem Punkt vermute ich, dass ein paar Dinge nicht in Ordnung sein könnten:
- Chromium (unwahrscheinlich, da meines Wissens niemand sonst dieses Problem gemeldet hat)
- Hardware (CPU, GPU, Motherboard)
Ich kann fehlerhafte Treiber ausschließen, da ich Windows neu installiert und ein paar verschiedene Nvidia-Treiber ausprobiert habe. Ich denke, dass tatsächliche Hardware unwahrscheinlich ist, da ich nur bei Verwendung von Chromium Probleme habe.
Hier ist eine Liste der Dinge, die ich versucht habe:
- Anderes HDMI-Kabel
- Anderer Port an der GPU
- Tauschen Sie den Monitor gegen einen anderen 1080p-Monitor aus
- Installieren Sie Windows neu
- Ändern Sie Auflösungen, Bildwiederholfrequenz usw. aller Monitore
Um das Problem zu reproduzieren, muss ich einfach diese Seite (ein sich drehendes Quadrat mithilfe von CSS-Animationen) auf meinem 1080p-Monitor öffnen und ein beliebiges YouTube-Video auf einem anderen Monitor abspielen:https://codepen.io/teerapuch/pen/vLJXeR
Unter diesem Link können Sie ein aufgezeichnetes Beispiel mit meinem Telefon ansehen (nur um PC-Probleme auszuschließen):https://www.youtube.com/watch?v=ufsDsV6_HCg
Während die Animation abgespielt wird, wird die Videowiedergabe gestoppt. Wenn ich zur Registerkarte dieses Beitrags wechsle (wo es keine Animationen gibt), wird die Videowiedergabe fortgesetzt.
Wo fange ich überhaupt an, dieses Verhalten zu debuggen? Es gibt keine Fehler in der Ereignisanzeige oder anderswo, wo ich nachgesehen habe.
Antwort1
Es stellte sich also heraus, dass es sich bei diesem Problem um ein Monitorproblem handelte. Ich weiß immer noch nicht, warum, und ich kann es auch nicht erklären, aber es wurde jetzt behoben.
Ich habe meinen alten 1080p-Monitor entsorgt und als Ersatz einen brandneuen 2560x1440-Monitor gekauft. Jetzt läuft alles reibungslos.
Falls jemand zufällig auf dieses Problem stößt: Ich habe mir ein Benutzerskript (TamperMonkey) erstellt, das grundsätzlich alle CSS-Animationen im Browser deaktiviert. Es prüft jede Sekunde, ob es neue Animationen gibt, und beendet sie dann einfach. Einige Seiten sehen komisch aus, aber das ist ein guter Kompromiss im Vergleich zu der Verzögerung, die ich erlebt habe.
// ==UserScript==
// @name Disable all animations
// @version 1.0
// @author mortenmoulder
// @include *
// @grant GM_addStyle
// @grant GM_addElement
// ==/UserScript==
//remove animations globally
GM_addStyle("* { animation-duration: 0s !important; animation-play-state: paused; }");
var ignoreElements = [];
//remove animations inside shadow DOM elements
function findShadowRoots(elements) {
for (var i = 0; i < elements.length; i++) {
if(elements[i].shadowRoot) {
if(ignoreElements.includes(elements[i].shadowRoot) == false) {
GM_addElement(elements[i].shadowRoot, 'style', { textContent: '* { animation-duration: 0s !important; animation-play-state: paused;' });
ignoreElements.push(elements[i].shadowRoot);
}
findShadowRoots(elements[i].shadowRoot.querySelectorAll("*"));
}
}
}
//remove animations every 1 second
setInterval(() => {
var allNodes = document.querySelectorAll('*');
findShadowRoots(allNodes);
}, 1000);