Optimisation : page en cache et css/js minifié/concaténé/compressé

Yannou90 · mars 2013

Bonjours à tous

Je suis "hébergé" :rolleyes: chez free.fr avec pluxml en version 5.1.6 , theme theme-piano-black2
Je souhaite , de façon ludique , optimiser mon blog au maximum .
Pour celà j'ai pas mal modifier le theme que j'utilise et passe maintenant la validation xhtml strict 1.0 , css3 ...

Les débits chez free sont catastrophiques et completement alléatoire , je ne parle pas du ftp qui est encore pire !

Apres quelques recherche , j'ai trouvé des piste pour optimiser le site sans droit d'administration !

Tout d'abord , forcer la mise en cache des page :

Éditez le fichier header.php de votre theme et sous la ligne:

<?php if(!defined('PLX_ROOT')) exit; ?>

Ajouter :

<?php
$lastModified=filemtime(__FILE__);
$etagFile = md5_file(__FILE__);
$etag = dechex(fileinode(__FILE__));
$etag.= "-".dechex(filesize(__FILE__));
$etag.= "-".dechex(((filemtime(__FILE__).str_repeat("0",6)+0) & (8589934591)));
$ifModifiedSince=(isset($_SERVER['HTTP_IF_MODIFIED_SINCE']) ? $_SERVER['HTTP_IF_MODIFIED_SINCE'] : false);
$etagHeader=(isset($_SERVER['HTTP_IF_NONE_MATCH']) ? trim($_SERVER['HTTP_IF_NONE_MATCH']) : false);
header("Last-Modified: ".gmdate("D, d M Y H:i:s", $lastModified)." GMT");
header("Etag: W/\"$etag\"");
header('Cache-Control: public');
header("Vary: Accept-Encoding");
if (@strtotime($_SERVER['HTTP_IF_MODIFIED_SINCE'])==$lastModified || $etagHeader == $etagFile)
{
       header("HTTP/1.1 304 Not Modified");
       exit;
}
?>

Les pages apparraissent alors comme étant statique , la mise en cache est alors mis en oeuvre !
Réponse du serveur lors du chargement d'une page :

    HTTP/1.1 200 OK
    Date: Sun, 17 Mar 2013 13:10:17 GMT
    Server: Apache/ProXad [Apr 20 2012 15:06:05]
    Cache-Control: public
    Content-Encoding: gzip
    Etag: W/"6a238bd-1736-3a258ac0"
    Expires: Thu, 19 Nov 1981 08:52:00 GMT
    Pragma: no-cache
    Vary: Accept-Encoding
    X-Powered-By: PHP/5.1.3RC4-dev
    Set-Cookie: PHPSESSID=d59cb54b7f91f1e0a64d8317e923919f; path=/
    Last-Modified: Sun, 17 Mar 2013 12:44:03 GMT
    Connection: close
    Content-Type: text/html; charset=UTF-8

Et un joli 304 lors du rechargement

Je ne suis pas l'auteur de ce bout de code , je l'ai remanié à partir de différents articles parsemé sur le net .

La c'est bon , le cache fonctionne parfaitement pour moi , testé avec redbot et confirmé avec firebug et Yslow .

Pour Yslow j'ai un score entre 75 et 80 , c'est pas trop mal .

Le top serait de pouvoir minifier/concaténer/compresser les css et js.

Beaucoup d'outils existe , je pourrais également modifier mon header.php et manuellement effectuer les changements.
Mais avec le systeme de plugin ce n'est pas possible !

J'ai découvert php_speedy qui permet de modifier à la volé le contenu des pages . Ce script minifi/concatene et compresse tout css et js présent sur une page limitant ainsi le nombre de requete et le poid des fichier .
Çà fonctionne du feu de dieu sur des script php , mais avec pluxml je patauge .

Je m'explique :
-téléchargement de la derniere version du script : php_speedy_wp_0.5.2.zip
-décompression et reccupération du dossier php_speedy présent dans php_speedy_wp/libs/php_speedy
-suppression des fichier install.php et index.php ( utile uniquement pour une configuration graphique)
-édition de config.php :

<?php
#########################################
## Compressor option file ##############
#########################################
## Access control
$compress_options['username'] = "";
$compress_options['password'] = "";
## Path info
$compress_options['javascript_cachedir'] = "/var/www/pluxml/Dev.Yannou90/php_speedy/cache";
$compress_options['css_cachedir'] = "/var/www/pluxml/Dev.Yannou90/php_speedy/cache";
## Comma separated list of JS Libraries to include
$compress_options['js_libraries'] = "";
## Ignore list
$compress_options['ignore_list'] = "";
## Minify options
$compress_options['minify']['javascript'] = "1";
$compress_options['minify']['page'] = "1";
$compress_options['minify']['css'] = "1";
## Gzip options
$compress_options['gzip']['javascript'] = "1";
$compress_options['gzip']['page'] = "1";
$compress_options['gzip']['css'] = "1";
## Versioning
$compress_options['far_future_expires']['javascript'] = "1";
$compress_options['far_future_expires']['css'] = "1";
## On or off 
$compress_options['active'] = "1";
## Display a link back to PHP Speedy
$compress_options['footer']['text'] = "0";
$compress_options['footer']['image'] = "0";
## Should Speedy Clean Up the cache directory?
$compress_options['cleanup']['on'] = "0";
## Should Speedy use data URIs for background images?
$compress_options['data_uris']['on'] = "0";
#########################################
?>

-test du fichier test inclu OK

Maintenant pour l'utiliser il suffit d'ajouter 2 ligne de code : une au dessus du header et l'autre au dessous du footer , pour moi :

<?php
if(empty($_GET['compress']) || $_GET['compress'] != "no") {
require(/var/www/pluxml/Dev.Yannou90/php_speedy/'');
}
?>
< ... header ...
......................
... footer ...>
<?php
if(empty($_GET['compress']) || $_GET['compress'] != "no") {
$compressor->finish();
}
?>

