CSS JS AJAX depuis PHP

**Khleo** · 24/01/2012, 17h24

Bonjour,

Je vais bientôt me lancer dans la création d'un nouveau site en PHP avec du CSS, JS et AJAX.

J'ai déjà réalisé des sites en PHP mais je trouve extrêmement pénible de devoir "switcher" entre les différents fichiers et les modifier.

Pour cela j'aimerai que tout se fasse par PHP :

J'ai une fonction, MaFonction par exemple et je voudrais que chaque fonction comporte le CSS, JS, AJAX qui lui correspond afin de pouvoir être modifié rapidement :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
private function MaFonction () {
$CSS = $CSS.'
.MenuGauche {
width:350px;
}
';
 
$JS = $JS.'
function FonctionJS () {
alert("bonjour");
}
';
 
$this->AJAX('FichierAjax.php', 'Code PHP du fichier');
 
 
CODE DE MA FONCTION ...
 
 
}

Je voudrais pouvoir écrire une fonction pour générer les fichiers CSS et JS en venant lire chacune des variables pour l'écrire dans un fichier. Mais le problème c'est que vu qu'elles sont dans une fonction il faut exécuter la fonction pour que la variable soit définie.

Cette méthode pourrait également me permettre de compresser les fichiers CSS et JS en supprimant automatiquement les retours à la ligne, les tab et les doubles espaces.

Merci

**vorace** · 24/01/2012, 18h35

Et la question est ?

**Khleo** · 24/01/2012, 18h41

Si possible, comment écrire une fonction qui vienne récupérer tous les éléments CSS et JS présents dans les fonctions pour ensuite les écrire dans un fichier.

**Benjamin Delespierre** · 24/01/2012, 18h47

Regarde un peu tout ce qu'on arrive à faire avec un seul fichier:http://www.developpez.net/forums/d11...p/#post6461950

Dans la même optique, on peut même mettre les images dans un fichier PHP.
Mais (car il y a un mais) on ne bénéficie plus du support du header 304 (not modified) généralement émis par Apache. En conséquence, les fichiers sont systématiquement téléchargés, ce qui n'est pas vraiment une bonne chose.
Encore qu'on puisse le faire manuellement comme expliqué ici: http://alexandre.alapetite.fr/doc-alex/php-http-304/

Je ne saurais que trop te décourager d'aller dans cette voie mais si tu insiste, voici une ébauche de solution:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
$css = <<< EOCSS
* {
	margin: 0px;
	padding: 0px;
}
 
html {
	background-color: #ccc;
}
 
body {
	width: 960px;
	margin: auto;
	margin-top: 20px;
	margin-bottom: 20px;
}
EOCSS;
 
$js = <<< EOJS
alert('hello !');
EOJS;
 
function foo () {
	global $js, $css;
 
	$js .= 'alert("foo");';
	$html = '<h1>FOO</h1>';
 
	return compact('js','css','html');
}
 
function bar () {
	global $js, $css;
 
	$css .= 'h1 { color: red }';
	$html = '<h1>BAR</h1>';
 
	return compact('js','css','html');
}
 
// NOW WE START //
if (isset($_GET['page']) && function_exists($fct = strtolower($_GET['page']))):
 
extrac( $fct() );
$js   = preg_replace('~\s{2,}~', ' ', $js);
$css  = preg_replace('~\s{2,}~', ' ', $css);
$page = <<< EOFILE
<html>
<head>
	<title>FooBar page</title>
	<script type="text/javascript">{$js}</script>
	<style type="text/css">{$css}</style>
</head>
<body>
	{$html}
</body>
</html>
EOFILE;
 
echo $page;
 
else:
header("HTTP/1.0 404 Not Found");
exit();
endif;

**Khleo** · 24/01/2012, 19h11

Merci ça me donne l’idée de faire comme ça :

Mettre le CSS et le JS entre des balises spécifiques et en commentaires.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
 
 
private function MaFonction () {
 
/*
<fichier_css>
.MenuGauche {
   width:325px;
}
</fichier_css>
 
<fichier_js>
function JS () {
   BlaBla
}
</fichier_js>
*/
 
// Code de la fonction
 
}

Pour ensuite créer un script PHP qui viendra parser les balises et écrire leur contenu dans les fichiers CSS et JS si besoin.

Pour les fichiers AJAX, les fichiers pourront être créés à l’exécution du script et le mettre en commentaire quand celui ci ne change pas.

**Benjamin Delespierre** · 25/01/2012, 10h20

Pour ensuite créer un script PHP qui viendra parser les balises et écrire leur contenu dans les fichiers CSS et JS si besoin.

Que de temps perdu à l’exécution...

