ReLast - Klassik


Asset-Pipeline


Die Idee

Wie wir in DCSS und in DJS festgestellt haben ist es ohne weiteres möglich Server-seitig mit PHP gültiges CSS und JavaScript zu erzeugen und als solches auszuliefern. Warum nicht auch automatisch mehrere Dateien zusammen fassen, vorzugsweise ganze Verzeichnisse?

Asset-Funktionen

In der Datei "asset.php" notieren wir:

<?php
function asset($dir, $pattern) {
	$files = glob($dir.DIRECTORY_SEPARATOR.$pattern);
	if ($handle = opendir($dir)) {
		while (false !== ($entry = readdir($handle))) {
			if ($entry != "." && $entry != "..") {
				if (is_dir($dir.DIRECTORY_SEPARATOR.$entry)) {
					$files = array_merge($files, asset($dir.DIRECTORY_SEPARATOR.$entry, $pattern));
				} 
			}
		}
		closedir($handle);
	}
	return $files;
}
function assetCSS($css_base_folder) {
	return asset($css_base_folder,'*.css*');
}
function assetJS($js_base_folder) {
	return asset($js_base_folder,'*.js*');
}
?>

Dank dieser Funktion sind wir in der Lage ein beliebiges Verzeichnis zu definieren, wobei innerhalb dieses Verzeichnisses in beliebigen Unterverzeichnissen eine beliebige Menge an Dateien liegen kann. Diese Dateien müssen ein ".css" oder ".js" im Namen haben, dürfen also beispielsweise auf ".css"/".css.php" oder auf ".js.php"/".js.php" enden.

Einbinden

In der Datei "asset.css.php" notieren wir:

<?php
include "asset.php";
$files = assetCSS('stylesheetverzeichnis');
header('Content-type: text/css');
foreach ($files as $file) {
  include $file; 
}
?>

In der Datei "asset.js.php" notieren wir:

<?php
include "asset.php";
$files = assetJS('javascriptverzeichnis');
header('Content-type: text/js');
foreach ($files as $file) {
  include $file; 
}
?>

Fertig

Die Dateien "asset.css.php" und "asset.js.php" können wir an beliebiger Stelle in unserem Projekt referenzieren:

<link href="asset.css.php" rel="stylesheet">
<script src="asset.js.php"></script>

Vorteil

Dank der Selektoren ".css"/".css.php" oder ".js.php"/".js.php" können wir sowohl reguläre CSS- / JS-Dateien als auch DCSS- / DJS-Dateien im Projekt verwenden. Wie viele Dateien existieren und in welcher Form diese strukturiert sind interessiert dabei nicht. Die Entwickler im Stylesheet- und JavaScript-Team können vollkommen unabhängig arbeiten und ihre Arbeit innerhalb von "stylesheetverzeichnis" und "javascriptverzeichnis" ablegen. Es ist ebenso möglich die Assets Server-übergreifend einzusetzen, da die Dateien referenzierbar sind.

Damit haben wir eine einfache Form einer Asset-Pipeline, zentral abgelegt, Projekt-Übergreifend verwendbar, erweitert um den Vorteil von dynamischem CSS / JS.


Copyright © 2024

Datenschutz | Impressum