Das gesamte Javascript auf der Website arbeitet in Firefox 4 schrecklich langsam, wenn transparente PNGs auf der Seite vorhanden sind

Lesezeit: 7 Minuten

Benutzeravatar von alt
alt

ETA-AKTUALISIERUNG: Ich habe festgestellt, dass, wenn ich alle transparenten .png-Dateien von meiner Site entferne, es ungefähr 5 gibt, es gut läuft. Das ist merkwürdig. Und positive Stimmen wären sehr hilfreich, ich habe es auf ein paar weiteren Computern getestet, und 15.4 habe dieses Problem. Vielen Dank! Irgendwelche Ideen?

Läuft gut auf PC Firefox und allen anderen Browsern, aber auf 4/15-Computern in Mac Firefox ist das Javascript einfach schrecklich langsam, insbesondere die Menüleiste. Ich habe sie beide außerhalb der Website getestet und sie haben gut funktioniert. Das Problem besteht schon seit geraumer Zeit, keine Ahnung wie man es lösen kann. Aktualisiert, das Problem verschwindet, wenn ich transparente PNGs von der Website entferne, wie das Banner oben links.

Meine Seite: http://thenozzle.net/

Das gesamte Javascript ist etwas langsamer als in anderen Browsern, die beiden größten sind die Menüleiste und der Videoplayer. Ich kann es an dieser Stelle nicht ignorieren.

Ich frage mich, ob es etwas ist, das WordPress hinzufügt, weil das js anderswo gut funktioniert.

Irgendwelche Ideen?

ETA: Hier ist meine JS-Datei:

http://thenozzle.net/wp-content/themes/twentyten/scripts.js

ETA: Hier ist mein Menüleistencode

$(function() {
    $('#sdt_menu > li').bind('mouseenter',function(){
        var $elem = $(this);
        $elem.find('img')
             .stop(true)
             .animate({
                'width':'170px',
                'height':'170px',
                'left':'0px'
             },400,'easeOutBack')
             .andSelf()
             .find('.sdt_wrap')
             .stop(true)
             .animate({'top':'140px'},500,'easeOutBack')
             .andSelf()
             .find('.sdt_active')
             .stop(true)
             .animate({'height':'170px'},300,function(){
            var $sub_menu = $elem.find('.sdt_box');
            if($sub_menu.length){
                var left="170px";
                if($elem.parent().children().length == $elem.index()+1)
                    left="-170px";
                $sub_menu.show().animate({'left':left},200);
            }
        });
    }).bind('mouseleave',function(){
        var $elem = $(this);
        var $sub_menu = $elem.find('.sdt_box');
        if($sub_menu.length)
            $sub_menu.hide().css('left','0px');

        $elem.find('.sdt_active')
             .stop(true)
             .animate({'height':'0px'},300)
             .andSelf().find('img')
             .stop(true)
             .animate({
                'width':'0px',
                'height':'0px',
                'left':'85px'},400)
             .andSelf()
             .find('.sdt_wrap')
             .stop(true)
             .animate({'top':'25px'},500);
    });
});

  • Funktioniert gut für FF4 auf Win7. Meine Verbindungen sind im Moment langsam, also hat das Video etwas gestreamt, war aber nicht langsam oder so. Das gleiche mit dem Menü

    – JohnP

    18. Juni 2011 um 11:19 Uhr

  • Keine große Hilfe, ich weiß, aber ich habe es gerade mit Firefox 4 unter Windows XP ausprobiert und es sieht so aus, als ob es perfekt funktioniert.

    – James Allardice

    18. Juni 2011 um 11:20 Uhr

  • Verwenden Sie den Profilmanager von Firefox, um ein neues, leeres Profil zu erstellen – ohne Add-Ons und nur die Plugins, die Ihre Website benötigt (Sie können mehrere Profile behalten). Laden Sie auch so etwas herunter und führen Sie es aus sauberer. … … Firefox braucht vielleicht nur eine gute “Reinigung”/Komprimierung, oder einige Add-Ons können die Werke gummieren.

    – Brock Adams

    18. Juni 2011 um 11:37 Uhr

  • Jeder? Das ist ein riesiges Problem, eine Abstimmung nach oben würde helfen!

    – Alt

    20. Juni 2011 um 7:52 Uhr

  • Das Menü funktioniert in Firefox 4 unter Linux auf meinem Computer einwandfrei, das Video lädt ziemlich langsam, spielt aber gut ab (aber glauben Sie, dass das mit Javascript zusammenhängt?). Das Menü ist in Chrome viel glatter, aber immer noch recht brauchbar. Vielleicht verwenden Sie eine Javascript-Funktion, die in der Mac-Implementierung von Firefox besonders langsam ist, sehen Sie nach, ob es dazu einen Fehlerbericht gibt …

    – Stein G. Strindhaug

    20. Juni 2011 um 8:03 Uhr

