So reduzieren Sie den Speicherverbrauch und die CPU-Auslastung von Webseiten

Manche Webseiten erscheinen möglicherweise nicht groß, lassen sich aber nur sehr langsam öffnen, während andere zwar sehr lange dauern, aber reibungslos zu verwenden sind. Dies wird durch die Speicher- und CPU-Auslastung des Computers des Benutzers beeinflusst.

Browserprobleme. Jeder Browser hat seine eigenen Speicherprobleme, die ihn beeinträchtigen können, aber es gibt fast keine Möglichkeit, dies zu kontrollieren. Unter Windows:

Bei der IE-Serie ist die Menge an Aktualisierungsrecycling nicht groß, durch Minimierung wird jedoch Speicher freigegeben.
Firefox 2 soll auch beim Minimieren recyceln, aber ich habe noch nie so viel Müll gesehen. Es nutzt so viel wie möglich und recycelt im Grunde nicht. Es wird gesagt, dass der Ajax-Prototyp den Speicherbedarf weiter erhöhen wird.
Oper ist das Beste. Immer gut unter Kontrolle. Es gibt kein Problem. .
Der Speicherzuweisungsmechanismus von Linux unterscheidet sich von dem von Win. Es wird so viel Speicher wie möglich verwendet. Wenn der Browser den gesamten Speicher belegt, kann das System abstürzen.

Seitenproblem: Der Browser verbraucht beim Rendern der Seite Speicher und CPU. Reduzieren Sie dies daher so weit wie möglich.

Verwenden Sie DocType strukturell, um dem Browser mitzuteilen, was Sie verwenden. HTML4 hat auch DTD. Vielleicht ist Transitional für Sie besser geeignet. Wenn Sie XHTML verwenden und eine gute Struktur beibehalten, denken Sie daran, die entsprechenden MIME- und XML-Header 1 auszugeben, was die Codeprüfung des Browsers verringern kann.
Behalten Sie die Struktur bei und überlassen Sie nicht dem Browser die Vervollständigung des Codes.
Um die Dateigröße der Seite zu kontrollieren, können Sie den Code mithilfe des Programms einrücken, um ihn angenehmer lesbar zu machen. Die Größe beträgt ebenfalls 2–3 KB.
Iframe generiert eine neue Seite. Tatsächlich gibt es viele Möglichkeiten, Iframe zu ersetzen.
Die eingeführten JS und CSS können entsprechend zusammengeführt werden, und auch die Hintergrundbilder können zusammengeführt werden. Manche Leute führen sogar Flash zusammen. Das Hinzufügen von Breitenattributen zu Inhaltsbildern/Objekten mit bekannter Breite und Höhe kann das teilweise erneute Rendern der Seite reduzieren. In den meisten Fällen ist der einzige Unterschied zwischen JPGs mit einer Qualität von 99 und 70 die Dateigröße. Dasselbe gilt für GIF, insbesondere kleine Symbole. Der Unterschied zwischen 256 Farben und 128 Farben ist die Dateigröße.
Flash bewegt sich zu schnell und verbraucht viel CPU. Die Anzahl der Bilder pro Sekunde und der Animationseffekt können reduziert werden. Wenn die Qualität auf mittel oder niedrig eingestellt ist, werden viele Ressourcen gespart, aber der Effekt geht auf Kosten. . Manchmal ist es sinnvoller, für das Qualitätsattribut Autolow2 oder Autohigh auszuwählen. Es ist nicht immer notwendig, „low“ oder „best“ auszuwählen.
Flash verwendet Vektorgrafiken, um Dateigröße zu sparen, nutzt jedoch die CPU zum Berechnen komplexer Grafiken und Animationen. Zu viele komplexe Filter verbrauchen viel Speicherplatz. Weichzeichnerfilter können diesen Aufwand reduzieren.
IE-Filter beanspruchen außerdem viel Speicher und weisen zudem Kompatibilitätsprobleme auf. Die Vollbildtransparenz ist sehr ressourcenintensiv.
Ein 2 x 2-Bild hat ungefähr die gleiche Größe wie ein 8 x 8-Bild, aber ein 2 x 2-gekachelter Hintergrund nimmt viel mehr Platz ein.
Auch GIF-Animationen beinhalten das Konzept von Frames. Behandeln Sie GIF daher nicht als Flash.
Importieren Sie nicht den gesamten Prototyp oder jQuery, nur um ein $()-Verhalten zu verwenden, sie haben mehr Funktionen.
AJAX ist cool. Für die Verwendung von XML ist jedoch ein XML-Parser erforderlich. Einige empfehlen die Verwendung von JSON, aber hierfür sind Evaluierungsdaten erforderlich. Tatsächlich können Sie das Skript, das bereits ein Objekt ist, direkt importieren. Sie müssen nur einen zusätzlichen Objektnamen übergeben oder den Objektnamen fest codieren oder ihn direkt als Funktion verwenden, wie es Flickr tut, jsonFlickrApi({"xxx":"xxx"}), haha.
Verwenden Sie „display:none“ nicht, wenn „visibility:hidden“ bestimmte Effekte lösen kann.
Es macht nicht viel Sinn, hier zu betonen, dass bei JS-Variablen auf globale und lokale Variablen usw. geachtet werden sollte. Die Komplexität von JS kann nicht in nur ein oder zwei Sätzen erklärt werden. Achten wir auf Yueyings neues Buch, das veröffentlicht wird. ^^
Tatsächlich ähneln viele der hier aufgeführten Inhalte dem Thema „Wie man schnell seine Webseiten präsentiert“, aber dieser Artikel konzentriert sich auf die Verarbeitung des Servers. In vielen Fällen führt die Einsparung von Serverressourcen jedoch auch zu einer Einsparung von Clientressourcen.

