(schnellere) Funktion zum Zusammenfassen von CSS

04.08.2005, 11:47

Ich stelle diese Frage im Profi-Forum weil ich hoffe dass sie für Profis anspruchsvoll genug ist. Ich habe diese Frage auch schonmal anderswo gestellt, aber da das hier ein auf PHP spezialisertes Forum ist sind meine Chancen auf Antworten vermutlich besser

Gleich eines vorweg: Dier hier ist ein etwas längerer Beitrag.

--- (so, jetzt geht's los)

Ich arbeite schon seit längerem an einem PHP-CSS Parser und Optimierer, wer sich den mal angucken möchte kann das tun.

Nun möchte ich für die nächste Version einen Fehler beheben, dieser ist allerdings etwas komplizierter als er aussieht.

Wenn man dem Optimierer jetzt folgendes zum Verarbeiten gibt...

Code:

b {color:red;}
c,b {color:green;}
a {color:red;}

...macht er daraus folgendes:

Code:

c,b {
color:green
}

b,a {
color:red
}

Wie alle CSS-Kenner schnell feststellen werden, stimmt das so nicht. Was der Optimierer hier versucht, ist das Zusammenfassen von Selektoren die die gleichen Eigenschaften (Deklarationen) haben.

Richtig wäre es natürlich so:

Code:

b,c {color:green;}
a {color:red;}

Um dieses Problem zu umschiffen könnte man jetzt die Option zum Zusammenfassen von Eigenschaften einfach ausschalten. Das ist natürlich nicht Sinn der Sache.

Um das Problem also richtig zu beheben, müsste der Optimierer zuerst die Selektoren zerlegen und anschließend wieder richtig zusammenfassen. Das Zerlegen stellt kein Problem dar, wohl aber das Zusammenfassen.

Kleiner Hinweis für alle nicht CSS-Experten: Selektoren können mit

Code:

explode(',',$selectoren);

nicht zuverlässig zerlegt werden, da in Selektoren auch einfache Strings vorkommen können (z.B. in Zusammenhang mit Attributselektoren).

Um das CSS dann sinnvoll zusammenzufassen habe ich mir gedacht, dass zuersteinmal die Größe der Gemeinsamkeiten mehrerer Selektoren herausgefunden werden muss (um "intelligent" das zu optimieren was den größten "Gewinn" bringt) und welche Übereinstimmungen das genau sind.

Dafür habe ich auch schon eine Funktion geschrieben, die zwar fast perfekt funktioniert, allerdings schnell jegliche Zeit- und Speicherlimits überschreitet (abhängig von der Größe des CSS Codes). Was ich also jetzt ganz gerne hätte wäre ein Vorschlag wie man meine Funktion deutlich beschleunigt oder einen komplett neuen Ansatz von mir aus auch.

Jetzt erstmal die konkreten Informationen:

Struktur der Daten
Die Daten in denen das CSS gespeichert wird, sehen etwa so aus:

Code:

$css['standard']['a'][]['color'] = 'red';
$css['standard']['a'][]['size'] = '1em';
$css['standard']['b'][]['size'] = '1em';
// also $css[MEDIUM][SELEKTOR][ZAHL][EIGENSCHAFT] = WERT

ZAHL ist deswegen nötig, weil Eigenschaften auch mehrmals vorkommen dürfen sollen. Das ermöglicht das "beachten" einiger CSS-Hacks. Normalerweise würden die sich sonst einfach in Luft auflösen.

"standard" steht für keinen Medium-Typ.

Bisherhige Funktion
Das hier ist meine Funktion (das ultimative foreach-Chaos), hoffentlich gut genug kommentiert. Vorraussetzung ist, dass beim ersten Durchlauf keine Selektoren wie "a,b" oder "a,b#id,c" etc. vorhanden sind, bzw. diese zerlegt sind (dafür kann der Rest meines CSS Parsers garantieren).

Wer alles im Zusammenhang sehen möchte:
http://cdburnerxp.se/cssparse/css_parser.txt

Die Funktion ist da komplett drin, wer will kann den Parser damit mal durchlaufen lassen (in der Klasse die Funktion parse($string) [diese "Superoptimierung" wird automatisch mit ausgeführt], das Ergebnis als Array befindet sich danach in der Variable $css).

Hier jetzt die Funktion mit Kommentar:

Code:

function merge_selectors(&$css)
{
	$return = FALSE;

Das hier wird nacher auf TRUE gesetzt falls irgendetwas zusammengefasst wurde

Code:

	foreach($css as $medium => $vali)
	{
		$diff = array();
		$diff_c = array();

Zuerstmal geht die Funktion hier alle Medientypen (wem das nichts sagt, gucke hier: http://www.w3.org/TR/CSS21/media.html) durch und legt die Variablen $diff (Liste der Gemeinsamkeiten, $diff[Selektoren] => Größe der Gemeinsamkeit, wird aus der Zeichenlänge der gemeinsamen Eigenschaften und deren Werten bestimmt) und $diff_c an (speichert anstatt der Gemeinsamkeitsgröße die gemeinsamen Eigenschaften+Werte),

Code:

	
		foreach($vali as $selector => $valj)
		{

Anschließend geht sie alle Selektoren durch. Die Werte der Arrays werden immer in $val[Buchstable] gespeichert, je nach Verschachtelungstiefe.

Code:

			foreach($valj as $num_key => $valk)
			{
				foreach($valk as $property => $value)
				{

Danach folgen die Nummern der Eigenschaften und die Eigenschaften selbst.

Code:

					foreach($css[$medium] as $selector2 => $vall)
					{

Jetzt geht die Funktion innerhalb des gleichen Mediums die Selektoren durch (wieder von vorne anfangend), da wir ja alle Kombinationen durchlaufen müssen.

Code:

						$selector_combine_r = serialize(array($selector2,$selector));

So, jetzt wird's erstmal komisch. Da $diff bzw. $diff_c ja die Selektoren speichern, für die die Gemeinsamkeiten gelten kommen diese sinnvollerweise in den Schlüssel. Da es aber auch logischerweise zwei Selektoren sind, müssen diese so gespeichert werden, dass man sie nacher wieder mühelos trennen kann. Das wäre bei einem Array der Fall ( $dif[array('a','b')]). Das geht so natürlich nicht, also wird das array serialisiert. Damit überlasse ich PHP das Trennen der Selektoren und muss nicht irgendeine selbstgebaute Funktion die beiden Selektoren wieder trennen lassen (wir erinnern uns: mit explode() geht es nicht!).

Hier wird also die serialisierte Form der Selektoren 1 und 2 in umgekehrter Reichenfolge gespeichert, womit wir...

Code:

						
						// Prevent duplicate comparisions (a-b, b-a) and self-comparisons (a-a)
						if($selector2 === $selector || isset($diff[$selector_combine_r]))
						{
							continue;	
						}

...hier die Schleife überspringen falls wir für die gleichen Selektoren (nur in umgekehrter Reihenfolge) schon nach Übereinstimmungen gesucht haben. Außerdem überspringen wir alle Vergleiche eines Selektors mit sich selbst.

Code:

						
						$selector_combine = serialize(array($selector,$selector2));
						if(!isset($diff[$selector_combine]))
						{
							$diff[$selector_combine] = 0;
							$diff_[$selector_combine] = array();
						}

Hier legen wir jetzt, falls noch nicht vorhanden, die Speicherplätze für die Größe der Gemeinsamkeiten und für die Gemeinsamkeiten selbst an (und zwar mit einem Schlüssel, der die beiden Selektoren die wir grade vergleichen enthält).

Code:

										
						foreach($vall as $num_key2 => $valm)
						{
							foreach($valm as $property2 => $value2)
							{

Hier geht die Funktion jetzt auch durch die Eigenschaften des 2. (Vergleichs-)Selektors.

Code:

								if($property2 === $property && $value2 === $value)
								{
									$diff[$selector_combine] += (strlen($property)+strlen($value));
									$diff_c[$selector_combine][][$property] = $value; 
								}

Wenn Eigenschaft und Wert zwischen beiden Selektoren übereinstimmt, speichern wir die Zeichenlänge dieser (damit wir nacher wissen, wo die Übereinstimmungen am größten sind, diese müssen dann zuerst zusammengefasst werden) sowie Eigenschaft+Wert selbst ab.

Code:

							}
						}
						
						if($diff[$selector_combine] === 0)
						{
							unset($diff[$selector_combine]);
							unset($diff_c[$selector_combine]);
						}

Um den Speicherverbrauch wenigstens ansatzweise in den Griff zu bekommen, löschen wir hier den Eintrag der Selektoren in $diff und $diff_c wenn es keine Übereinstimmungen hab.

Code:

So, wo sind wir hier? Genau, am Ende eines Mediums (alle Selektoren die nicht in einem @media drin sind, sind in 'standard'). Das heißt jetzt, nachdem wir wissen was zusammengefasst werden kann, fangen wir an zusammenzufassen. Das nachfolgende wird also für jeden Mediumtyp ausgeführt.

Code:

		// Move best matches to the top
		array_multisort($diff,SORT_NUMERIC,SORT_DESC);

Wie der Kommentar schon sagt werden die größten Übereinstimmungen nach oben gesetzt damit möglichst "intelligent" optimiert wird.

Code:

	
		foreach($diff as $key => $value)
		{
			$key_u = unserialize($key);
			foreach($key_u as $selector)
			{
				// If there are no matches or if selector is already dissolved
				if(!isset($diff_c[$key]) || !isset($css[$medium][$selector]))
				{
					continue;
				}

Jetzt geht die Funktion die Variable $diff mit den Unterschieden durch. Dabei wird auch jeder Selektor einzeln behandelt, da wir andere Kombinationen mit diesem Selektor aus $diff entfernen müssen. Wenn wir nämlich einen Selektor mit einem anderen kombinieren, kann es ja sein, dass andere Kombinationen die vorher gefunden wurden gar nicht mehr möglich sind.

Code:

				
				foreach($diff_c[$key] as $num_key => $valj)
				{
					foreach($valj as $property => $value)
					{
						rm_subkey($property,$css[$medium][$selector],$value);
					}
				}

Hier löschen wir jetzt alle Eigenschaften eines Selektors, die in Kürze mit einem anderen Selektor zusammengefasst werden. Wenn a{color:red;} also mit b{color:red;} kombiniert wird, muss color:red; in beiden Selektoren gelöscht werden. rm_subkey ist selbstgebaut und funktioniert wie unset($css[$medium][$selector][?][$property]);.

Code:

				
				// If no properties are left, remove selector
				if(empty($css[$medium][$selector]))
				{
					unset($css[$medium][$selector]);
				}

Und wenn dann wie im obigen Beispiel gar keine Eigenschaften in einem Selektor mehr drin sind, dann wird er komplett gelöscht.

Code:

				
				// Create the new selector if matches are left
				if(!empty($diff_c[$key]))
				{
					$css[$medium][implode(',',$key_u)] = $diff_c[$key];
					$return = TRUE;
				}

Hier überprüft die Funktion nochmal ob dem Selektor überhaupt noch Eigenschaften die kombiniert werden können zur Verfügung stehen (und fügt dann den neuen Selektor ein. Zu beachten ist noch dass TRUE zurückgegeben wird falls eine Zusammenfassung möglich war), weil

Code:

			}
			
			// Go through diff_c and remove no-more-shareable properties
			// and possibly the complete entry
			foreach($diff_c as $keyi => $valuei)
			{
				$selectors = unserialize($keyi);
				if(in_array($key_u[0],$selectors) || in_array($key_u[1],$selectors))
				{
					unset($diff_c[$keyi]);
				}
			}

hier alles aus $diff_c gelöscht wird was zum Zusammenfassen nicht mehr zur Verfügung steht.

Code:

		}
	}
	return $return;
}

Hier noch der Rückgabewert. Wichtig für die praktische Anwendung der Funktion die so aussieht:

Code:

while(csspp::merge_selectors($this->css)) {}

Das heißt, dass diese ohnehin schon aufwändige Optimierung so lange ausgeführt wird, bis es nirgendwo mehr was zum zusammenfassen gibt. Falls es nämlich nicht schon aufgefallen sein sollte, es werden immer nur 2 Selektoren zusammengefasst, allerdings sollte das mit 3 oder mehr Selektoren ebenfalls möglich sein.

Das einzigste was die Funktion noch beachten müsste ist, dass ein gewisses Verhältnis zwischen Größe der optimierten Eigenschaften und Anzahl der Selektoren erhalten bleibt (damit nacher nicht sowas wie

Code:

ein,ganz,langer,langer,................................,selektor{size:1em;(und ganz wenig Eigenschaften)}

bei rauskommt. Aber das ist erstmal nebensächlich.

Jetzt zum Abschluss nochmal ein kleines Beispiel für die Funktionsweise der Funktion:

Das wird optimiert:

Code:

$css['standard']['a'][]['margin'] = '0';
$css['standard']['a'][]['color'] = 'red';
$css['standard']['a'][]['text'] = 'none';
$css['standard']['a'][]['text'] = '!important';

$css['standard']['b'][]['text'] = 'none';
$css['standard']['b'][]['color'] = 'red';

$css['standard']['d'][]['color'] = 'red';
$css['standard']['e'][]['margin'] = '2';

$diff sieht dann beim ersten Durchlauf so aus:

Code:

Array
(
    [a:2:{i:0;s:1:"a";i:1;s:1:"b";}] => 16
    [a:2:{i:0;s:1:"a";i:1;s:1:"d";}] => 8
    [a:2:{i:0;s:1:"b";i:1;s:1:"d";}] => 8
)

$diff_c so:

Code:

Array
(
    [a:2:{i:0;s:1:"a";i:1;s:1:"b";}] => Array
        (
            [0] => Array
                (
                    [color] => red
                )

            [1] => Array
                (
                    [text] => none
                )

        )

    [a:2:{i:0;s:1:"a";i:1;s:1:"d";}] => Array
        (
            [0] => Array
                (
                    [color] => red
                )

        )

    [a:2:{i:0;s:1:"b";i:1;s:1:"d";}] => Array
        (
            [0] => Array
                (
                    [color] => red
                )

        )

)

Das Ergebnis ist:

Code:

Array
(
    [standard] => Array
        (
            [a] => Array
                (
                    [0] => Array
                        (
                            [margin] => 0
                        )

                    [3] => Array
                        (
                            [text] => !important
                        )

                )

            [e] => Array
                (
                    [0] => Array
                        (
                            [margin] => 2
                        )

                )

            [a,b] => Array
                (
                    [1] => Array
                        (
                            [text] => none
                        )

                )

            [d,a,b] => Array
                (
                    [0] => Array
                        (
                            [color] => red
                        )

                )

        )

)

Letzte Anmerkung: Die Variable heißt hier $diff. Das ist nicht ganz logisch, weil ich eigentlich nicht nach Unterschieden (difference) sondern Gemeinsamkeiten (intersection) suche. Daran habe ich beim programmieren nicht gedacht, aber das dürfte erstmal keine große Rolle spielen.

Ich hoffe auf zahlreiche Vorschläge

Andreas · 04.08.2005, 16:14

Ich maße mir zwar nicht an, ein Profi zu sein, aber ich hätte vielleicht ein paar generelle Tipps, die helfen könnten, das ganze etwas übersichtlicher zu machen.

Generell finde ich das Konzept basierend auf multidimensionalen arrays ziemlich schlecht. Ich würde ein array machen, dass objekte enthält.

PHP-Code:

  <?php

class ccsobj {

    var $medium     = '';

    var $selector     = '';

    var $aCss     = array(); // für unterobjekte

    // var ...

    

    function cssobj() {

        

    }

}

 
$aCss = array();

 
// Jedes CSS-element

$oTemp = new cssobj();

$oTemp->medium = 'medium';

$oTemp->selector = 'selector';

 
//Wenn neuer selector

$aCss['selectorname'] = $oTemp;

 
// Wenn array_key_exists() selector

// Überschreibe die Daten

?>

Demnach hättest du am Schluss ein vollständiges Objekt, das den Aufbau der CSS-datei in der richtigen Reihenfolge komplett beinhaltet. Eigenschaften die Doppelt definiert sind (also nach der ersten Definition überschrieben werden), werden auch im Objekt überschrieben. Somit wäre Datenredundanz nicht vorhanden und du könntest die neue CSS-Datei aufbauen wie du willst. Du müsstest quasi nur ein objekt2string bauen, was dir dann den Objekttree mit eventuellen unterobjekten formatiert ausgibt.

Gruß
Andreas

04.08.2005, 16:51

Ja, an Objektorientierung dieser Art hatte ich auch schon gedacht (vielleicht mache ich das mal irgendwann), aber ich denke nicht dass das im Moment mein generelles Problem löst, dass der Vergleich aller vorhandenen Selektoren jede Menge Rechenzeit beansprucht. Ob ich da jetzt Arrays oder Objekte durchlaufe ist relativ egal.

Andreas · 05.08.2005, 08:21

Das ist nicht ganz richtig. Klar mit einem Array kann man fast alles machen, was man mit einem Objekt auch machen kann. Aber eben nur fast. In einem Objekt hast du Methoden, mit denen man das Verhalten steuern kann.

Das heißt, man kann die kompletten CSS-Daten mit allem drum und dran in einem einzigen Objekt mit mehreren Unterobjekten abbilden.
Und zwar ohne Redundanz. Das heißt:
Du befüllst, während du die Daten einliest, das Objekt. Sind Definitionen überflüssig oder werden CSS-Definitionen überschrieben, prüft eine Methode noch während dem Einlesen, ob diese CSS-Definitionen existieren und wenn ja, werden diese direkt auch im Objekt überschrieben/angepasst. Nach dem Einlesen sind die CSS-Daten komplett geordnet, ohne Doppelte oder Fehlerhafte Daten in einem Objekt. Das kann man alles mit Methoden filtern.

Jetzt hast du quasi alles in einem gemacht. Datei aufmachen, lesen, ordnen, filtern, Datei zumachen.

Das einzige was jetzt noch fehlt, ist dass du die Fertige Datei ausgibst.
Da das Objekt alles beinhaltet, musst du das eigentlich nur noch "imploden". Natürlich geht das nicht so einfach. Das ganze muss dann wieder mit Methoden zusammengefummelt werden. Da kannst du auch direkt steuern, wie es sein soll. Lesbar oder unlesbar.

05.08.2005, 11:41

Ich glaube du hast da etwas missverstanden. Ich habe keine Probleme mit dem Einlesen vom CSS, auch nicht mit eventuellen Fehlern die dabei entstehen könnten. Genaugenommen funktioniert mein Parser mit den Arrays so ziemlich perfekt (und bis zu dem Zeitpunkt wo ich den numerischen Index hinzugefügt habe waren Arrays eigentlich auch wie geschaffen dafür). Das Überschreiben und Anordnen wird alles schon von entsprechenden Funktionen durchgeführt. Einzig und allein das "Rekombinieren" der Selektoren macht mir Probleme, und ich sehe nicht, wie Objekte diesen Prozess (um ein vielfaches!) beschleunigen können.

MrNiceGuy · 05.08.2005, 17:34

Ich würde einfach mal sagen im Sinne von "Hubraum ist durch nichts zu ersetzen - Außer durch noch mehr Hubraum", dass du einen schnelleren Server brauchst *fg*

Nein, das sicher nicht, optimierung wäre da wahrscheinlich sinnvoller. Das einzige, was du dort jedoch wirklich optimieren könntest wäre meiner Meinung nach der Inhalt des Arrays. Sprich: Du musst das Array entschlacken, aber ob das überhaupt noch möglich ist!? Ich wage es mal zu bezweifeln, da du sicher keinen Datenverlust haben willst!?

Hast du schonmal ausprobiert, ob der Zend-Optimizer bei dir eine Beschleunigung des Scriptes erwirken kann?

05.08.2005, 19:29

Zitat:

Zitat von MrNiceGuy

Ich würde einfach mal sagen im Sinne von "Hubraum ist durch nichts zu ersetzen - Außer durch noch mehr Hubraum", dass du einen schnelleren Server brauchst *fg*

Nein, das wird mich nicht weiterbringen. Einen Server der schnell genug für sowas ist gibt es wahrscheinlich garnicht.

Zitat:

Nein, das sicher nicht, optimierung wäre da wahrscheinlich sinnvoller. Das einzige, was du dort jedoch wirklich optimieren könntest wäre meiner Meinung nach der Inhalt des Arrays. Sprich: Du musst das Array entschlacken, aber ob das überhaupt noch möglich ist!? Ich wage es mal zu bezweifeln, da du sicher keinen Datenverlust haben willst!?

Da gibt es eigentlich nichts zu entschlacken. CSS besteht nunmal aus Medientypen,Selektoren, Eigenschaften und Werten, weniger geht einfach nicht. Es hängt letztendlich vom Stylesheet ab wie viel Daten zu verarbeiten sind.

Zitat:

Hast du schonmal ausprobiert, ob der Zend-Optimizer bei dir eine Beschleunigung des Scriptes erwirken kann?

Keine Ahnung, mit dem Ding kenne ich mich nicht aus. Soweit ich weiß ist es auf unserem Server installiert aber ich weiß nicht ob das automatisch aktiviert ist. Ich glaube aber nicht dass das so viel bringt. Wenn man bedenkt dass eine Optimierung (von einem größeren Stylesheet) in jedem Fall mehr als eine Minute braucht, dann kann man sich ja in etwa ausmalen wie viel schneller das Skript werden müsste um im aktzeptablen Bereich zu liegen. Die einzigste Idee die ich bisher hatte wäre die Programmiersprache zu wechseln (C++ dürfte ein vielfaches schneller sein als PHP), aber 1. ist das viel Arbeit und 2. müsste ich C++ erst noch vernünftig lernen

MrNiceGuy · 06.08.2005, 01:20

Dass es da nichts zu entschlacken gibt war mir schon bewusst, das hatte ich ja auch geschrieben.

Zum Zend-Optimizer: Ich würde an deiner Stelle einfach mal in einem WAMP testen, wie schnell deine Funktionen ohne Optimizer sind und dann einmal MIT Optimizer. Installiert ist das Ding unter Windows schnell und einfach. Download ist hier: http://www.zend.com/store/products/zend-optimizer.php an der rechten Seite. Leider muss man sich registrieren, aber das lohnt sich für den Optimizer meiner Meinung nach schon.

Prüfen, ob es aktiv ist, kannst du mit der Ausgabe von phpinfo (); Dort müsste dann irgendwo stehen, dass ein Modul namens "Zend Optimizer" als Tabelle angezeigt werden (normalerweise direkt unter dem "PHP Core"). Dann ist er aktiv. Steht es nicht drin, dann ist er auch nicht aktiv. Ausprobieren würde ich es jedoch mal, um wirklich sicher zu gehen, ob und wenn ja wieviel es bringt.

C++ wäre sicher schneller, nur kannst du es dann wieder schlechter auf einer Homepage anbieten... Alternativ höchstens noch ein Java-Applet, dass dann den Client benutzt, um das umzuwandeln und gleichzeitig ne Statusanzeige rausrückt!? Oder: Probier einfach mal PHP über die Shell zu starten und ein StyleSheet berechnen zu lassen. Vielleicht bringt das durch den Wegfall des Apaches noch wieder etwas mehr Performance!?

06.08.2005, 11:01

Zitat:

Zitat von MrNiceGuy

Prüfen, ob es aktiv ist, kannst du mit der Ausgabe von phpinfo (); Dort müsste dann irgendwo stehen, dass ein Modul namens "Zend Optimizer" als Tabelle angezeigt werden (normalerweise direkt unter dem "PHP Core").

Steht nicht drin...wenn du mir jetzt noch sagst wie man es unter Linux aktiviert kann ich mal gucken was es bringt

Zitat:

C++ wäre sicher schneller, nur kannst du es dann wieder schlechter auf einer Homepage anbieten

Das geht schon. Da PHP auch die Kommandaozeile nutzen kann bastel ich dann irgendeinen Wrapper draum. Das Programm in C++ zu schreiben ist da definitiv der problematischere Teil

MrNiceGuy · 06.08.2005, 18:28

Das kannst du nur aktivieren, wenn du root-Rechte am Server hast und die Config des Webservers ändern kannst. Dann ist es auch recht einfach, da wie in Windows auch hier eine Installations-Routine vorliegt. Du gehst unter den besagten Link, lädst für die entsprechende Linux-Version die Datei auf deinen Server, entpackst sie und startest die Installationsdatei (ich meine es war eine install.sh). Der Rest geht fast von alleine. Ein paar Pfade überprüfen, ob diese richtig erkannt wurden, nach der Installation (falls angegeben "fehlerfrei installiert") den Webserver neu starten und dann sollte es laufen. Wenn du ein WAMP hast empfehle ich jedoch erstmal dort zu testen, ob es überhaupt was bringt an Geschwindigkeit. Messe die Zeit mit microtime () und vergleiche. Am besten startest du immer im Wechsel mit und ohne Zend 10 mal das Script mit den selben Daten und errechnest dann einen Mittelwert. Je öfter du dies machst, desto genauer wird dein Ergebnis letztendlich, auch wenn es immer nur ein Näherungswert bleibt.

Klar kannst du7 mit PHP auch nen C-Programm ansteuern, jedoch ist dann die Frage, wie sicher dein Script noch ist, wenn du z.B. exec () nutzt... *hust*

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
JS: Einführung - Javascript im Schichtenmodell	nikosch	Tutorials	4	11.04.2009 17:06
Rekursive Funktion bricht ab...	duras666	PHP Tipps 2008	9	28.04.2008 11:36
gpc_quotes funktion: verbesserungsvorschläge?	Promaetheus	PHP Tipps 2007	10	12.08.2007 19:29
variable in funktion	JanM	PHP Tipps 2006	2	23.07.2006 20:06
Komplexe Funktion: +Übersichtlichkeit, -Performance	Jacks Rache	PHP Tipps 2006	3	07.06.2006 14:22
Array in rekursiver Funktion auslesen	Gumfuzi	PHP Tipps 2007	17	15.11.2005 12:01
PHP-GTK Tutorial		Beitragsarchiv	9	02.11.2005 21:07
Rückgabewert einer rekrusiven Funktion		PHP-Fortgeschrittene	7	06.10.2005 18:44
In einer Funktion auf eine Funktion der Klasse zugreifen	phpbeginner	PHP Tipps 2005-2	2	28.07.2005 00:30
Funktion in einer Funktion aufrufen?		PHP Tipps 2005-2	11	14.06.2005 15:14
[Erledigt] Array-Übergabe in Funktion		PHP Tipps 2005	1	08.05.2005 21:05
[Erledigt] Variablen in eine Funktion übernehmen		PHP Tipps 2005	1	26.02.2005 17:19
[Erledigt] Wie kann ich beliebig viele Werte an eine Funktion übergeben		PHP Tipps 2005	11	25.01.2005 10:44
[Erledigt] sql syntax error in funktion, kann aber nix finden :(		PHP Tipps 2004	10	20.07.2004 19:19
Referenz auf Funktion übergeben		PHP-Fortgeschrittene	7	20.07.2004 09:51

04.08.2005, 11:47
Gast Beiträge: n/a	(schnellere) Funktion zum Zusammenfassen von CSS Ich stelle diese Frage im Profi-Forum weil ich hoffe dass sie für Profis anspruchsvoll genug ist. Ich habe diese Frage auch schonmal anderswo gestellt, aber da das hier ein auf PHP spezialisertes Forum ist sind meine Chancen auf Antworten vermutlich besser Gleich eines vorweg: Dier hier ist ein etwas längerer Beitrag. --- (so, jetzt geht's los) Ich arbeite schon seit längerem an einem PHP-CSS Parser und Optimierer, wer sich den mal angucken möchte kann das tun. Nun möchte ich für die nächste Version einen Fehler beheben, dieser ist allerdings etwas komplizierter als er aussieht. Wenn man dem Optimierer jetzt folgendes zum Verarbeiten gibt... Code: b {color:red;} c,b {color:green;} a {color:red;} ...macht er daraus folgendes: Code: c,b { color:green } b,a { color:red } Wie alle CSS-Kenner schnell feststellen werden, stimmt das so nicht. Was der Optimierer hier versucht, ist das Zusammenfassen von Selektoren die die gleichen Eigenschaften (Deklarationen) haben. Richtig wäre es natürlich so: Code: b,c {color:green;} a {color:red;} Um dieses Problem zu umschiffen könnte man jetzt die Option zum Zusammenfassen von Eigenschaften einfach ausschalten. Das ist natürlich nicht Sinn der Sache. Um das Problem also richtig zu beheben, müsste der Optimierer zuerst die Selektoren zerlegen und anschließend wieder richtig zusammenfassen. Das Zerlegen stellt kein Problem dar, wohl aber das Zusammenfassen. Kleiner Hinweis für alle nicht CSS-Experten: Selektoren können mit Code: explode(',',$selectoren); nicht zuverlässig zerlegt werden, da in Selektoren auch einfache Strings vorkommen können (z.B. in Zusammenhang mit Attributselektoren). Um das CSS dann sinnvoll zusammenzufassen habe ich mir gedacht, dass zuersteinmal die Größe der Gemeinsamkeiten mehrerer Selektoren herausgefunden werden muss (um "intelligent" das zu optimieren was den größten "Gewinn" bringt) und welche Übereinstimmungen das genau sind. Dafür habe ich auch schon eine Funktion geschrieben, die zwar fast perfekt funktioniert, allerdings schnell jegliche Zeit- und Speicherlimits überschreitet (abhängig von der Größe des CSS Codes). Was ich also jetzt ganz gerne hätte wäre ein Vorschlag wie man meine Funktion deutlich beschleunigt oder einen komplett neuen Ansatz von mir aus auch. Jetzt erstmal die konkreten Informationen: Struktur der Daten Die Daten in denen das CSS gespeichert wird, sehen etwa so aus: Code: $css['standard']['a'][]['color'] = 'red'; $css['standard']['a'][]['size'] = '1em'; $css['standard']['b'][]['size'] = '1em'; // also $css[MEDIUM][SELEKTOR][ZAHL][EIGENSCHAFT] = WERT ZAHL ist deswegen nötig, weil Eigenschaften auch mehrmals vorkommen dürfen sollen. Das ermöglicht das "beachten" einiger CSS-Hacks. Normalerweise würden die sich sonst einfach in Luft auflösen. "standard" steht für keinen Medium-Typ. Bisherhige Funktion Das hier ist meine Funktion (das ultimative foreach-Chaos), hoffentlich gut genug kommentiert. Vorraussetzung ist, dass beim ersten Durchlauf keine Selektoren wie "a,b" oder "a,b#id,c" etc. vorhanden sind, bzw. diese zerlegt sind (dafür kann der Rest meines CSS Parsers garantieren). Wer alles im Zusammenhang sehen möchte: http://cdburnerxp.se/cssparse/css_parser.txt Die Funktion ist da komplett drin, wer will kann den Parser damit mal durchlaufen lassen (in der Klasse die Funktion parse($string) [diese "Superoptimierung" wird automatisch mit ausgeführt], das Ergebnis als Array befindet sich danach in der Variable $css). Hier jetzt die Funktion mit Kommentar: Code: function merge_selectors(&$css) { $return = FALSE; Das hier wird nacher auf TRUE gesetzt falls irgendetwas zusammengefasst wurde Code: foreach($css as $medium => $vali) { $diff = array(); $diff_c = array(); Zuerstmal geht die Funktion hier alle Medientypen (wem das nichts sagt, gucke hier: http://www.w3.org/TR/CSS21/media.html) durch und legt die Variablen $diff (Liste der Gemeinsamkeiten, $diff[Selektoren] => Größe der Gemeinsamkeit, wird aus der Zeichenlänge der gemeinsamen Eigenschaften und deren Werten bestimmt) und $diff_c an (speichert anstatt der Gemeinsamkeitsgröße die gemeinsamen Eigenschaften+Werte), Code: foreach($vali as $selector => $valj) { Anschließend geht sie alle Selektoren durch. Die Werte der Arrays werden immer in $val[Buchstable] gespeichert, je nach Verschachtelungstiefe. Code: foreach($valj as $num_key => $valk) { foreach($valk as $property => $value) { Danach folgen die Nummern der Eigenschaften und die Eigenschaften selbst. Code: foreach($css[$medium] as $selector2 => $vall) { Jetzt geht die Funktion innerhalb des gleichen Mediums die Selektoren durch (wieder von vorne anfangend), da wir ja alle Kombinationen durchlaufen müssen. Code: $selector_combine_r = serialize(array($selector2,$selector)); So, jetzt wird's erstmal komisch. Da $diff bzw. $diff_c ja die Selektoren speichern, für die die Gemeinsamkeiten gelten kommen diese sinnvollerweise in den Schlüssel. Da es aber auch logischerweise zwei Selektoren sind, müssen diese so gespeichert werden, dass man sie nacher wieder mühelos trennen kann. Das wäre bei einem Array der Fall ( $dif[array('a','b')]). Das geht so natürlich nicht, also wird das array serialisiert. Damit überlasse ich PHP das Trennen der Selektoren und muss nicht irgendeine selbstgebaute Funktion die beiden Selektoren wieder trennen lassen (wir erinnern uns: mit explode() geht es nicht!). Hier wird also die serialisierte Form der Selektoren 1 und 2 in umgekehrter Reichenfolge gespeichert, womit wir... Code: // Prevent duplicate comparisions (a-b, b-a) and self-comparisons (a-a) if($selector2 === $selector \|\| isset($diff[$selector_combine_r])) { continue; } ...hier die Schleife überspringen falls wir für die gleichen Selektoren (nur in umgekehrter Reihenfolge) schon nach Übereinstimmungen gesucht haben. Außerdem überspringen wir alle Vergleiche eines Selektors mit sich selbst. Code: $selector_combine = serialize(array($selector,$selector2)); if(!isset($diff[$selector_combine])) { $diff[$selector_combine] = 0; $diff_[$selector_combine] = array(); } Hier legen wir jetzt, falls noch nicht vorhanden, die Speicherplätze für die Größe der Gemeinsamkeiten und für die Gemeinsamkeiten selbst an (und zwar mit einem Schlüssel, der die beiden Selektoren die wir grade vergleichen enthält). Code: foreach($vall as $num_key2 => $valm) { foreach($valm as $property2 => $value2) { Hier geht die Funktion jetzt auch durch die Eigenschaften des 2. (Vergleichs-)Selektors. Code: if($property2 === $property && $value2 === $value) { $diff[$selector_combine] += (strlen($property)+strlen($value)); $diff_c[$selector_combine][][$property] = $value; } Wenn Eigenschaft und Wert zwischen beiden Selektoren übereinstimmt, speichern wir die Zeichenlänge dieser (damit wir nacher wissen, wo die Übereinstimmungen am größten sind, diese müssen dann zuerst zusammengefasst werden) sowie Eigenschaft+Wert selbst ab. Code: } } if($diff[$selector_combine] === 0) { unset($diff[$selector_combine]); unset($diff_c[$selector_combine]); } Um den Speicherverbrauch wenigstens ansatzweise in den Griff zu bekommen, löschen wir hier den Eintrag der Selektoren in $diff und $diff_c wenn es keine Übereinstimmungen hab. Code: } } } } So, wo sind wir hier? Genau, am Ende eines Mediums (alle Selektoren die nicht in einem @media drin sind, sind in 'standard'). Das heißt jetzt, nachdem wir wissen was zusammengefasst werden kann, fangen wir an zusammenzufassen. Das nachfolgende wird also für jeden Mediumtyp ausgeführt. Code: // Move best matches to the top array_multisort($diff,SORT_NUMERIC,SORT_DESC); Wie der Kommentar schon sagt werden die größten Übereinstimmungen nach oben gesetzt damit möglichst "intelligent" optimiert wird. Code: foreach($diff as $key => $value) { $key_u = unserialize($key); foreach($key_u as $selector) { // If there are no matches or if selector is already dissolved if(!isset($diff_c[$key]) \|\| !isset($css[$medium][$selector])) { continue; } Jetzt geht die Funktion die Variable $diff mit den Unterschieden durch. Dabei wird auch jeder Selektor einzeln behandelt, da wir andere Kombinationen mit diesem Selektor aus $diff entfernen müssen. Wenn wir nämlich einen Selektor mit einem anderen kombinieren, kann es ja sein, dass andere Kombinationen die vorher gefunden wurden gar nicht mehr möglich sind. Code: foreach($diff_c[$key] as $num_key => $valj) { foreach($valj as $property => $value) { rm_subkey($property,$css[$medium][$selector],$value); } } Hier löschen wir jetzt alle Eigenschaften eines Selektors, die in Kürze mit einem anderen Selektor zusammengefasst werden. Wenn a{color:red;} also mit b{color:red;} kombiniert wird, muss color:red; in beiden Selektoren gelöscht werden. rm_subkey ist selbstgebaut und funktioniert wie unset($css[$medium][$selector][?][$property]);. Code: // If no properties are left, remove selector if(empty($css[$medium][$selector])) { unset($css[$medium][$selector]); } Und wenn dann wie im obigen Beispiel gar keine Eigenschaften in einem Selektor mehr drin sind, dann wird er komplett gelöscht. Code: // Create the new selector if matches are left if(!empty($diff_c[$key])) { $css[$medium][implode(',',$key_u)] = $diff_c[$key]; $return = TRUE; } Hier überprüft die Funktion nochmal ob dem Selektor überhaupt noch Eigenschaften die kombiniert werden können zur Verfügung stehen (und fügt dann den neuen Selektor ein. Zu beachten ist noch dass TRUE zurückgegeben wird falls eine Zusammenfassung möglich war), weil Code: } // Go through diff_c and remove no-more-shareable properties // and possibly the complete entry foreach($diff_c as $keyi => $valuei) { $selectors = unserialize($keyi); if(in_array($key_u[0],$selectors) \|\| in_array($key_u[1],$selectors)) { unset($diff_c[$keyi]); } } hier alles aus $diff_c gelöscht wird was zum Zusammenfassen nicht mehr zur Verfügung steht. Code: } } return $return; } Hier noch der Rückgabewert. Wichtig für die praktische Anwendung der Funktion die so aussieht: Code: while(csspp::merge_selectors($this->css)) {} Das heißt, dass diese ohnehin schon aufwändige Optimierung so lange ausgeführt wird, bis es nirgendwo mehr was zum zusammenfassen gibt. Falls es nämlich nicht schon aufgefallen sein sollte, es werden immer nur 2 Selektoren zusammengefasst, allerdings sollte das mit 3 oder mehr Selektoren ebenfalls möglich sein. Das einzigste was die Funktion noch beachten müsste ist, dass ein gewisses Verhältnis zwischen Größe der optimierten Eigenschaften und Anzahl der Selektoren erhalten bleibt (damit nacher nicht sowas wie Code: ein,ganz,langer,langer,................................,selektor{size:1em;(und ganz wenig Eigenschaften)} bei rauskommt. Aber das ist erstmal nebensächlich. Jetzt zum Abschluss nochmal ein kleines Beispiel für die Funktionsweise der Funktion: Das wird optimiert: Code: $css['standard']['a'][]['margin'] = '0'; $css['standard']['a'][]['color'] = 'red'; $css['standard']['a'][]['text'] = 'none'; $css['standard']['a'][]['text'] = '!important'; $css['standard']['b'][]['text'] = 'none'; $css['standard']['b'][]['color'] = 'red'; $css['standard']['d'][]['color'] = 'red'; $css['standard']['e'][]['margin'] = '2'; $diff sieht dann beim ersten Durchlauf so aus: Code: Array ( [a:2:{i:0;s:1:"a";i:1;s:1:"b";}] => 16 [a:2:{i:0;s:1:"a";i:1;s:1:"d";}] => 8 [a:2:{i:0;s:1:"b";i:1;s:1:"d";}] => 8 ) $diff_c so: Code: Array ( [a:2:{i:0;s:1:"a";i:1;s:1:"b";}] => Array ( [0] => Array ( [color] => red ) [1] => Array ( [text] => none ) ) [a:2:{i:0;s:1:"a";i:1;s:1:"d";}] => Array ( [0] => Array ( [color] => red ) ) [a:2:{i:0;s:1:"b";i:1;s:1:"d";}] => Array ( [0] => Array ( [color] => red ) ) ) Das Ergebnis ist: Code: Array ( [standard] => Array ( [a] => Array ( [0] => Array ( [margin] => 0 ) [3] => Array ( [text] => !important ) ) [e] => Array ( [0] => Array ( [margin] => 2 ) ) [a,b] => Array ( [1] => Array ( [text] => none ) ) [d,a,b] => Array ( [0] => Array ( [color] => red ) ) ) ) Letzte Anmerkung: Die Variable heißt hier $diff. Das ist nicht ganz logisch, weil ich eigentlich nicht nach Unterschieden (difference) sondern Gemeinsamkeiten (intersection) suche. Daran habe ich beim programmieren nicht gedacht, aber das dürfte erstmal keine große Rolle spielen. Ich hoffe auf zahlreiche Vorschläge


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

04.08.2005, 16:14
Andreas Erfahrener Benutzer Registriert seit: 22.04.2005 Beiträge: 392	Ich maße mir zwar nicht an, ein Profi zu sein, aber ich hätte vielleicht ein paar generelle Tipps, die helfen könnten, das ganze etwas übersichtlicher zu machen. Generell finde ich das Konzept basierend auf multidimensionalen arrays ziemlich schlecht. Ich würde ein array machen, dass objekte enthält. PHP-Code: <?php class ccsobj { var $medium = ''; var $selector = ''; var $aCss = array(); // für unterobjekte // var ... function cssobj() { } } $aCss = array(); // Jedes CSS-element $oTemp = new cssobj(); $oTemp->medium = 'medium'; $oTemp->selector = 'selector'; //Wenn neuer selector $aCss['selectorname'] = $oTemp; // Wenn array_key_exists() selector // Überschreibe die Daten ?> Demnach hättest du am Schluss ein vollständiges Objekt, das den Aufbau der CSS-datei in der richtigen Reihenfolge komplett beinhaltet. Eigenschaften die Doppelt definiert sind (also nach der ersten Definition überschrieben werden), werden auch im Objekt überschrieben. Somit wäre Datenredundanz nicht vorhanden und du könntest die neue CSS-Datei aufbauen wie du willst. Du müsstest quasi nur ein objekt2string bauen, was dir dann den Objekttree mit eventuellen unterobjekten formatiert ausgibt. Gruß Andreas

04.08.2005, 16:51
Gast Beiträge: n/a	Ja, an Objektorientierung dieser Art hatte ich auch schon gedacht (vielleicht mache ich das mal irgendwann), aber ich denke nicht dass das im Moment mein generelles Problem löst, dass der Vergleich aller vorhandenen Selektoren jede Menge Rechenzeit beansprucht. Ob ich da jetzt Arrays oder Objekte durchlaufe ist relativ egal.

05.08.2005, 08:21
Andreas Erfahrener Benutzer Registriert seit: 22.04.2005 Beiträge: 392	Das ist nicht ganz richtig. Klar mit einem Array kann man fast alles machen, was man mit einem Objekt auch machen kann. Aber eben nur fast. In einem Objekt hast du Methoden, mit denen man das Verhalten steuern kann. Das heißt, man kann die kompletten CSS-Daten mit allem drum und dran in einem einzigen Objekt mit mehreren Unterobjekten abbilden. Und zwar ohne Redundanz. Das heißt: Du befüllst, während du die Daten einliest, das Objekt. Sind Definitionen überflüssig oder werden CSS-Definitionen überschrieben, prüft eine Methode noch während dem Einlesen, ob diese CSS-Definitionen existieren und wenn ja, werden diese direkt auch im Objekt überschrieben/angepasst. Nach dem Einlesen sind die CSS-Daten komplett geordnet, ohne Doppelte oder Fehlerhafte Daten in einem Objekt. Das kann man alles mit Methoden filtern. Jetzt hast du quasi alles in einem gemacht. Datei aufmachen, lesen, ordnen, filtern, Datei zumachen. Das einzige was jetzt noch fehlt, ist dass du die Fertige Datei ausgibst. Da das Objekt alles beinhaltet, musst du das eigentlich nur noch "imploden". Natürlich geht das nicht so einfach. Das ganze muss dann wieder mit Methoden zusammengefummelt werden. Da kannst du auch direkt steuern, wie es sein soll. Lesbar oder unlesbar.

05.08.2005, 11:41
Gast Beiträge: n/a	Ich glaube du hast da etwas missverstanden. Ich habe keine Probleme mit dem Einlesen vom CSS, auch nicht mit eventuellen Fehlern die dabei entstehen könnten. Genaugenommen funktioniert mein Parser mit den Arrays so ziemlich perfekt (und bis zu dem Zeitpunkt wo ich den numerischen Index hinzugefügt habe waren Arrays eigentlich auch wie geschaffen dafür). Das Überschreiben und Anordnen wird alles schon von entsprechenden Funktionen durchgeführt. Einzig und allein das "Rekombinieren" der Selektoren macht mir Probleme, und ich sehe nicht, wie Objekte diesen Prozess (um ein vielfaches!) beschleunigen können.

05.08.2005, 17:34
MrNiceGuy Erfahrener Benutzer Registriert seit: 21.05.2008 Beiträge: 387	Ich würde einfach mal sagen im Sinne von "Hubraum ist durch nichts zu ersetzen - Außer durch noch mehr Hubraum", dass du einen schnelleren Server brauchst fg Nein, das sicher nicht, optimierung wäre da wahrscheinlich sinnvoller. Das einzige, was du dort jedoch wirklich optimieren könntest wäre meiner Meinung nach der Inhalt des Arrays. Sprich: Du musst das Array entschlacken, aber ob das überhaupt noch möglich ist!? Ich wage es mal zu bezweifeln, da du sicher keinen Datenverlust haben willst!? Hast du schonmal ausprobiert, ob der Zend-Optimizer bei dir eine Beschleunigung des Scriptes erwirken kann?

06.08.2005, 01:20
MrNiceGuy Erfahrener Benutzer Registriert seit: 21.05.2008 Beiträge: 387	Dass es da nichts zu entschlacken gibt war mir schon bewusst, das hatte ich ja auch geschrieben. Zum Zend-Optimizer: Ich würde an deiner Stelle einfach mal in einem WAMP testen, wie schnell deine Funktionen ohne Optimizer sind und dann einmal MIT Optimizer. Installiert ist das Ding unter Windows schnell und einfach. Download ist hier: http://www.zend.com/store/products/zend-optimizer.php an der rechten Seite. Leider muss man sich registrieren, aber das lohnt sich für den Optimizer meiner Meinung nach schon. Prüfen, ob es aktiv ist, kannst du mit der Ausgabe von phpinfo (); Dort müsste dann irgendwo stehen, dass ein Modul namens "Zend Optimizer" als Tabelle angezeigt werden (normalerweise direkt unter dem "PHP Core"). Dann ist er aktiv. Steht es nicht drin, dann ist er auch nicht aktiv. Ausprobieren würde ich es jedoch mal, um wirklich sicher zu gehen, ob und wenn ja wieviel es bringt. C++ wäre sicher schneller, nur kannst du es dann wieder schlechter auf einer Homepage anbieten... Alternativ höchstens noch ein Java-Applet, dass dann den Client benutzt, um das umzuwandeln und gleichzeitig ne Statusanzeige rausrückt!? Oder: Probier einfach mal PHP über die Shell zu starten und ein StyleSheet berechnen zu lassen. Vielleicht bringt das durch den Wegfall des Apaches noch wieder etwas mehr Performance!?

06.08.2005, 18:28
MrNiceGuy Erfahrener Benutzer Registriert seit: 21.05.2008 Beiträge: 387	Das kannst du nur aktivieren, wenn du root-Rechte am Server hast und die Config des Webservers ändern kannst. Dann ist es auch recht einfach, da wie in Windows auch hier eine Installations-Routine vorliegt. Du gehst unter den besagten Link, lädst für die entsprechende Linux-Version die Datei auf deinen Server, entpackst sie und startest die Installationsdatei (ich meine es war eine install.sh). Der Rest geht fast von alleine. Ein paar Pfade überprüfen, ob diese richtig erkannt wurden, nach der Installation (falls angegeben "fehlerfrei installiert") den Webserver neu starten und dann sollte es laufen. Wenn du ein WAMP hast empfehle ich jedoch erstmal dort zu testen, ob es überhaupt was bringt an Geschwindigkeit. Messe die Zeit mit microtime () und vergleiche. Am besten startest du immer im Wechsel mit und ohne Zend 10 mal das Script mit den selben Daten und errechnest dann einen Mittelwert. Je öfter du dies machst, desto genauer wird dein Ergebnis letztendlich, auch wenn es immer nur ein Näherungswert bleibt. Klar kannst du7 mit PHP auch nen C-Programm ansteuern, jedoch ist dann die Frage, wie sicher dein Script noch ist, wenn du z.B. exec () nutzt... hust