Benutzeravatar von stimpy
reizbar

Ich schlage vor, Sie haben möglicherweise einige leicht beschädigte PNGs.

Schlagen Sie vor, Folgendes zu versuchen: Speichern Sie die PNGs erneut aus Photoshop. Speichern Sie sowohl PNG-24 als auch PNG-8. Prüfen .

Ich habe das schon einmal bei PNGs gesehen, die nicht ganz richtig gespeichert wurden.

Ich habe die Seite auf zwei Macbooks Pro getestet, eines ein Core Duo 2 und das andere ein Core Duo. Beide liefen gut, das Menü war sehr reaktionsschnell, selbst während das Video abgespielt wurde.

Angenommen, Sie haben einen der anderen Schritte, die in anderen Antworten hier auf “Suspect Macs” aufgeführt sind (dh neue Konten erstellt und getestet), dann müssen Sie sich meiner Meinung nach ansehen, was diese Macs sonst noch unterscheidet? Welche Version von OS X? Welches Modell ( dh Macbook vs. Macbook Pro vs. Air usw.)

  • Ich habe dies auf zwei Macbook-Profis getestet, einem Core Duo und einem Core 2 Duo. Bei mir lief alles bestens. Ich habe Safari und Firefox 4.0 ausprobiert

    – steif

    9. August 2011 um 5:21 Uhr

  • Habe weitere Macs getestet. Das hat so viel von meiner Zeit gekostet, 4/22 erlebe jetzt das Problem. Immer noch zu viele.

    – Alt

    9. August 2011 um 6:21 Uhr

  • ENDLICH GELÖST!!!!! JAAA!!!!! Ich habe die störenden PNG-Dateien entfernt, sie in Photoshop mit den gleichen Abmessungen komplett neu erstellt, aber dieses Mal habe ich sie nicht mit ImageOptim komprimiert, einer Mac-App zum verlustfreien Komprimieren von Bildern im laufenden Betrieb. ImageOptims png-crush hat etwas getan, das Javascript-Effekte stark verlangsamt und dann Divs über die PNG-Dateien verschoben hat. BEHOBEN, nochmals vielen Dank!

    – Alt

    28. August 2011 um 0:09 Uhr

Aloks Benutzeravatar
Alok

Firefox 4.0 auf Mac sollte OpenGL für die Hardwarebeschleunigung verwenden, während FF auf Windows Direct2D verwendet. Da das Problem nur bei einigen Macs auftritt, könnte es etwas mit ihrem Grafikkarten-Chipsatz zu tun haben – vielleicht die Spezifikationen der betreffenden Macs vergleichen und auch versuchen, die Hardwarebeschleunigung zu deaktivieren, um zu sehen, ob die Probleme verschwinden?

  • Danke für die Vorschläge. Daran habe ich noch nie gedacht. Ich werde heute Nachmittag testen.

    – Alt

    8. August 2011 um 20:44 Uhr