Sur des fichier "custom" cela fonctionne tres bien mais avec pluxml ce n'est pas possible !
Si j'ajoute :

<?php
if(empty($_GET['compress']) || $_GET['compress'] != "no") {
require(/var/www/pluxml/Dev.Yannou90/php_speedy/'');
}
?>

A mon header.php , et :

<?php
if(empty($_GET['compress']) || $_GET['compress'] != "no") {
require(/var/www/pluxml/Dev.Yannou90/php_speedy/'');
}
?>

Au footer cela ne fonctionne pas :

PHP Fatal error:  Cannot redeclare loadLang()

En éditant index.php :

PHP Fatal error:  Call to a member function finish() on a non-object

Au choix , les deux abbotissant à une erreur 500
Ou pourrais-je bien placer ces bouts de codes ??

Jerry Wham · mars 2013

Essaie en créant un plugin et en utilisant les hook du fichier index.php. Il y a une bufferisation qui est effectuée.

Yannou90 · mars 2013

C'est le but : faire un plugin !

J'ai parcouru en long en large et en travers le fichier index.php , j'ai bien remarqué la bufferisation avec ob_start() , la reccuperation avec $output = ob_get_clean() , les inclusions des plugins et le traitement sur $output

Le soucis et que avant de faire un plugin , il faudrait peut-etre que je sache quel outil je dois employé ??

Je suis sur le coup ...

bankai · mars 2013

Il ne faut pas non plus sur - optimiser ton site, moi pour le miens j'utilise juste mon HTaccess, et quelques outils pour minifier mon css et mes script Js que tu pourras trouver ici.
- The Tool Box
- Minify Css
Et le plus important les images PNG et JPEG :
- Jpegmini
- PngOptimzer

J'arrive à une note de 94 avec page speed, je ne suis pas trop fan des script direct dans le code.

Yannou90 · mars 2013

Bonjour bankai

Ce n'est pas vraiment de la sur-optimisation , mais plutôt une façon d'apprendre à optimiser .

Je suis pro open source et fan de *nix , j'ai un serveur perso chez moi que je sais "optimiser" , mais en tand qu'administrateur .

Je remercie free pour leur sites perso , celà me permet d'avoir sans trop de soucis un site dédié à un blog spécifique .Chez free toucher au htaccess et un peu difficile , les versions d'apache et de php ne sont pas du tout "normal" : ou rien ne se passe sans erreur ou tout plante !

Je suis autodidacte , et souhaite apprendre .Mon langage de predilection est le shell scripting ( bash ) avec lequel je fais ce que je veux et plus encore mais le php je ne m'y suis pas encore mis !
J'ai optimisé mon blog avec des outils tel que minify et autre , j'ai trouvé çà tres interressant et souhaitais faire un petit plugin pour "automatiser" tout çà .

Le truc ici c'est que ces outils "obligent" l'utilisateur à manuellement modifier le code de leur theme .
Pas tres grave en soit ni bien difficile , mais avec pluxml , l'activation de certains plugins injecte des lignes dans le code source de la page , et là il n'est pas possible d'utiliser ces outils , à moin de modifier les fichiers injecter !

Tout ceci pour arrivé à php_speedy . Des plugins existent pour Joomla , Drupal et Wordpress , et pourquoi pas Pluxml ?!

Franchement je serais content d'avoir un 100% avec Yslow mais dans le fond je m'en ...J'ai une note de 74 , constate ce qu'il faudrait pour optimiser çà et souhaite le mettre en place .

Pour revenir à pluxml , ce n'est pas tres intelligent de ma part de modifier le finchier "index.php" , mais vu le fonctionnement de pluxml , je ne vois pas comment je pourrais ajouter deux lignes de code sur une page formatée .
Je souhaite deja faire fonctionner le script sur pluxml , puis essayer de le permettre au plus grands nombre . Pour le coup c'est raté !

Apparement , pour ce fichier :

-on demarre la bufferisation
-on charge le theme
-créé la reponse du serveur ( header (..)) dans l'entête
-on injecte les plugins avant "</head>" et </body>
-on applique l'urlrewriting
-on compresse si besoin
-on arrete et affiche le resultat

Si je souhaite executer php_speedy je dois le faire une fois que la page est formaté donc sur "$output" , je dois donc travailler pour ajouter les lignes de code php sur $output et reinterpreter la page , donc travailler avec :
-ob_start(); pour ne pas afficher la page tand que la page n'est pas reformatée
-ob_get_clean() por reccupérer cet affichage et travailer dessus

Çà serait plus simple pour moi en bash

, mais je trouverais ...

Yannou90 · mars 2013

Bon :rolleyes: j'en suis à çà :

###############################################
ob_start();
echo "<?php require('/var/www/pluxml/Dev.Yannou90/php_speedy/php_speedy.php'); ?>";
$output = str_replace('<!DOCTYPE', ob_get_clean().'<!DOCTYPE', $output);
ob_start();
echo "<?php \$compressor->finish(); ?>";
$output = str_replace('</html>', '</html>'. ob_get_clean(), $output);
###############################################

La page est correctement formatée mais si j'ajoute :

$output = eval("?>$output<?php ");

Je me re-mange la même erreur :

Cannot redeclare loadLang() (previously declared in /media/nunux/Documents/Dev.Yannou90/config.php:49) in /media/nunux/Documents/Dev.Yannou90/config.php on line 57

Ce qui me fait penser que ce bout de code est inutile puisqu'il aboutit a la même chose !!
Et ce que je ne comprends vraiment pas c'est pourquoi j'ai cette erreur sur la sortie de ce script puisque la page index.php fini sur exit ??

Yannou90 · mars 2013

Pfffffffffff , des fois on se prend la tête alors que c'est tellement simple : cela fonctionne bien !

L'astuce est que le fichier /var/www/pluxml/Dev.Yannou90/php_speedy/php_speedy.php require lui aussi d'autres fichiers , lignes 55 à 60 :