Je tiens à rappeler que ta réticence à vouloir utiliser différents fichiers va affecter les performances de ton application.

Sur ce salut !

**Khleo** · 25/01/2012, 14h00

Envoyé par Benjamin Delespierre

Que de temps perdu à l’exécution...

Je tiens à rappeler que ta réticence à vouloir utiliser différents fichiers va affecter les performances de ton application.

Sur ce salut !

Pourquoi ? J’exécute la création des fichiers qu'une seule fois

**vorace** · 25/01/2012, 14h47

Pour ensuite créer un script PHP qui viendra parser les balises et écrire leur contenu dans les fichiers CSS et JS si besoin.

Pour les fichiers AJAX, les fichiers pourront être créés à l’exécution du script et le mettre en commentaire quand celui ci ne change pas.

selon ton code tu vas créer ces fichiers à chaque fois que ta page PHP serra appelé et si ils existent tu comptes faire quoi ? les écraser ou les recréer ou les réutiliser ? dans le dernier cas tu aurai mieux fait de les créer une bonne fois pour toute. En plus tu vas faire mouliner le moteur PHP à chaque fois pour du css et du javascript ? si tu cherches à faire simple sans devoir toujours tout réinventer : utilise un framework (celui de Benjamin Delespierre par exemple... où codeigniter qui assez facile à appréhender...).
Pour info : AJAX n'est pas un format de fichier ni un fichier...(tu as un script js et un script php à la base...)

**Benjamin Delespierre** · 25/01/2012, 14h53

Envoyé par Khleo

Pourquoi ? J’exécute la création des fichiers qu'une seule fois

Oui, une seule fois à chaque requête HTTP...

Je vais tenter de clarifier mon propos: vouloir réunir toutes les composantes d'une application web dans un seul fichier PHP peut se concevoir si l'application en question est relativement légère. Prenons l'exemple de la page d'accueil de WAMP, les images, styles et scripts sont tous dans le PHP mais bon, on veut justement éviter d'avoir une structure de fichier qui polluerai le répertoire www et de plus, cette application ne comporte qu'une seule page. Dans ce cas, pourquoi pas.
Mais faire un site entier de plusieurs pages avec des scripts assez longs (surtout si on utilise des librairies) et du vrai CSS est une entreprise assez risquée.
De toute façon, le temps que tu "gagnes" à n'avoir qu'un seul fichier à manipuler, tu le perds en scrollant dans un fichier de plusieurs milliers de lignes (je sais de quoi je parle) et en plus tu y perds en performances à tous les niveaux et à mon sens, en productivité également.

Si tu cherches à améliorer la qualité de ton travail et ta rapidité d'exécution, utilise un environnement de développement approprié comme Eclipse ou Netbeans. Notepad++ n'est pas du tout approprié à la conduite de projets PHP.

**Celira** · 25/01/2012, 14h59

Envoyé par Benjamin Delespierre

Je tiens à rappeler que ta réticence à vouloir utiliser différents fichiers va affecter les performances de ton application.

Envoyé par Khleo

Pourquoi ? J’exécute la création des fichiers qu'une seule fois

Sur ce point, je te conseille de lire cette news : Pourquoi générer le code JavaScript est une fausse bonne idée

Ce que tu peux faire en alternative, c'est un générateur de CSS, autrement dit un script qui génère ton CSS dans un nouveau fichier. Chaque fois que tu veux modifier ce css, tu lances ce script et tu charges le nouveau fichier CSS à la place de l'ancien.

**Khleo** · 25/01/2012, 15h52

Salut,

Merci pour vos réponses

Ce que tu peux faire en alternative, c'est un générateur de CSS, autrement dit un script qui génère ton CSS dans un nouveau fichier. Chaque fois que tu veux modifier ce css, tu lances ce script et tu charges le nouveau fichier CSS à la place de l'ancien.

Oui c'est le but de mon script, générer à partir de commentaires, des fichiers brutes.

Voila comment je vois les choses :

Je vais créer un (ou plusieurs) fichier PHP dans lequel je vais mettre des commentaires. (Ce fichier PHP sera uniquement là pour que je puisse créer et modifier mon application).

Dans ces commentaires seront présents des balises façon xml dans lequel seront présent les éléments nécessaires :

<CSS></CSS>,
<JS></JS>,
<AJAX>
<NomFichier></NomFichier>
<CodeFichier></CodeFichier>
<NomFichier></NomFichier>
<CodeFichier></CodeFichier>
</AJAX>

Je vais créer un script PHP qui :

- Viendra lire les balises CSS et créera la feuille CSS
- Viendra lire les balises JS et créera le fichier JS
- Créera les fichiers utiles pour l'ajax
- Créera un fichier PHP