Tatsächlich liegt dieser Artikel schon seit langer Zeit im Entwurfsordner und ich hatte keine Zeit, ihn zu ordnen. Was ich Ihnen jetzt gebe, ist nicht vollständig, weil es noch nicht vollständig ist. Ich werde es nach und nach ergänzen.

--------------------------------------------------------------------------------

Problem: Obwohl es möglicherweise zu Problemen im Browsermodus kommt, kann das Problem gelöst werden. Siehe „XHTML mit dem richtigen MIME-Typ bereitstellen“. Der Browser zeigt den XML-Header nicht richtig an und die falsche Struktur führt dazu, dass die gesamte Seite nicht angezeigt wird.
Autolow: Priorisiert die Geschwindigkeit, versucht aber auch, wenn möglich das Erscheinungsbild zu verbessern. Wenn die Wiedergabe startet, wird das Anti-Aliasing deaktiviert. Wenn Flash Player erkennt, dass der Prozessor Anti-Aliasing beherrscht, aktiviert er die Funktion.
Autohigh: Zunächst wird der Wiedergabegeschwindigkeit und dem Erscheinungsbild das gleiche Gewicht beigemessen. Bei Bedarf wird das Erscheinungsbild geopfert, um die Wiedergabegeschwindigkeit sicherzustellen. Wenn die Wiedergabe beginnt, wird Anti-Aliasing aktiviert. Wenn die tatsächliche Bildrate unter die angegebene Bildrate fällt, wird das Anti-Aliasing deaktiviert, um die Wiedergabegeschwindigkeit zu erhöhen. Verwenden Sie diese Einstellung, um den Anti-Alias-Befehl (Ansicht > Vorschaumodus > Anti-Alias) zu emulieren.
Unschärfefilter: Wenn Sie Unschärfefilter verwenden und die für blurX und blurY verwendeten Werte ganzzahlige Potenzen von 2 sind (z. B. 2, 4, 8, 16 und 32), kann die Berechnungsgeschwindigkeit beschleunigt und die Leistung um 20 % bis 30 % verbessert werden (die Flash-Hilfe sagt dies).