friendsofredaxo / minify

Minifiziert und bündelt CSS/Sass, JavaScript, HTML und Bilder im Medienpool.

Minify

Minifies HTML, combines/minfies CSS and JS files.

Dieses Addon ermöglicht das minimieren und bündeln von CSS und JS Dateien.

Dazu kann man unter dem Punkt 'Minify' beliebig viele Sets anlegen. Wichtig ist, dass der Name eines Sets pro Typ (CSS/JS) nur einmal vorkommen kann. In das Feld 'Assets' kommen zeilengetrennt die Pfade zu den einzelnen Dateien. Wenn eine Datei mit '.scss' endet, wird sie automatisch kompiliert. Die Pfade müssen Redaxo-Root relativ sein.

Anschliessend wird ein Snippet à la "REX_MINIFY[type=css set=default]" generiert, welches im Template an beliebiger Stelle platziert werden kann. Das Snippet ist jeweils in der Set-Übersicht zu finden und kann von da kopiert werden. Das Snippet wird im Frontend automatisch durch einen entsprechenden HTML-Tag ersetzt.

minify's Issues

SCSS im Debug-Modus kompilieren

Im Debug-Modus wird nur auf die SCSS-Datei verlinkt, diese müsste aber bereits kompiliert sein.

Relative Path

Need to have it work with relative path (like for apps in subfolders)

Less- und Sass-Compiler?

Nur eine Frage: Was würdet Ihr davon halten, hier doch noch optional less- und sass-compiler mit einzubauen?
Ich finde minify super, auch die Art, wie man seine Sets definiert.
Aktuell wüsste ich jetzt aber nicht, wie man da noch schön mit CSS-Compilern arbeiten könnte, ohne das vorab immer lokal zu kompilieren.

Zielordner selbst definieren

Wunsch: Es wäre Klasse wenn man noch über die Kofiguration im Backend den Pfad – wo die css- oder js-Dateien abgespeichert werden – selbst definieren könnte (z.B. direkt in /assets/css oder assets/js anstatt immer in assets/addons/minify/cache).

Nur Pfad zur CSS/JS-Datei

Ich benötige den Pfad zur CSS ohne -Tag. Gibt's eine einfache Möglichkeit, da ranzukommen?

Daten aus Ordner beziehen

Hey Thomas,
ist es für dich denkbar, dass statt einzelner Dateien auch ein Ordner ausgewählt werden kann?
Beispiel:
Wenn ich /theme/public/assets/js/file.js und /theme/public/assets/js/file1.js eingebe bleibt alles beim alten, wenn ich /theme/public/assets/js/ eingebe, werden automatisch alle Dateien im Ordner zusammengefasst?

Bei mir ist es immer wieder so, dass ich beim entwicklen nach und nach mehr Dinge reinpacke. Die kopiere ich dann in mein js Ordner und muss anschließend den Pfad noch im Plugin hinterlegen. Wäre schön wenn das automatisiert gehen würde.

Minimieren der Dateien funktioniert nicht

Hallo,

ich habe gerade das Addon zum ersten Mal im (Test)Einsatz.
Leider funktioniert das Zusammenfassen von Dateien nicht. Sobald ich den Haken bei Minimieren meines CSS-Sets setze, erhalte ich nur diesen Fehler:
Minifyerror: File "/media/style.css" does not exists

Die Datei ist definitv da, denn ohne dem Haken werden mir einzelne Einbindungen ausgegeben und die Dateien können dirt aufgerufen werden:

<link rel="stylesheet" href="\media\style.css?time=" media="screen"><link rel="stylesheet" href="\media\style-addons.css?time=" media="screen"><link rel="stylesheet" href="\media\style-mobile.css?time=" media="screen"><link rel="stylesheet" href="\media\jquery\flowplayer\skin\skin.css?time=1534765128" media="screen"><link rel="stylesheet" href="\media\jquery\slick\slick.css?time=1523965752" media="screen">