Versuchen Sie, ein neues Firefox-Profil zu erstellen, damit Sie es ohne installierte Erweiterungen, Add-Ons usw. ausführen können. Es kann sein, dass eine Erweiterung (AdBlock, GreaseMonkey usw.) irgendwie mit einigen der Skripte auf Ihrer Seite in Konflikt steht.

Ich habe es gerade in FF4 auf meinem Mac (MacBook Pro, 10.6.7) getestet und es wurde schnell geladen, also könnte es nur an Ihrem Setup liegen.

  • Es war eine gute Idee, aber es hat nichts gebracht. Ich habe auf 10 MacBooks getestet, und zwei von ihnen haben das Problem. Ich kann nicht meinen Finger darauf legen.

    – Alt

    20. Juni 2011 um 8:03 Uhr

  • Hm. Haben Sie versucht, auf einem der MacBooks, die das Problem zeigen, ein brandneues Benutzerkonto zu erstellen und es dort zu testen, um die Möglichkeit auszuschließen, dass etwas anderes auf dem System in Konflikt gerät? Wahrscheinlich ein bisschen übertrieben, aber wenn nichts anderes funktioniert, können Sie das versuchen.

    – Scott

    20. Juni 2011 um 8:07 Uhr

  • Das habe ich tatsächlich probiert, kein Unterschied. Ich habe ein aktuelles MacBook, in Core 2 Duo, 4 GB RAM, gute Grafikkarte, sollte gut funktionieren!

    – Alt

    20. Juni 2011 um 8:09 Uhr

  • Vielleicht möchten Sie dann versuchen, Komponenten zu entfernen und erneut zu testen. Versuchen Sie, das Video vollständig zu entfernen und zu aktualisieren, sehen Sie, was passiert. Machen Sie dasselbe für die Navbar, sehen Sie, was passiert. Versuchen Sie, einen bestimmten Teil der Seite zu isolieren, der Probleme verursacht. Es ist ein etwas schmerzhafter Prozess, aber er könnte Ihnen helfen, einen Problembereich aufzuspüren.

    – Scott

    20. Juni 2011 um 8:17 Uhr

  • Benutzte Scotties Idee. Es sind diese transparenten PNGs. Wenn ich sie alle entferne, funktioniert die Menüleiste einwandfrei. Wenn ich dann einen nach dem anderen entferne, wird es nach und nach besser, bis sie alle weg sind. UPVOTES-HILFE. Bitte.

    – Alt

    26. Juni 2011 um 23:07 Uhr

Ich würde zuerst den HTML-Code validieren, da es möglich ist, dass HTML-Tags nicht geschlossen werden und ein seltsames Verhalten mit Javascript erzeugen. Validieren Sie Ihren HTML-Code und verwenden Sie Firebug, um Ihnen zu helfen.

Danach würde ich versuchen, einen anderen Abstandshalter zu verwenden wie diese.

Ich weiß nicht, ob Firefox das gleiche Problem hat, aber ich weiß, dass, wenn Sie kleine transparente PNG-Dateien (wie 1×1) kacheln, dies zu einem Speicherleck in IE7 führt. Verwenden Sie ein größeres Bild, um es zu beheben.

  • Wie in meinem Kommentar zum Beitrag von @desbest habe ich versucht, Google Analytics zu nullen, das das Spacer-PNG geladen hat, es läuft immer noch sehr langsam.

    – Alt

    5. August 2011 um 18:44 Uhr

  • Wie in meinem Kommentar zum Beitrag von @desbest habe ich versucht, Google Analytics zu nullen, das das Spacer-PNG geladen hat, es läuft immer noch sehr langsam.

    – Alt

    5. August 2011 um 18:44 Uhr

1386800cookie-checkDas gesamte Javascript auf der Website arbeitet in Firefox 4 schrecklich langsam, wenn transparente PNGs auf der Seite vorhanden sind

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy