it-swarm.com.de

Minimieren von JS oder CSS im laufenden Betrieb

So minimieren Sie JS und CSS im laufenden Betrieb, sodass ich die ursprüngliche Codestruktur in meinen Servern beibehalten kann, wenn sie auf der Laufzeit minimiert wird.

39
gourav

Nach vielen Such- und Website-Optimierungen empfehle ich wirklich, dieses Skript für CSS-Dateien zu verwenden:

<style>
<?php
     $cssFiles = array(
      "style.css",
      "style2.css"
    );

    $buffer = "";
    foreach ($cssFiles as $cssFile) {
      $buffer .= file_get_contents($cssFile);
    }
    $buffer = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!', '', $buffer);
    $buffer = str_replace(': ', ':', $buffer);
    $buffer = str_replace(array("\r\n", "\r", "\n", "\t", '  ', '    ', '    '), '', $buffer);
    echo($buffer);
?>
</style>

Es komprimiert alle CSS-Dateien in eine und über diese in HTML, wodurch die Anzahl zusätzlicher Anforderungen auf Null reduziert wird. Sie können auch eine eigene komprimierte.css-Datei erstellen, wenn Sie dies vorziehen möchten, anstatt Stile in html einzufügen.

18
Krzysiu Jarzyna

Ich denke, Ihre Frage sollte eigentlich lauten: Wie kann ich meine Live-Server zuverlässig und wiederholt aktualisieren? Was Sie brauchen, ist ein automatisches Bereitstellungsskript. Persönlich Ich bevorzuge Stoff , aber es gibt andere Werkzeuge zur Verfügung.

Mit einem automatischen Bereitstellungsskript können Sie einen einzelnen Befehl ausführen, der zu Live-Servern führt, den Quellcode aktualisiert, alle Bereitstellungsschritte (z. B. das Minimieren von Javascript) ausführt und den Webserver neu starten.

Sie möchten keine Javascript- oder CSS-Dateien im laufenden Betrieb minimieren. Sie sollten dies einmal bei der Bereitstellung tun und dann eine Variable in Ihrem Code haben, die angibt, ob es sich um eine Live-Bereitstellung handelt oder nicht. Wenn die Variable wahr ist, sollten Ihre Links zu den Dateien Links zu der minimierten Version sein. Wenn sie falsch ist, sollten sie zu den normalen Versionen gehören.

Es gibt eine Reihe von Programmen, die eine Minimierung durchführen, eines, das noch nicht erwähnt wurde, ist JSMin .

10

Wenn Sie Ihr JavaScript etwas weniger lesbar machen möchten und dies zur Laufzeit tun, können Sie es sehr, sehr einfach halten. Mit nur drei Zeilen Code können Sie innerhalb weniger Millisekunden einen weiten Weg zur totalen Minifizierung erreichen.

// make it into one long line
$code = str_replace(array("\n","\r"),'',$code);
// replace all multiple spaces by one space
$code = preg_replace('!\s+!',' ',$code);
// replace some unneeded spaces, modify as needed
$code = str_replace(array(' {',' }','{ ','; '),array('{','}','{',';'),$code);

Dadurch wird keinerlei Syntaxprüfung durchgeführt. Code kann danach ungültig werden. Überprüfen Sie das Ende der Zeilen in Ihrer JS, ist ein ";" fehlt irgendwo?

5
KIKO Software

HTML5 Boilerplate enthält ein praktisches Build-Skript, das JS, CSS, Bilder und vieles mehr komprimiert. Hör zu!

Wie in den anderen Antworten erläutert, wäre eine "echte" Minify-Minifizierung (bei jeder Anforderung wird eine Datei dynamisch komprimiert werden) keine sehr gute Idee.

4
Mathias Bynens

Wenn ich so frei sprechen darf;

Das Minimieren einer JS/CSS-Datei hätte zum Ziel, dass sie schneller analysiert wird (und außerdem weniger Festplattenspeicher benötigt). Durch die Minimierung zur Laufzeit würde dieser Vorteil vollständig verloren gehen.

Vielleicht irre ich mich in Ihrem Endziel, aber das fällt mir zuerst ein.

Bearbeiten: post by @Ant hat es für mich geklärt.

3
Steven Ryssaert

Wenn Sie die vollständige Kontrolle über Ihre Apache/Ngnix-Konfiguration haben, können Sie (in der Regel) das Modul PageSpeed ​​ in Ihrem Fall aktivieren 

2
stefano di luca

Assetic ist ein Nizza-Projekt, das bei der Organisation von Ressourcen wie CSS und Javascript einschließlich Minifizierung hilft. hier für eine Einführung.

Im Allgemeinen sollte die Laufzeitminification immer mit solider Zwischenspeicherung auf der Serverseite und der Verwendung von Client- und Proxy-Caches auf dem Weg zum Browser kombiniert werden. 

2
Stefan Gehrig

Sie müssen dies system(); tun

$ Java -Jahr Yuicompressor-x.y.z.jar

http://developer.yahoo.com/yui/compressor/

1
dynamic

Genau das tun WebUtilities (für J2EE). Hier ist der Link.

http://code.google.com/p/webutilities/

Es macht die Minifizierung und das Verschmelzen im laufenden Betrieb. Es verfügt auch über eine Zwischenspeicherung, um eine erneute Minimierung oder Wiederaufbereitung einer Ressource zu vermeiden, wenn die Ressource nicht geändert wird. Es hilft auch bei folgenden Optimierungen.

  • Servieren Sie mehrere JS- oder CSS-Dateien in einer Anforderung
  • Fügen Sie den Expires-Header für JS-, CSS- und Image-Dateien hinzu, die vom Browser zwischengespeichert werden sollen
  • Reduzieren Sie JS, CSS-Dateien im Handumdrehen
  • Reduzieren Sie Inline-CSS- und JS-Codeblöcke
  • Fügen Sie Ihrer Antwort Zeichenkodierung hinzu
  • Serverkomprimierte Inhalte (gzip/compress/deflate)
  • Antworten im Cache zwischenspeichern, um Wiederaufbereitung zu vermeiden

Bitte schauen Sie, ob Sie es interessant finden. 

0
Rajendra