require("controller/compressor.php");
require("libs/php/view.php"); //Include this for path getting help
require("libs/php/user_agent.php"); //Include this for getting user agent

//We need to know the config
require("config.php");

On voit pourquoi j'ai cette satanée erreur : les fichiers sont relatif au repertoire d'installation de php_speedy , il suffit de renseigner les chemin absolu :

require("/var/www/pluxml/Dev.Yannou90/php_speedy/controller/compressor.php");
require("/var/www/pluxml/Dev.Yannou90/php_speedy/libs/php/view.php"); //Include this for path getting help
require("/var/www/pluxml/Dev.Yannou90/php_speedy/libs/php/user_agent.php"); //Include this for getting user agent

//We need to know the config
require("/var/www/pluxml/Dev.Yannou90/php_speedy/config.php");

Bon , je vais pouvoir approfondir la chose ...

Yannou90 · mars 2013

je ne peus pas modifier mon htaccess a ma convenance , et du coup je ne peux pas regler la reponse du serveur sur des image , comme le etag et autre , alors pourquoi pas embarquer les images directement dans le css avec base64 ?!
J'ai donc fait un script bash (ouai , je peux en placer un :cool: ) , je vous presente la bete :

#!/bin/bash

#Le chemin vers le dossier de theme
#THEME="/media/Perso/Bureau/theme-piano-black-2"
THEME=""

#Le nom du dossier contenant les images , logiquement dans le dossier de theme
#IMG="img"
IMG=""

cd "${THEME}/${IMG}"