Vu que c'est un script qui créera ces fichiers, ils ne comporteront plus de tabulation, double espace, retour à la ligne, commentaires ce qui permettra de réduire la taille des fichiers.

Oui, une seule fois à chaque requête HTTP...

Il est bien évident que moi seul pourra exécuter ce script et que je le ferai uniquement si besoin.

Donc j'aurai un (ou plusieurs) fichier PHP qui me permettra de modifier mon application (et il aura uniquement cette utilisation) qui lui générera tous les fichiers de l'application à ma demande, ces fichiers générés seront utilisés par les visiteurs.

Je pourrai même créer mon application en faisant un fichier PHP par classe et les regrouper tous en un via le script (pour éviter l'utilisation des include et autre require très gourmand).

Le seul inconvénient est que je devrai exécuter le script à chaque fois que je modifierai mon PHP.

**Benjamin Delespierre** · 25/01/2012, 16h00

Je vais créer un script PHP qui :

- Viendra lire les balises CSS et créera la feuille CSS
- Viendra lire les balises JS et créera le fichier JS
- Créera les fichiers utiles pour l'ajax
- Créera un fichier PHP

Aouch

Un générateur dynamique de code pourquoi pas (si tu sais ce que tu fais) mais surtout pas en production ! Tournes-toi plutôt vers un mécanisme de cache.

Vu que c'est un script qui créera ces fichiers, ils ne comporteront plus de tabulation, double espace, retour à la ligne, commentaires ce qui permettra de réduire la taille des fichiers.

Ce qui ne sert pratiquement à rien à moins d'avoir plus de 10ko de script...
Tournes-toi plutôt vers un cache d'opcodes.

Il est bien évident que moi seul pourra exécuter ce script et que je le ferai uniquement si besoin.

Donc j'aurai un (ou plusieurs) fichier PHP qui me permettra de modifier mon application (et il aura uniquement cette utilisation) qui lui générera tous les fichiers de l'application à ma demande, ces fichiers générés seront utilisés par les visiteurs.

Je pourrai même créer mon application en faisant un fichier PHP par classe et les regrouper tous en un via le script (pour éviter l'utilisation des include et autre require très gourmand).

Le seul inconvénient est que je devrai exécuter le script à chaque fois que je modifierai mon PHP.

Donc en gros, tu veux faire un CMS vu qu'il s'agit de créer dynamiquement de nouvelles fonctionnalités / pages.

Je vais être clair: le propos de PHP est générer du contenu (peu importe le format) mais ni de la mise en forme (c'est le rôle des feuilles de style) ni des comportements (c'est le rôle de JS) et encore moins de générer de nouveaux générateurs de contenu. A mon avis tu fais fausse route sur ton projet.

**Khleo** · 25/01/2012, 16h23

Ce qui ne sert pratiquement à rien à moins d'avoir plus de 10ko de script...

Même si je gagne 5% de temps chargement, c'est toujours ça de pris

(J'ai lu qu'avec un CSS on pouvait gagner jusqu’à 30% sur la taille du fichier)

A mon avis tu fais fausse route sur ton projet

Je ferai des tests et je verrai bien si c'est plus pratique ou pas, le script ne devrait pas être long à développer donc je ne prendrai pas trop de risque à essayer.

**Benjamin Delespierre** · 25/01/2012, 17h12

Envoyé par Khleo

Même si je gagne 5% de temps chargement, c'est toujours ça de pris

(J'ai lu qu'avec un CSS on pouvait gagner jusqu’à 30% sur la taille du fichier)

La taille d'un fichier CSS ou JS influe directement sur le temps de chargement de la page c'est évident. Mais la taille d'un fichier PHP influe peu sur le temps que mets PHP à générer l'opcode, c'est assez négligeable en fait. On peut classer ce genre d'optimisation dans les fausses bonnes idées.

Envoyé par Khleo

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

A mon avis tu fais fausse route sur ton projet

Je ferai des tests et je verrai bien si c'est plus pratique ou pas, le script ne devrait pas être long à développer donc je ne prendrai pas trop de risque à essayer.

Expérimenter est toujours une bonne chose et je t'y encourage

Cependant, toutes les idées ne sont pas bonnes en production. Il faut avoir une vision totalement différente entre les outils qu'on créé pour soi et les véritables application qu'on déploie en ligne, ils n'ont ni la même porté ni les mêmes contraintes.
Par exemple, je ne ferais jamais ce que je t'ai montré plus haut concernant ma page d'accueil WAMP sur un site en ligne, ce serait une catastrophe au niveau des perfs.

CSS JS AJAX depuis PHP

Langage PHP

Discussions similaires

Partager

Partager