Es scheint aber, dass beim Durchlaufen der Assets nur die letzte Datei korrekt ausgelesen wird.
Bei der Inline-Einbindung wird nämlich nur diese ausgegeben.

Ist das Problem bekannt?

Getestet mit: redaxo 5.7.1 (lokal im Xampp) und aktuellster minify-Version

Inline-Kommentare im JS entfernen

Beim eindampfen der Zeilenumbrüche werden // Einzeilige Kommentare nicht entfernt und deaktivieren dadurch den restlichen JS-Code.

Browsercache umgehen als optionale Konfiguration

SCSS wird nicht neu generiert, wenn set als "inline" ausgewählt

Sollte aber so sein. Funktioniert, wenn Ausgabe als Dateien.

Fehlermeldung, wenn nicht im Debugmodus

Auf Redaxo 5.2.0 und PHP 7.0.11 generiert Minify folgende Fehlermeldung, wenn der Debugmodus ausgeschaltet ist:
`"Error" thrown in /path/to/site/redaxo/src/addons/minify/lib/class.minify.php on line 85
Class 'MatthiasMullie\Minify\JS' not found

#0 /path/to/site/redaxo/src/addons/minify/boot.php(59): minify->minify('js', 'JS', 'file')
#1 /path/to/site/redaxo/src/core/lib/extension.php(45): rex_package->{closure}(Object(rex_extension_point))
#2 /path/to/site/redaxo/src/core/lib/response.php(129): rex_extension::registerPoint(Object(rex_extension_point))
#3 /path/to/site/redaxo/src/addons/structure/plugins/content/boot.php(50): rex_response::sendPage('...', 1478629129)
#4 /path/to/site/redaxo/src/core/lib/extension.php(45): rex_package->{closure}(Object(rex_extension_point))
#5 /path/to/site/redaxo/src/core/frontend.php(23): rex_extension::registerPoint(Object(rex_extension_point))
#6 /path/to/site/redaxo/src/core/boot.php(105): require('/path/to/site...')
#7 /path/to/site/index.php(9): require('/path/to/site...')
#8 {main}`

Browser-Cache umgehen bei JS lädt JS grundsätzlich neu

Es wird immer ein neuer Zeitstempel angehängt, doch eigentlich sollte es der Zeitstempel der Datei, damit die Datei nur dann neu geladen wird, wenn sich eine Änderung ergeben hat.

async-Attribute für javascript

Bei der Ausgabe eines Javascript-Sets wäre ein async-Attribut angenehm, damit Google Insight zufrieden gestellt werden kann.

Vorschlag: Attribute zulassen im Ausgabe-String:
REX_MINIFY[type=js set=default attributes='async']

Oder direkt in der Datenbank.

Debugmodus für CSS/JS trennen

Konfigurationsseite: Gleiches Markup wie bei anderen Addons verwenden

ich verwende custom-styles im backend und der minify-safe-button tanzt aus der reihe. andere addons haben das folgende markup für save-buttons:

<button id="rex-[addon-name]-save" type="submit" name="config-submit" class="btn btn-save rex-form-aligned" value="1">Einstellungen speichern</button>

minify benutzt <input type="submit">

man müsste zeile 69 in der config.php wie folgt ändern (ungetestet):

$n['field'] = '<button id="rex-minify-save" type="submit" name="config-submit" value="'.$this->i18n('config_action_save').'" class="btn btn-save rex-form-aligned" '.rex::getAccesskey($this->i18n('config_action_save'), 'save').'>';

oder man gibt dem input einfach die klassen btn btn-save mit.

kann mir jemand bei der gelegenheit erklären, was es damit auf sich hat?
value="'.$this->i18n('config_action_save').'"

Pfade in Inline-CSS stimmen nicht mehr

Für das Inline-CSS müssten die Pfade im CSS relativ zur HTML-Datei angepasst werden. Minify rechnet sie nur relativ zur CSS-Ausgabedatei um.

HTML Kommentare ohne Conditionals entfernen

Hallo,

kann der preg_replace so angepasst werden, dass die conditionals comments erhalten bleiben?
Es wäre außerdem gut, wenn man es um eigene non-capturing groups erweitern könnte.

