Serverseitiges Zusammenführen und Komprimieren von JS- und CSS-Dateien

Autor：Eve Cole Aktualisierungszeit：2010-06-14 18:58:46

2JavaScript- und CSS-Dateien serverseitig zusammenführen und komprimieren

Eine der wichtigsten Best Practices zur Optimierung der Web-Performance ist die Reduzierung von HTTP-Anfragen und ist auch die wichtigste Regel in YSlow. Zu den Lösungen zur Reduzierung von HTTP-Anfragen gehören das Zusammenführen von JavaScript- und CSS-Dateien, CSS-Sprites, Image Maps und die Verwendung von Daten-URIs zum Kodieren von Bildern. CSS-Sprites und Image-Mapping sind mittlerweile allgemein verfügbar, aber da IE6 und IE7 keine Daten-URIs unterstützen und Leistungsprobleme auftreten, wurde diese Technologie nicht weit verbreitet eingesetzt. Derzeit ist die Anzahl der JavaScript- und CSS- Dateien in den meisten Webseiten dieselbe wie bei der Entwicklung. Eine kleine Anzahl von Webseiten wird je nach tatsächlicher Situation lokal zusammengeführt. Jede neue Zusammenführung muss erneut lokal durchgeführt werden und ist relativ umständlich und umständlich, und die Komprimierung derselben Datei ist ähnlich. Durch die serverseitige Zusammenführung und Komprimierung können wir die Dateigranularität gemäß der Entwicklungslogik so klein wie möglich machen und die URL-Regeln auf der Webseite verwenden, um Dateien automatisch zusammenzuführen und zu komprimieren, was sehr flexibel und effizient ist.

YUI-Combo-Handler

Im Juli 2008 gab das YUI-Team bekannt, dass es einen Combo-Handler- Dienst für YUI-JavaScript-Komponenten auf YAHOO! bereitstellen wird. Combo Handler ist ein von Yahoo! entwickeltes Apache-Modul, das es Entwicklern ermöglicht, JavaScript- und CSS-Dateien einfach und bequem über URLs zu kombinieren und so die Anzahl der Dateianfragen erheblich zu reduzieren. Die Verwendung der Rich-Text-Editor-Komponente von YUI2 auf einer Seite erfordert beispielsweise die Einführung mehrerer JavaScript-Dateien. Die gängigen Methoden sind wie folgt:

Nach Verwendung des Combo-Handler-Dienstes kann der obige Code wie folgt geschrieben werden:

Durch die Verwendung des Combo Handler-Dienstes wird nicht nur die Lesbarkeit des Codes geringfügig verringert, sondern auch die Anzahl der HTTP-Anfragen erheblich reduziert und auch die Menge an URL-Code reduziert, was für die Optimierung der Webleistung von entscheidender Bedeutung ist. Daher verfügt die Kernkomponente YUI Loader ab YUI 2.6.0 über eine integrierte Combo-Handling-Funktion. Das heißt, bei Verwendung des YUI Loader können durch Konfigurieren des Combine-Attributs mehrere zu ladende JavaScript- oder CSS-Dateien geladen werden Form der Nutzung des Combo-Handler-Dienstes, sofern der statische Dateiserver Combo-Handler unterstützt. Wenn Combine in YUI auf „true“ konfiguriert ist, verwendet das CDN standardmäßig Yahoo! CDN ( http://yui.yahooapis.com ), sodass kein Problem besteht. Dies ist einer der reizvollsten Teile von YUI.

Leider ist die Geschwindigkeit von http://yui.yahooapis.com in China nicht sehr gut. Ursprünglich stellte Yahoo China http://cn.yui.yahooapis.com/ bereit, bot jedoch noch keinen Combo-Handler-Dienst an Gleichzeitig sind die Updates aus verschiedenen Gründen seit YUI 2.7.0 ins Stocken geraten. Was noch schlimmer ist: Obwohl das von Yahoo! entwickelte Apache-Modul angeblich Open Source sein soll, handelt es sich zumindest vorerst noch um eine private Technologie. Um es nutzen zu können, müssen Sie ähnliche Funktionen selbst implementieren Es gibt nicht viele Anwendungen ähnlicher Technologien in China.