Wir haben viele kleine CSS- und JS-Dateien und das Aktivieren des Zusammenführens scheint eine gute Wahl zu sein.
Viele der CSS- und JS-Dateien werden auf jeder Seite verwendet (Homepage, Kategorieseite, Produktdetailseite).
Wann immer wir sahen, dass auf jeder Seite eine andere zusammengeführte Datei erneut geladen wird, muss sich auch das enthaltene CSS überlappen.
Wie können wir dies vermeiden und mehr Daten wiederverwenden?
css
javascript
frontend
Alex
quelle
quelle
.css
und.js
Dateien. In einer Magento-Standardinstallation sind die.css
Dateien praktisch global identisch, sodass die zusammengeführte Datei einen identischen Hash hat. Da.js
dies jedoch sehr unterschiedlich ist, gibt es eine neu kombinierte Datei für Produktseiten und Kategorieseiten usw., die immer die vollständige Prototyp-Bibliothek enthält.Antworten:
Kurze Antwort: Aktivieren Sie niemals die JS / CSS-Zusammenführungsfunktion von Magento. Insgesamt ist die Leistung während des gesamten Lebenszyklus einer typischen Kaufabwicklung schlechter als wenn jedes Asset einzeln gesendet wird.
Lange Antwort: Sie sollten Benutzern nur eine CSS-Datei zur Verfügung stellen. Das Rendern mehrerer Dateien wird blockiert, bis das gesamte CSS heruntergeladen wurde. Sofern Sie nicht eine große Menge an CSS bereitstellen, ist es vorteilhaft, alles auf einmal zu senden, und der Browser hat es zwischengespeichert. Die Verwendung eines Pre-Prozessors wie Sass oder LESS kann diesen Schritt in Ihren Build-Prozess einbringen, anstatt Magento ineffizient arbeiten zu lassen.
Für JS sollten Sie diese Server im Idealfall nicht kombinieren. Clientseitige Skriptladeprogramme wie AMD / RequireJS sind die bessere Wahl und helfen beim Verwalten von Abhängigkeiten, was Magentos Layout-XML nicht tut. In der realen Welt wird Magento an mehreren Stellen im Checkout-Flow in Skripten abgelegt. Sie sind immer noch besser dran, wenn Sie den ersten Seitenlade-Treffer mehrerer Anfragen erzielen und anschließend separate, aber zwischengespeicherte Assets haben.
Die Fooman Speedster Advanced-Erweiterung ist die beste Wahl, um Assets intelligent zu kombinieren, ohne sie zu duplizieren (heute).
Die Magento 1.x-Architektur, die mit unzureichenden Praktiken für die Frontend-Leistung beginnt, schränkt Sie ein wenig ein. Es ist nicht realistisch, den Kurs dieses Schiffes zu ändern. Tragen Sie zu Magento 2 bei.
quelle
Wir haben die Fooman Speedster Magento Extension verwendet . Es ist eine wunderbare Erweiterung, die das Zusammenführen von CSS- und JS-Dateien verwaltet, um die Leistung Ihrer Seite zu steigern.
Von der Seite:
quelle
uglifyjs --compress
und mit Kommentaren besser umgehen könnten, könnten Sie mit meinem Code eine zusätzliche Verbesserung von etwa 4% erzielen . Ich benutze uglifyjs v3 vom Knoten.