Ein weiteres Problem ist, das search_it nicht mit dem minify HTML läuft, da search_it eigene Tags wie einbaut und diese eben nicht entfernt werden dürfen.

$content = preg_replace(['/<!--(.*)-->/Uis',"/[[:blank:]]+/"], ['',' '], str_replace(["\n","\r","\t"], '', $content));``

Mögliche Syntax.

<!-- #01: "<!--" (?! #02: look-ahead: a position not followed by: \s* #03: any number of space (?: #04: non-capturing group, any of: \[if [^\]]+] #05: "[if ...]" |<! #06: or "<!" |> #07: or ">" ) #08: end non-capturing group ) #09: end look-ahead (?: #10: non-capturing group: (?!-->) #11: a position not followed by "-->" . #12: eat the following char, it's part of the comment )* #13: end non-capturing group, repeat --> #14: "-->"

Cache löschen

es sollte die Möglichkeit geben, die CSS/JS-Dateien auf Kommando neu zu generieren.

Leerzeile in minify-Profilen führt zu Problem

Aktueller Fall:

assets/css/datei1.css
assets/css/datei2.css
assets/scss/datei3.scss

Die Leerzeile am Ende führt dazu, dass kein SCSS mehr generiert wird.

Ordner /assets/addons/minify/cache wird nicht angelegt...

...wenn nur .scss Dateien genutzt werden, da kein rex_file::put() genutzt wird

criticalCSS automatisch berechnen und ausgeben (Enhancement)

Enhancement: Folgendes Konzept würde Google Insight noch glücklicher machen (habe das bei einem Shop umgesetzt mit gutem Erfolg):

1. Wenn Seite vollständig geladen, CSS-Rules für "Above the Fold" bestimmen
2. Das gefundene Regel-Set per Ajax zurück schreiben und speichern
3. Beim nächsten Seitenaufruf das CSS inline in den Head einfügen, dafür alle CSS hinter den schliessenden html-Tag

Erfassung des critical-CSS

• Pro Article-ID, clang_id und isMobile true/false
• nur einmal und dann am besten mit einem Security Code (sonst könnte man von aussen beliebigen CSS-Code übergeben)
• criticalCSS muss auch manuell ergänzt werden können
• criticalCSS sollte im Cache gespeichert sein und per "Cache leeren" erneuert werden können

Brauchbare Funktionen hierzu:

• https://gist.github.com/scottjehl/b6129da04733e4e0f9a4
• https://github.com/PrestaShop/PrestaShop/blob/develop/tools/mobile_Detect/Mobile_Detect.php

Die Funktion passt irgendwie ins Minify-Addon.

Browsercache-Option mit filectime statt time

Ich möchte gern den Cachebreaker bei minimize=='yes' nutzen. Bisher wird dieser jedoch mit time() gesetzt, was immer zu einem Neuladen des Assets führt. Das Asset soll sich jedoch nur dann neu laden, wenn es eine Dateiänderung gab (mit filectime), so wie es bei minimize=='no' bereits eingerichet ist.

In boot.php:

$content = str_replace($match[0], '<link rel="stylesheet" href="'.trim($data).(($sets[0]['ignore_browsercache'] == 'yes') ? '?time='.filectime(ltrim($data, '/')) : '').'" '.((!empty($sets[0]['attributes'])) ? implode(' ', explode(PHP_EOL, $sets[0]['attributes'])) : '').'>', $content);

Würde mich freuen, wenn das übernommen werden würde.

css einbinden media=xxx

Toll wäre es wenn ich dem CSS Link noch ein media="print" / media="screen" mitgeben könnte

LG
Oliver

Internal Server Error

Wenn ich die aktuelle Version aus dem Installer aktiviere erhalte ich einen Internal Server Error.
REX 5.2.0

Hat das sonst niemand?

Cache löschen führt zur Löschung der CSS-Dateien