for i in $(file  --mime-type * | cut -d':' -f1)
do
	FILE="${IMG}/${i}"
	MIME="$(file -b --mime-type "$i")"
	BASE="$(base64 --wrap=0 "${i}")"
	FORMAT="data:${MIME};base64,${BASE}"
	sed -i "s|${FILE}|${FORMAT}|g" ../*.css
done
	
exit 0

Les prerequis : bash et base64 , pour "dos" ben je ne peux rien ]:D.

Pour l'exemple j'utilise le theme theme-piano-black-2 , ce dossier contient un dossier "img" qui est dedié aux images :
-Avant :

.post-content ul li { margin:0 0 0 0; line-height:160%; background:url(img/bullet1.gif) no-repeat left 9px; padding:0 0 0 12px; }

-Apres :

.post-content ul li { margin:0 0 0 0; line-height:160%; background:url(data:image/gif;base64,R0lGODlhAgACAIAAAKKiogAAACH5BAAAAAAALAAAAAACAAIAAAIChFEAOw==) no-repeat left 9px; padding:0 0 0 12px; }

Je vous conseil de faire une sauvegarde de votre theme avant toute manipulation et de tester dans un environnement de developpement !!
Le script ce charge de trouver les images , de reconnaitre le mime-type , d'encoder en base64 sur une ligne , et de remplacer les liens du css pointant vers les images par le code produit .
Avec ce systeme , couplé au pseudo cache expliqué plus haut et speedy_php , je passe d'une 50 de requete ( css + image ) à 1 .
Voilou :P

Stéphane · mars 2013

Salut
pour eviter de mettre en dur le chemin absolu voilà un bonne syntaxe qui marchera à chaque fois

[== PHP ==]
require(dirname(__FILE__)."/controller/compressor.php");

le réferencement ce fait à partir du script d'appel
à toi d'adapter après pour accéder jusqu'au fichier, par exemple

[== PHP ==]
require(dirname(__FILE__)."/../../controller/compressor.php");

Yannou90 · mars 2013

Merci Stephane pour l'astuce

Yannou90 · mars 2013

Çà devient bon là

: grade A avec Yslow (98/100) et une note de 96/100 avec page speed :
-les pages sont 100% en cache -> chargement ultra-rapide
-css/js -> minifié/concaténé/compressé automatiquement
Je bosse sur un plugin , des qu'il est pret , du moin pour des tests , je vous le fais passer
Un lien sur "Show Slow pour voir les performances : http://www.showslow.com/details/7213967/http://dev.yannou90.free.fr/

Stéphane · mars 2013

Hate de voir ce plugin. Je checkerai le code

petitchevalroux · mars 2013

Félicitation pour ton taf Yannou90.

Juste une petite remarque est ce que tu as fait des tests sur les commentaires ?

Je m'explique : Comme pluxml utilise la session afficher les message "Commentaire ajouté ..." si ton plugin met toute la page en cache à ce moment là (et que le cache est partagé entre les visiteurs). Il se pourrait bien que les autres visiteurs voient eux aussi le message

Yannou90 · mars 2013

Tu sais j'ai pas fais grand choses !

J'essais avant tout de respecter certains standards , et optimiser ce que je peux comme je le peux !

J'ai un serveur perso et il y a beaucoup d'optimisations possible en tand qu' admin .

Mon blog tourne chez free , pas beaucoup d'article pour le moment , je souhaite déjà avoir une identitée graphique qui me serait propre , çà m'oblige à en apprendre un peut plus , j'adore comprendre !
Pour le cache , ce n'est pas un cache serveur en dur , c'est juste le "header" de la requette qui est imposé , celà permet une mise en cache forcée du navigateur et permet artifficiellement de ne pas avoir à re-télécharger l'enssemble des fichier .

En gros quand tu navigue sur mon blog , a chaque acces à une page , la page est mise en cache "navigateur" , si tu repasse sur la page tu te prend un 304 , le navigateur recharge son cache et ne telecharge pas une nouvelle fois la page : gain de bande passante , chargement et affichage plus rapide .
Du coup les pages restes dynamique (php) , le contenu est affiché correctement et mis à jour .
À moin d'avoir un cache démesuré , de ne jamais le vider et de passer sa vie sur le même blog , il n'y a pas de probleme , pluxml fonctionne comme à son habitude !

Je fais des testes pour implementer un vrais systeme de cache en dur sur serveur , çà n'ameliore pas le temps de chargement mais limites les ressources serveurs ( cpu , mem ,...) , la on gagne en temps de réponses et oui on peut avoir des resultat inatendu : contenu non mis a jour ...

Une piste : ne pas mettre en cache "dur" la page d'acceuil , et tout roule

petitchevalroux · mars 2013

J'ai lu trop vite ton code

Pour ce qui est du cache cotés serveur, j'ai longtemps utilisé un système basé sur du cache html basé sur les tampons de sorties ... Maintenant que j'ai mon serveur j'utilise un reverse proxy et à part le petit détail de la session ça poutre

Yannou90 · mars 2013

Bon la je plane plein pot !!

Je penses m'y prendre comme une bille mais mon p'tit cerveau n'en peut plus :

[== PHP ==]
<?
class BoostMyPlux extends plxPlugin {
	public function __construct($default_lang) {
		parent::__construct($default_lang);
		# droits pour accèder à la page config.php du plugin
		$this->setConfigProfil(PROFIL_ADMIN, PROFIL_MANAGER);
		# Ajouts des hooks
		$this->addHook('IndexBegin', 'IndexBegin');
                $this->addHook('IndexEnd', 'IndexEnd');
		}
	public function onActivate() {
	if(!is_file($this->plug['parameters.xml'])) {
		$this->setParam('comp_opt_min_js', 0, 'numeric');
		$this->setParam('comp_opt_min_page', 1, 'numeric');
		$this->setParam('comp_opt_min_css', 1, 'numeric');
		$this->setParam('comp_opt_gz_js', 1, 'numeric');
		$this->setParam('comp_opt_gz_css', 1, 'numeric');
		$this->setParam('comp_opt_active', 1, 'numeric');
		$this->setParam('comp_opt_cleanup', 1, 'numeric');
		$this->setParam('comp_opt_data_uri', 1, 'numeric');			
		$this->saveParams();
		}
	}
	public function IndexBegin() {
		require PLX_PLUGINS."BoostMyPlux/controller/compressor.php";
		require PLX_PLUGINS."BoostMyPlux/libs/php/view.php";
		require PLX_PLUGINS."BoostMyPlux/libs/php/user_agent.php";
		
		#########################################
		## Options non définits par le plugin
		#########################################
		$compress_options['username'] = "";
		$compress_options['password'] = "";
		$compress_options['javascript_cachedir'] = "cache_js";
		$compress_options['css_cachedir'] = "cache_css";
		$compress_options['js_libraries'] = "";
		$compress_options['ignore_list'] = "";
		$compress_options['gzip']['page'] = "0";
		$compress_options['footer']['text'] = "0";
		$compress_options['footer']['image'] = "0";
		#########################################
	
		$compress_options = array();
		$this->getParam('comp_opt_min_js');
		$compress_options['minify']['javascript'] = "comp_opt_min_js";
		$this->getParam('comp_opt_min_page');
		$compress_options['minify']['page'] = "comp_opt_min_page";
		$this->getParam('comp_opt_min_css');
		$compress_options['minify']['css'] = "comp_opt_min_css";
		$this->getParam('comp_opt_gz_js');
		$compress_options['gzip']['javascript'] = "comp_opt_gz_js";
		$this->getParam('comp_opt_gz_css');
		$compress_options['gzip']['css'] = "comp_opt_gz_css";
		$this->getParam('comp_opt_active');
		$compress_options['active'] = "comp_opt_active";
		$this->getParam('comp_opt_cleanup');
		$compress_options['cleanup']['on'] = "comp_opt_cleanup";
		$this->getParam('comp_opt_data_uri');
		$compress_options['data_uris']['on'] = "comp_opt_data_uri";
		$this->getParam('comp_opt_exp_js');
		$compress_options['far_future_expires']['javascript'] = "comp_opt_exp_js";
		$this->getParam('comp_opt_exp_css');
		$compress_options['far_future_expires']['css'] = "comp_opt_exp_css";
		
		$view = new compressor_view();

		$user_agent = new _speedy_User_agent();
		
		if(substr(phpversion(),0,1) == 5) {
		require_once PLX_PLUGINS."BoostMyPlux/libs/php/jsmin.php";
		$jsmin = new JSMin($contents);
		}
		
		$compressor = new compressor(array('view'=>$view,
										   'options'=>$compress_options,
										   'jsmin'=>$jsmin,
										   'user_agent'=>$user_agent)
									 );
	}
	public function IndexEnd() {
		ob_start();
		echo $output;
		$compressor->finish();
		$output = ob_get_clean();
	}
}
?>

Edit : oublié IndexEnd , pas d'erreur dans les logs mais plus d'affichage , ici le code source en sortie :

[== PHP ==]
<?php $output = ckeditor::wmodeTransparent($output) ?><?php
		$text = "<p class=\"rememberme\"><input type=\"checkbox\" id=\"id_rememberme\" name=\"rememberme\" value=\"1\" />&nbsp;Se rappeler de moi sur ce site</p>";
		$output = preg_replace("/<textarea.+name=['\"]content['\"](.*?)<\/textarea>/i", "$0".$text, $output);
		?>

Yannou90 · mars 2013

Modifié comme suit :

[== PHP ==]
<?php
class BoostMyPlux extends plxPlugin {
	public function __construct($default_lang) {
		parent::__construct($default_lang);
		# droits pour accèder à la page config.php du plugin
		$this->setConfigProfil(PROFIL_ADMIN, PROFIL_MANAGER);
		# Ajouts des hooks
		$this->addHook('IndexBegin', 'IndexBegin');
		$this->addHook('IndexEnd', 'IndexEnd');
		}
	public function onActivate() {
	if(!is_file($this->plug['parameters.xml'])) {
		$this->setParam('comp_opt_min_js', 0, 'numeric');
		$this->setParam('comp_opt_min_page', 1, 'numeric');
		$this->setParam('comp_opt_min_css', 1, 'numeric');
		$this->setParam('comp_opt_gz_js', 1, 'numeric');
		$this->setParam('comp_opt_gz_css', 1, 'numeric');
		$this->setParam('comp_opt_active', 1, 'numeric');
		$this->setParam('comp_opt_cleanup', 1, 'numeric');
		$this->setParam('comp_opt_data_uri', 1, 'numeric');			
		$this->saveParams();
		}
	}
	public function IndexBegin() {
		echo '<?php	
		require PLX_PLUGINS."BoostMyPlux/controller/compressor.php";
		require PLX_PLUGINS."BoostMyPlux/libs/php/view.php";
		require PLX_PLUGINS."BoostMyPlux/libs/php/user_agent.php";
		?>';
		
		#########################################
		## Options non définits par le plugin
		#########################################
		$compress_options['username'] = "";
		$compress_options['password'] = "";
		$compress_options['javascript_cachedir'] = PLX_PLUGINS."BoostMyPlux/cache_js";
		$compress_options['css_cachedir'] = PLX_PLUGINS."BoostMyPlux/cache_css";
		$compress_options['js_libraries'] = "";
		$compress_options['ignore_list'] = "";
		$compress_options['gzip']['page'] = "0";
		$compress_options['footer']['text'] = "0";
		$compress_options['footer']['image'] = "0";
		#########################################
	
		$compress_options = array();
		$this->getParam('comp_opt_min_js');
		$compress_options['minify']['javascript'] = "comp_opt_min_js";
		$this->getParam('comp_opt_min_page');
		$compress_options['minify']['page'] = "comp_opt_min_page";
		$this->getParam('comp_opt_min_css');
		$compress_options['minify']['css'] = "comp_opt_min_css";
		$this->getParam('comp_opt_gz_js');
		$compress_options['gzip']['javascript'] = "comp_opt_gz_js";
		$this->getParam('comp_opt_gz_css');
		$compress_options['gzip']['css'] = "comp_opt_gz_css";
		$this->getParam('comp_opt_active');
		$compress_options['active'] = "comp_opt_active";
		$this->getParam('comp_opt_cleanup');
		$compress_options['cleanup']['on'] = "comp_opt_cleanup";
		$this->getParam('comp_opt_data_uri');
		$compress_options['data_uris']['on'] = "comp_opt_data_uri";
		$this->getParam('comp_opt_exp_js');
		$compress_options['far_future_expires']['javascript'] = "comp_opt_exp_js";
		$this->getParam('comp_opt_exp_css');
		$compress_options['far_future_expires']['css'] = "comp_opt_exp_css";
		
		echo '<?php
		$view = new compressor_view();

		$user_agent = new _speedy_User_agent();
		
		if(substr(phpversion(),0,1) == 5) {
		require_once PLX_PLUGINS."BoostMyPlux/libs/php/jsmin.php";
		$jsmin = new JSMin($contents);
		}
		
		$compressor = new compressor(array("view"=>$view,
										   "options"=>$compress_options,
										   "jsmin"=>$jsmin,
										   "user_agent"=>$user_agent)
									 );
		?>';
	}
	public function IndexEnd() {
		echo '<?php		
		ob_start();
		echo $output;
		$compressor->finish();
		$output = ob_get_clean();
		?>';
	}
}
?>

Plus d'erreur mais la configuration n'est pas "incluse" , donc fonctionne pas , je vais trouver !!

Stéphane · mars 2013

Salut
Toutes lignes du genre

$this->getParam('comp_opt_min_js');

faut les utiliser en affectant à une variable.
soit une variable locale à la fonction:

$var = $this->getParam('comp_opt_min_js');

soit à une variable de la classe BoostMyPlux

$this->var = $this->getParam('comp_opt_min_js');

getParam permet de récupérer la valeur d'un paramètre dans le fichier xml des parametres du plugin

Stéphane · mars 2013

donc si je comprends bien ce que tu veux, il te faudrait faire

$compress_options['minify']['javascript'] = $this->getParam('comp_opt_min_js');

Stéphane · mars 2013

et attention le $compress_options n'a qu'une portée locale à la fonction IndexBegin.
les valeurs ne seront donc pas accessible à partir de IndexEnd
il faut que tu fasses

<?php echo '$compress_options["minify"]["javascript"] = "'.$this->getParam('comp_opt_min_js').'";' ?>

attention à la syntaxe ' et " pour l'injection du code

Yannou90 · mars 2013

Merci Stephane mais je dois my prendre comme un manche !
Je suis repartie de zero et respecté un peu plus le déroulement "normal" de php_speedy qui est
1) inclure au debut du traitement de la page le script php_speedy
2)inclure en fin de page un appel a la class compressor
Bon , le plugin ( en parti) :

[== PHP ==]
<?php
class BoostMyPlux extends plxPlugin {
	public function __construct($default_lang) {
		parent::__construct($default_lang);
		# droits pour accèder à la page config.php du plugin
		$this->setConfigProfil(PROFIL_ADMIN, PROFIL_MANAGER);
		# Ajouts des hooks
		$this->addHook('IndexBegin', 'IndexBegin');
		$this->addHook('IndexEnd', 'IndexEnd');
		}
	public function onActivate() {
	if(!is_file($this->plug['parameters.xml'])) {
		$this->setParam('comp_opt_min_js', 0, 'numeric');
		$this->setParam('comp_opt_min_page', 1, 'numeric');
		$this->setParam('comp_opt_min_css', 1, 'numeric');
		$this->setParam('comp_opt_gz_js', 1, 'numeric');
		$this->setParam('comp_opt_gz_css', 1, 'numeric');
		$this->setParam('comp_opt_active', 1, 'numeric');
		$this->setParam('comp_opt_cleanup', 1, 'numeric');
		$this->setParam('comp_opt_data_uri', 1, 'numeric');			
		$this->saveParams();
		}
	}
	public function IndexBegin() {
		echo '<?php
		require PLX_PLUGINS."BoostMyPlux/php_speedy.php";
		?>';
	}
	public function IndexEnd() {
		echo '<?php		
		ob_start();
		echo $output;
		$compressor->finish();
		$output = ob_get_clean();
		?>';
	}
}
?>

Çà çà marche si j'appelle le "vrais" script php_speedy , mais , forcement ce serait tellement simple que je ne passe pas des jours comme un dingues entre la doc php et pluxml , mais le scrip php_speedy requiére son fichier de config , qui comme par hasard s'appel config.php! :mad:
Il est de la forme suivante :

[== PHP ==]
<?php
#########################################
## Compressor option file ##############
#########################################
## Access control
$compress_options['username'] = "";
$compress_options['password'] = "";
## Path info
$compress_options['javascript_cachedir'] = "";
$compress_options['css_cachedir'] = "";
## Comma separated list of JS Libraries to include
$compress_options['js_libraries'] = "";
## Ignore list
$compress_options['ignore_list'] = "";
## Minify options
$compress_options['minify']['javascript'] = "0";
$compress_options['minify']['page'] = "1";
$compress_options['minify']['css'] = "1";
## Gzip options
$compress_options['gzip']['javascript'] = "0";
$compress_options['gzip']['page'] = "0";
$compress_options['gzip']['css'] = "0";
## Versioning
$compress_options['far_future_expires']['javascript'] = "1";
$compress_options['far_future_expires']['css'] = "1";
## On or off 
$compress_options['active'] = "0";
## Display a link back to PHP Speedy
$compress_options['footer']['text'] = "1";
$compress_options['footer']['image'] = "1";
## Should Speedy Clean Up the cache directory?
$compress_options['cleanup']['on'] = "0";
## Should Speedy use data URIs for background images?
$compress_options['data_uris']['on'] = "1";
#########################################
?>

J'ai modifié son nom en speedy_config.php pour laisser le config.php dédié a la configuration du plugin , bref ...
Je n'arrive pas mais pas du tout a lire les parametre de parametre.xml depuis ce satané fichier qui me rends chevre !

mon fichier parametre.xml :

[== Indéfini ==]
<?xml version='1.0' encoding='UTF-8'?>
<document>
	<parameter name="comp_opt_min_js" type="numeric">0</parameter>	
	<parameter name="comp_opt_min_page" type="numeric">1</parameter>
	<parameter name="comp_opt_min_css" type="numeric">1</parameter>
	<parameter name="comp_opt_gz_js" type="numeric">1</parameter>
	<parameter name="comp_opt_gz_css" type="numeric">1</parameter>
	<parameter name="comp_opt_active" type="numeric">1</parameter>
	<parameter name="comp_opt_cleanup" type="numeric">1</parameter>
	<parameter name="comp_opt_data_uri" type="numeric">1</parameter>
	<parameter name="comp_opt_exp_js" type="numeric">1</parameter>
	<parameter name="comp_opt_exp_css" type="numeric">1</parameter>
</document>

Et mon pseudo speedy_config.php qui ce doit de remplacer l'original mais qui ne peut pas fonctionner comme çà:

[== PHP ==]
<?php
#########################################
## Options non définits par le plugin
#########################################
$compress_options["username"] = "";
$compress_options["password"] = "";
$compress_options["javascript_cachedir"] = PLX_PLUGINS."BoostMyPlux/cache_js";
$compress_options["css_cachedir"] = PLX_PLUGINS."BoostMyPlux/cache_css";
$compress_options["js_libraries"] = "";
$compress_options["ignore_list"] = "";
$compress_options["gzip"]["page"] = "0";
$compress_options["footer"]["text"] = "0";
$compress_options["footer"]["image"] = "0";
#########################################
## Options définits par le plugin
#########################################
$comp_opt_min_js  = echo plxUtils::strCheck($plxPlugin->getParam('comp_opt_min_js'));
$compress_options["minify"]["javascript"] = "comp_opt_min_js";
$comp_opt_min_page  = echo plxUtils::strCheck($plxPlugin->getParam('comp_opt_min_page'));
$compress_options["minify"]["page"] = 'comp_opt_min_page';
$comp_opt_min_css  = echo plxUtils::strCheck($plxPlugin->getParam('comp_opt_min_css'));
$compress_options["minify"]["css"] = 'comp_opt_min_css';
$comp_opt_gz_js  = echo plxUtils::strCheck($plxPlugin->getParam('comp_opt_gz_js'));
$compress_options["gzip"]["javascript"] = 'comp_opt_gz_js';
$comp_opt_gz_css  = echo plxUtils::strCheck($plxPlugin->getParam('comp_opt_gz_css'));
$compress_options["gzip"]["css"] = 'comp_opt_gz_css';
$comp_opt_active  = echo plxUtils::strCheck($plxPlugin->getParam('comp_opt_active'));
$compress_options["active"] = 'comp_opt_active';
$comp_opt_cleanup  = echo plxUtils::strCheck($plxPlugin->getParam('comp_opt_cleanup'));
$compress_options["cleanup"]["on"] = 'comp_opt_cleanup';
$comp_opt_data_uri  = echo plxUtils::strCheck($plxPlugin->getParam('comp_opt_data_uri'));
$compress_options["data_uris"]["on"] = 'comp_opt_data_uri';
$comp_opt_exp_js  = echo plxUtils::strCheck($plxPlugin->getParam('comp_opt_exp_js'));
$compress_options["far_future_expires"]["javascript"] = 'comp_opt_exp_js';	
$comp_opt_exp_css  = echo plxUtils::strCheck($plxPlugin->getParam('comp_opt_exp_css'));
$compress_options["far_future_expires"]["css"] = 'comp_opt_exp_css';
?>

Çà va en faire rire plus d'un , je le sens bien mais la çà fait 15 jour que j'essaies comme je peux et je n'y arrive pas , j'ai parcouru tout les plugins que j'ai , la doc de pluxml (pdf) , la doc de php , je sais plus quoi faire a part eclater mon portable , ce qui ne resoud rien !
Ma question :
comment créer ce fichier de config , qui lit les parametre depui parametre.xml et qui me le traduit sous la meme forme que l'original ???? 8.( 8.( 8.(

Yannou90 · mars 2013

Une petite syntax qui ne marche toujours pas :

[== PHP ==]
<?php
#########################################
## Options non définits par le plugin
#########################################
$compress_options["username"] = "";
$compress_options["password"] = "";
$compress_options["javascript_cachedir"] = PLX_PLUGINS."BoostMyPlux/cache_js";
$compress_options["css_cachedir"] = PLX_PLUGINS."BoostMyPlux/cache_css";
$compress_options["js_libraries"] = "";
$compress_options["ignore_list"] = "";
$compress_options["gzip"]["page"] = "0";
$compress_options["footer"]["text"] = "0";
$compress_options["footer"]["image"] = "0";
#########################################
## Options définits par le plugin
#########################################

echo '$compress_options["minify"]["javascript"] = "'.$plxPlugin->getParam('comp_opt_min_js').'";';

echo '$compress_options["minify"]["page"] = "'.$plxPlugin->getParam('comp_opt_min_page').'";';

echo '$compress_options["minify"]["css"] = "'.$plxPlugin->getParam('comp_opt_min_css').'";';

echo '$compress_options["gzip"]["javascript"] = "'.$plxPlugin->getParam('comp_opt_gz_js').'";';

echo '$compress_options["gzip"]["css"] = "'.$plxPlugin->getParam('comp_opt_gz_css').'";';

echo '$compress_options["active"] = "'.$plxPlugin->getParam('comp_opt_active').'";';

echo '$compress_options["cleanup"]["on"] = "'.$plxPlugin->getParam('comp_opt_cleanup').'";';

echo '$compress_options["data_uris"]["on"] = "'.$plxPlugin->getParam('comp_opt_data_uri').'";';

echo '$compress_options["far_future_expires"]["javascript"] = "'.$plxPlugin->getParam('comp_opt_exp_js').'";';

echo '$compress_options["far_future_expires"]["css"] = "'.$plxPlugin->getParam('comp_opt_exp_css').'";';
?>

Retour comme d'habitude :

[== Indéfini ==]
[Tue Mar 26 12:12:23 2013] [error] [client 192.168.0.35] PHP Fatal error:  Call to a member function getParam() on a non-object in /media/nunux/Documents/Dev.Yannou90/plugins/BoostMyPlux/speedy_config.php on line 18

créer une class , appelé une fonction ? Je sais plus ...

Yannou90 · mars 2013

Bon j'abandonne , je donne quand meme php_speedy et le pseudo plugin :

1)Recuperer php_speedy ici
2)Décompresser l'archive à la racine du site
3)Editer php_speedy.php aux lignes 55,56,57,60,70 en renseignant l'adresse absolu du chemin vers les scripts , c'est là ou je bloque , quelque soit la methode que j'ai employé , php_speedy ne trouvait pas le bon le bon chemin !
4)Editer config.php aux lignes 9 et 10 en renseignant l'adresse absolu du chemin vers les dossiers , pareils , lamentablement echoué pour trouver le moyen de lui faire manger correctement ( vraiment honte 8.( )
5)Recupérer le pseudo plugin ( encore plus honte 8.( ) ici le decompresser dans le dossier plugins et l'activé ( pfff tu parle )

J'ai remplacé jsmin.php par la derniere version existante , plus efficace et moin gourmand mais abandonné .

Chez free si vous activé le "minify js" vous pouvez tomber sur une erreur dans ce cas le desactivé (pas asser de memoire alloué à php) .

Pour "uri data" si votre theme contient deja ce type d'image encodé en base64 et embarqué dans les css , il se peut que le script ne le reconnaisse pas et le reencode comme une url , du coup on perd l'image , dans ce cas precis desactiver l'encodage .

Suivant la version du navigateur c'est un css en base64 qui est proposé , ou non

Aucun fichiers n'est reellement modifié , vous pouvez toujours éditer les css , changer les image , ajouter des scripts , tout est automatique et réversible , il suffit de desactiver le plugin ( ahah la bonne blague ) .

La faut que je lache la pression , je sais d'ou vient le soucis : libs/php/view.php qui permet de definir les path absolu pour php_speedy , mais le soucis est :

1)Comment definir exactement ces $path : /var/www/... et pas /home/roger/...
2)Creer ce satané fichier de config

Bref , je repose mes neuronnes et m'y remet dès que j'ai les infos nécessaires , là je craque , php je n'y connait vraiment rien , j'apprend mais là çà fait beaucoup .
Je precise que c'est extremement efficace je suis passe de 75 requete à 7 (et encore endesactivant google analityc je passe à 4) .
La solution du header modifier , je pensais l'inclure dans le plugin , mais je souhaitais deja faire fonctionner la bete , enfin voila , une bonne biere et çà iras mieux !
Santé !!

Yannou90 · mars 2013

j'oubliais : ne pas activer la compression gzip des page dans la config de php_speedy , c'est notre pluxml qui sans charge !

Jerry Wham · mars 2013

Tu te trompes dans les chemins du fichier php_speedy.php.
Enlève /var/www/pluxml/Dev.Yannou90/php_speedy/ dans chaque require.

De même dans le fichier config.php

Yannou90 · mars 2013

Ah ba voila , maintenant que j'ai posté , çà fonctionne ]:D
Je vais devenir chevre

Je refais mon pactage et poste le resultat !!

Yannou90 · mars 2013

Jerry Wham a écrit:

Tu te trompes dans les chemins du fichier php_speedy.php.
Enlève /var/www/pluxml/Dev.Yannou90/php_speedy/ dans chaque require.

De même dans le fichier config.php

Bonjour
Desole je n'avais pas vu ton post
C'est les seul chemin qui fonctionne chez moi !
la je vien de retester en mettatnt les fichier d'origine de php_speedy et en lançant l'installation , il me trouve ces chemins là !
De plus je sui obligé de manuellement editer php_speedy.php et de lui mettre le meme chemin , depuis document root (/var/www/...) sinon mon plux me charge config.php de la racine du site plutot que celui du dossier php_speedy ,
je n'ai fait que des testes en local et pas sur free.fr , en local je n'ai pas le choix , mon sites free tourne avec un le plugin (pfffff) et php_speedy a la racine .
En local j'ai un virtualhost c'est peut etre pour cela que je galere comme ca , çà et un vieux chmod !

Jerry Wham · mars 2013

Tu as oublié d'écrire php après le <? du début du fichier php_speedy.php

Jerry Wham · mars 2013

Voilà le plugin que j'obtiens en me basant sur ton travail.[del]Seule la minification de javascript ne fonctionne pas et je ne comprends pas pourquoi. Si Stéphane a une idée...
[/del]

La première chose à faire est de forcer les pages à être mises en cache. Il faut donc mettre, comme tu l'as dit, dans le fichier header du thème, à la place de

<?php if(!defined('PLX_ROOT')) exit;?>

le code suivant :

<?php if(!defined('PLX_ROOT')) exit; 
$lastModified=filemtime(__FILE__);
$etagFile = md5_file(__FILE__);
$etag = dechex(fileinode(__FILE__));
$etag.= "-".dechex(filesize(__FILE__));
$etag.= "-".dechex(((filemtime(__FILE__).str_repeat("0",6)+0) & (8589934591)));
$ifModifiedSince=(isset($_SERVER['HTTP_IF_MODIFIED_SINCE']) ? $_SERVER['HTTP_IF_MODIFIED_SINCE'] : false);
$etagHeader=(isset($_SERVER['HTTP_IF_NONE_MATCH']) ? trim($_SERVER['HTTP_IF_NONE_MATCH']) : false);
header("Last-Modified: ".gmdate("D, d M Y H:i:s", $lastModified)." GMT");
header("Etag: W/\"$etag\"");
header('Cache-Control: public');
header("Vary: Accept-Encoding");
if (@strtotime($_SERVER['HTTP_IF_MODIFIED_SINCE'])==$lastModified || $etagHeader == $etagFile)
{
       header("HTTP/1.1 304 Not Modified");
       exit;
}
?>

Ensuite, il suffit d'activer le plugin dans la page d'admin.

Ps : si vous testez le site en local et que vous le copiez tel quel sur votre serveur de prod ça ne marchera pas. Il faudra supprimer le fichier de paramétrage situé, pour la version 5.1.6, dans le dossier du plugin (parametres.xml) ou pour la 5.1.7, dans le dossier data/configuration/plugins (BoostMyPlux.xml).
Il faudra également supprimer le fichier situé dans le cache du plugin (plugins/BoostMyPlux/php_speedy/cache/unnomarallonge.php).

Dernier point : il faudra désactiver puis réactiver le plugin.

EDIT IMPORTANT : J'ai oublié de remettre à zéro la compression gzip dans la configuration du plugin. Le temps que je mette l'archive à jour, il faut modifier la ligne 23 du fichier plugins/BoostMyPlux/php_speedy/config/config.php et mettre le paramètre à 0

Enjoy

Jerry Wham · mars 2013

Je viens de mettre l'archive à jour.

Désormais, il n'est plus nécessaire d'écrire tout le code

<?php if(!defined('PLX_ROOT')) exit; 
$lastModified=filemtime(__FILE__);
$etagFile = md5_file(__FILE__);
$etag = dechex(fileinode(__FILE__));
$etag.= "-".dechex(filesize(__FILE__));
$etag.= "-".dechex(((filemtime(__FILE__).str_repeat("0",6)+0) & (8589934591)));
$ifModifiedSince=(isset($_SERVER['HTTP_IF_MODIFIED_SINCE']) ? $_SERVER['HTTP_IF_MODIFIED_SINCE'] : false);
$etagHeader=(isset($_SERVER['HTTP_IF_NONE_MATCH']) ? trim($_SERVER['HTTP_IF_NONE_MATCH']) : false);
header("Last-Modified: ".gmdate("D, d M Y H:i:s", $lastModified)." GMT");
header("Etag: W/\"$etag\"");
header('Cache-Control: public');
header("Vary: Accept-Encoding");
if (@strtotime($_SERVER['HTTP_IF_MODIFIED_SINCE'])==$lastModified || $etagHeader == $etagFile)
{
       header("HTTP/1.1 304 Not Modified");
       exit;
}
?>

A la place, dans le fichier header.php de votre thème, après la ligne

<?php if(!defined('PLX_ROOT')) exit;?>

appelez le hook suivant

<?php eval($plxShow->callHook('putInCache')); ?>

La minification du javascript fonctionne mais peut demander beaucoup de ressources en fonction du projet. Elle est donc désactivée par défaut. A vous de voir si vous souhaitez la réactiver.

Je viens de créer un topic dans la section plugins pour suivre plus facilement le projet.

Ps : si vous testez le site en local et que vous le copiez tel quel sur votre serveur de prod ça ne marchera pas. Il faudra supprimer le fichier de paramétrage situé, pour la version 5.1.6, dans le dossier du plugin (parametres.xml) ou pour la 5.1.7, dans le dossier data/configuration/plugins (BoostMyPlux.xml).
Il faudra également supprimer le fichier situé dans le cache du plugin (plugins/BoostMyPlux/php_speedy/cache/unnomarallonge.php).

Dernier point : il faudra désactiver puis réactiver le plugin.

Enjoy.

Optimisation : page en cache et css/js minifié/concaténé/compressé

Réponses