Hallo, ich weiß, das wurde hier schon erwähnt, doch für meine Projekte ist das ziemlich schlimm.
Ich habe alle CSS, JS-Dateien in einem eigenen Verzeichnis "resources". Beim Löschen des Minify-Caches werden (zumindest) die CSS Dateien, die ich in den Minify-Sets eingebunden habe, radikal und ohne Vorwarnung gelöscht. Kann ich das vermeiden? Oder, besser: könnte das im Addon geändert werden?
LG Heinz

Feature: Debug-Modus

Stell ich mir so vor:

In den Addon-Einstellungen aktiviert gibt es statt minifiziertem CSS/JS die Link-Tags/Script-Tags zu den ursprünglichen Dateien zurück.

SCSS neu kompilieren, wenn sich importierte Dateien geändert haben

Ich bräuchte die Möglichkeit, dass auch Änderungen in importierten SCSS-Dateien ermittelt werden.

Ideen:

• minify schaut direkt in das SCSS und sucht nach verlinkten SCSS-Dateien, oder
• minify bietet die Möglichkeit, einen Ordner nach Änderungen zu überwachen (ist vlt. am einfachsten), oder
• minify bietet die Möglichkeit, mit einer Checkbox im Entwicklungsmodus das SCSS fortwährend neu zu generieren.

Fehler, wenn Cache-Verzeichnis nicht erstellbar

Es gibt Situationen bei Hostern, da wird bei der Installation von minify kein Cache-Verzeichnis erstellt und dieses ist demzufolge dann auch nicht beschreibbar, weshalb minify nicht funktionieren kann in diesem Moment.

Genauer kann ich das Problem jedoch noch nicht eingrenzen. Hatte den Fall jetzt schon 3-4 Mal.

Deprecated: implode(): Passing glue string after array is deprecated. Swap the parameters

Den Fehler sehe ich schon seit längerem im System Log:

Typ: Deprecated
Nachricht: implode(): Passing glue string after array is deprecated. Swap the parameters
Datei: redaxo/src/addons/minify/vendor/minify/src/CSS.php
Zeile: 518

Redaxo: 5.10.0
PHP: 7.4.3

Fatal error: Class 'MatthiasMullie\Minify\Minify\JS' not found

Ich habe über den Installer Version 1.0 von Minify installiert und bekomme folgende Fehlermeldung, wenn ich versuche das Addon zu nutzen:

Fatal error: Class 'MatthiasMullie\Minify\Minify\JS' not found

Addon löscht Dateien, die nicht von Minify sind

Szenario: Nach einem Update von minify und Cache löschen werden ALLE Dateien im Cache-Ordner gelöscht. Falls dieser in einer älteren Konfiguration derselbe ist wie der Basis-Ordner - nämlich /assets/js/ bspw., dann werden darin alle Dateien Ursprungs-Dateien des Projekts gelöscht. Das ist fatal.

SCSS kaputt?

Hi, seit einem Update auf R5.6.4 funktioniert das Kompilieren von SCSS Dateien nicht mehr, kann das sein? Zumindest habe ich hier in einem Projekt plötzlich Probleme mit Minify und SCSS Änderungen.

Einstellungsseite überarbeiten

Auf basis von https://redaxo.org/api/master/class-rex_config_form.html und so, dass die Eingabefelder die volle breite haben. Da fehlt sicher wieder eine form-control-Klasse irgendwo.

v. 2.2. Class 'MatthiasMullie\Minify\CSS' not found

Nach Update auf 2.2

Ziel-Ordner aufräumen bzw immer denselben Dateinamen (zB den des Sets) verwenden

Was mir noch zusätzlich lästiges aufgefallen ist: ich nutze minify direkt, um SASS zu CSS zu kompilieren und die Ergebnisse mit dem Layout abzugleichen. Bei jedem Reload mit geänderter Datei wird eine neue CSS Datei mit neuem Namen erzeugt. Innerhalb einer Stunde waren das bei mir >300 Dateien.
Ich fände es hilfreich, wenn entweder die alte Version auch wieder gelöscht wird - oder noch besser: die Dateinamen, die schließlich im HTML eingefügt werden, wahlweise aus dem Setnamen resultieren.

tinify: Klasse für generiertes Bild einbauen.

Betrifft redaxo/redaxo#707 und wäre klasse, wenn minify dann von Haus aus Infos über das tinifizierte Bild geben könnte, solange redaxo das nicht kann.

Fehler beim speichern

In der Redaxo 5.2 Version liefert ein Klick eines neuen "Sets" die Error-Message "Fehler beim speichern". Reinstallation hat nichts gebracht. Der Fehler ist (auf meinen Systemen) reproduzierbar.

help.php entfernen, Inhalte in README.md übertragen

Problem mit Unterordner & doppelter Endung

Moin,
nutze das Addon mit Redaxo 5.6.4 im Unterordner.
https://www.domain.de/unterordner/startseite.html

Spuckt mir im Frontend folgendes aus:
<link rel="stylesheet" href="/resources/css/minify/bundled.css.css?time=1539870689" >

Müsste sein:
<link rel="stylesheet" href="/unterordner/resources/css/minify/bundled.css?time=1539870689" >

Addon Config:
Pfad für generierte CSS-Dateien: /resources/css/minify

Englische Übersetzungen unvollständig

Wunsch: Minifizierung von HTML

Sets direkt im Template per PHP definieren

Wäre toll, wenn man Sets direkt per PHP in einem Template definieren könnte, bzw. es eine Methode gäbte, um JS/CSS Dateien direkt zu kompilieren/komprimieren.

Grund: ich arbeite, was Templates, Module usw. betrifft, am liebsten direkt im Filesystem. Wenn ich eine CSS oder JS Datei einem Set hinzufügen oder entfernen möchte, kann ich das z.Z. nur über's Redaxo Backend.

Klasse von "Einstellungen speichern"-Button

Ist nur eine Kleinigkeit aber ich fände es gut wenn der Button zum Einstellungen speichern die Klasse "btn btn-save" hätte.

Volle Verzeichnisse minifizieren

Finde den Ansatz, extra im Backend im Addon selbst die Dateien zu definieren, sehr kompliziert, da ich beim entwickeln dann nicht einfach im editor bleiben kann, sondern ins Addon wechseln muss.
Fände eine Variante gut, bei der das Addon selbständig das komplette angegebene Verzeichnis nach CSS/SCSS Dateien abgrast und diese dann alle minified ausgibt. Dann ist diese Einstellung nur einmal zu machen und nicht jedes mal, wenn ich sauber eine neue SCSS Datei anlege / hinzufüge.

Könnte ja recht einfach aktiv werden, sobald am Ende kein .css oder .scss als Angabe steht, sondern ein /. Dann die im Verzeichnis gefundenen Dateien als Array abarbeiten.

Englische Übersetzung fehlt

%0D Am Ende jeder .js-Datei

Ich habe 2 JS-Sets. Setze ich beide innerhalb des head-tags ein, funktioniert alles wie gewünscht.
Wenn ich aber ein Set kurz vor setze, erhalten alle js-Urls ein %0D am Ende , wenn ich diese nicht minimiere.

Beispiel:

<script src="/assets/navi/slidebar/navi-collapse.js%0D

html minification vs inline js kommentar

habe ich nen javascript block mit einem einzeiligen kommentar via // ist die fee am arsch...
abgesehen davon scheints noch ne menge mehr dinge zu geben, die kaputtgehen können.

http://stackoverflow.com/questions/5312349/minifying-final-html-output-using-regular-expressions-with-codeigniter
https://gist.github.com/tovic/d7b310dea3b33e4732c0

debug-mode

eine möglichkeit, die original-CSS auszugeben

	echo $minify->minify($type = 'css', $set = "bla", $debug = true);

wäre fein.

help.php erstellen

Label korrigieren

Debug-Modus und HTML minifizieren haben die gleiche ID. Wenn man auf das 1. Label klickt, wird Checkbox 2 aktiviert / deaktiviert.