Forum |  HardWare.fr | News | Articles | PC | Prix | S'identifier | S'inscrire | Shop Recherche
1115 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  YuiCompressor (ou autre) et javascript.php ?

 



 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

YuiCompressor (ou autre) et javascript.php ?

n°2031858
ksss
Posté le 24-10-2010 à 18:49:33  profilanswer
 

Bonjour à tous,
 
Je cherche à optimiser l'appel de script sur un site web. J'utilise d'habitude YuiCompressor mais ici certains des scripts JS ont en fait une extension PHP (pour passer des variables).
 
Le header est bien sur approprié :
Header("content-type: application/x-javascript;charset=utf-8" );
 
et l'appel se fait classiquement pour les JS:
<script type="text/javascript" src="javascript.php" charset="utf-8"></script>
 
Je voudrais savoir si quelqu'un connait une solution pour minifier ce genre de script.
 
Autre question, comment minifier le code html envoyer par Apache (je peux poster cette question dans la partie php au besoin)?
 
Merci

mood
Publicité
Posté le 24-10-2010 à 18:49:33  profilanswer
 

n°2031859
flo850
moi je
Posté le 24-10-2010 à 19:00:11  profilanswer
 

1/ non iminifiable sans risque  
2/ gzip ne suffit pas ?

n°2031860
ksss
Posté le 24-10-2010 à 19:22:22  profilanswer
 

Salut,
 
Merci pour cette réponse rapide!
 
Pour le gzip je fais ça à la volée avec ob_start('ob_gzhandler'); mais jme dit qu'en minifiant ça irait encore plus vite (?? -Je ne suis pas expert ceci dit- ). Je cherche à gagner des ms partout où je peux.  
S'il y a mieux comme méthode faut pas hésiter à me dire.  
 
Après ce que tu me dit, je pense à copier les parties de code js dans un fichier séparé, les minifier et les recoller dans le javascript.php en gardant les opérations php inchangées. qu'en penses-tu ?
 
Si non, question du même ordre, quand on affiche la source d'une page google, le code html et js est minifié; une idée de comment ils font ça ?
 
 :jap:  

n°2031904
philippe06
Posté le 24-10-2010 à 22:09:13  profilanswer
 

Faut voir à quel point ton JS est "dynamique".  Il est tjrs possible de minifier un JS avec des paramètres en dur et d'aller regarder dans le code minifié pour y planter des <?=$bidule?> aux bons endroits.  
 
Une autre solution, plus propre, serait de minifier "à la volée", en faisant des appels vers yuicompressor ou en utilisant une solution 100% PHP comme minify ( http://code.google.com/p/minify/ ). Un système de cache ne sera pas de trop.


---------------
Aimer les femmes intelligentes est un plaisir de pédéraste. (Charles Baudelaire) - Vous vulgarisez :o (Jean-Kevin Dubois)
n°2031931
flo850
moi je
Posté le 25-10-2010 à 09:35:16  profilanswer
 

tu gagnera plus en essayant de regrouper tes ficheirs js en un seul ( idem pour les css) , histoire de limiter le nombre de requete
pour les images, passe par des sprite css
 
Souvent ce qui limite est la latence réseau plus que le temps de transfert ( a moins que tu n'ai un fichier js de 1Mo )

n°2031947
ksss
Posté le 25-10-2010 à 11:17:52  profilanswer
 

Bien reçu!
 
L'un dans l'autre vos idées se recoupent; je vais regarder du coté de minify et regrouper les scripts à la volée. Reste à ésperer que ce soit pas trop gourmand en ressources.
 
Par contre, à introduire un système de cache sur les JS dynamiques supprime le dynamisme le temps de la mise en cache, nan ?

Message cité 1 fois
Message édité par ksss le 25-10-2010 à 11:23:31
n°2031959
philippe06
Posté le 25-10-2010 à 11:45:54  profilanswer
 

flo850 a écrit :

tu gagnera plus en essayant de regrouper tes ficheirs js en un seul ( idem pour les css) , histoire de limiter le nombre de requete
pour les images, passe par des sprite css
 
Souvent ce qui limite est la latence réseau plus que le temps de transfert ( a moins que tu n'ai un fichier js de 1Mo


C'est possible, mais la minification fait parti des meilleures pratiques selon Google et Yahoo, donc apportent un plus potentiel pour le référencement naturel, donc c'est tjrs un plus pour un site web, même si ca ne fait pas gagner grand chose  [:sonken]


---------------
Aimer les femmes intelligentes est un plaisir de pédéraste. (Charles Baudelaire) - Vous vulgarisez :o (Jean-Kevin Dubois)
n°2032072
gatsu35
Blablaté par Harko
Posté le 25-10-2010 à 17:42:38  profilanswer
 

ksss a écrit :

Bien reçu!
 
L'un dans l'autre vos idées se recoupent; je vais regarder du coté de minify et regrouper les scripts à la volée. Reste à ésperer que ce soit pas trop gourmand en ressources.
 
Par contre, à introduire un système de cache sur les JS dynamiques supprime le dynamisme le temps de la mise en cache, nan ?


tes fichiers JS ne devraient aucunement porter l'extension .php surtout s'ils contiennent des fonctions, cela signifie que ce n'est pas du tout optimisé.
 
Tu devrais juste avoir 1 fichier js qui contient une extension .php mais ce fichier JS serait un fichier de paramètres :  
 

Code :
  1. var Global = {
  2.    parammachin : <? echo $mavar ?>,
  3.    paramtruc : <? echo $mavar ?>
  4. }


 
ensuite dans tes fichiers JS tu appelles tes variables Javascript :  

Code :
  1. if(Global.parammachin=='pouet') {
  2. }


 
ainsi tu auras des fichiers JS qui ne contiennent que du JS que tu pourras compresser à loisir.


---------------
Blablaté par Harko
n°2032128
ksss
Posté le 25-10-2010 à 22:36:38  profilanswer
 

Très vrai ce que tu dis, je n'y avait même pas pensé! Et dire que je galérais avec Minify pour les faire passer alors que la solution était bien plus simple...
 
Voici donc le problème des minifications solutionner; je vais faire tout ça localement avec Yui, comme d'hab, et limiter l'usage CPU.
 
Par contre je cherchais en parallèle une solution optimale pour combiner les scripts js et css sans passer par minify qui, euh, minifie, alors qu'ils le sont déjà. Ça serait bien comme le suggère flo850 pour limiter les requêtes (jamais fait jusqu'ici   :whistle:  ), mais je ne connais pas de librairie éprouvée qui fasse ça (gzipper en plus, comme minify, à la limite, mais qui ne compresse pas en plus). Si quelqu'un(e) connait ?
 
Thanks y'all.
 :jap:

n°2032792
ksss
Posté le 28-10-2010 à 11:57:00  profilanswer
 

Encore moi, toujours en quête d'optimisation.
 
J'ai un souci avec mes css et js que je tente de mettre en cache, sans succès.
Pour limiter les requêtes http, j'ai crée deux scripts php que j'appelle et qui vont à leur tour faire respectivement les includes des js et des css. Cette opération se passe bien. Par contre pas moyen de les garder en cache; ils sont téléchargés à chaque fois.
 
J'aurais besoin de votre aide pour savoir où je me trompe.
Voici le code simplifié:
 
css:

Code :
  1. Header("Cache-Control: must-revalidate" );
  2.  
  3.     $duree=86400/24; //je test avec un cache d'une heure avec comme objectif en ligne des les garder 48h ;
  4.     $ExpHeader = "Expires: ".gmdate("D, d M Y H:i:s", time()+$duree)." GMT";
  5.  
  6. Header($ExpHeader);
  7.  
  8. header("Content-type: text/css; charset=UTF-8" );
  9. ob_start('ob_gzhandler');
  10.  
  11.     foreach($css_tab as $css){
  12.         require_once $css;
  13.     }
  14.     
  15.     


 
idem pour les js:

Code :
  1. Header("Cache-Control: must-revalidate" );
  2.  
  3.     $duree=86400/24;
  4.     $ExpHeader = "Expires: ".gmdate("D, d M Y H:i:s", time()+$duree)." GMT";
  5.  
  6. Header($ExpHeader);
  7.  
  8. Header("content-type: application/x-javascript;charset=utf-8" );    
  9. ob_start('ob_gzhandler');
  10.  
  11.     foreach($js_tab as $js){
  12.         require_once $js;
  13.     }
  14.     
  15.     


 
Merci.

mood
Publicité
Posté le 28-10-2010 à 11:57:00  profilanswer
 

n°2032819
MonsieurY
Posté le 28-10-2010 à 13:45:04  profilanswer
 

Personnellement je te conseille d'utiliser Ant.
C'est un outil de build utiliser principalement dans le monde Java (comme Maven ou Make pour C/C++ et Rake pour Ruby).
Il est simple à aborder et très souvent intégré dans les IDE comme Netbeans et Eclipse.
 
En utilisant Ant tu peux facilement :
- concatener tes fichiers en un seul
- le minimifier
- générer une documentation avec un outil approprié (ex : jsdoc-toolkit via Rhino)
- faire tourner des tests unitaires (la encore Rhino est ton ami)
- utiliser un préprocesseur (pour générer un script de débug et un de production par exemple) (http://code.google.com/p/js-build-tools/wiki/AntTasks#preprocess)
- uploader vers un ftp
- commiter vers un cvs/svn ou autre
 
http://ant.apache.org/
 
Sinon pour minimifier de l'html tu peux commencer par lire ça pour obtenir quelques bonnes pistes :
http://perfectionkills.com/experim [...] -minifier/
http://perfectionkills.com/optimizing-html/#tools


Message édité par MonsieurY le 28-10-2010 à 13:56:41
n°2033006
ksss
Posté le 29-10-2010 à 01:08:59  profilanswer
 

Salut,
 
Merci pour l'info, jregarderai ça attentivement plus tard; toujours un plaisir de découvrir de nouvelles solutions!
 
Mais plus spécifiquement, une idée de ce qui empêche mes scripts/css d'être gardés en cache avec la méthode que j’applique?

n°2033037
MonsieurY
Posté le 29-10-2010 à 10:23:06  profilanswer
 

Aucune idée, mais bon pour moi c'est plus un faux problème car packager les ressources statiques devrait toujours être fait à la publication (build) de l'application et jamais en ligne par la plateforme d'exploitation.

n°2033065
ksss
Posté le 29-10-2010 à 12:03:29  profilanswer
 

... C'est bon, j'ai trouvé...
j'ai fait comme indiqué ici:
http://stackoverflow.com/questions [...] ript-files


Message édité par ksss le 29-10-2010 à 13:28:57
n°2033092
MonsieurY
Posté le 29-10-2010 à 13:32:40  profilanswer
 

Bah si tu utilise Ant, ca ne devient pas plus galère de générer toutes les combinaisons puisque le but principal de Ant est d'automatiser ce genre de tâches.
Au lieu d'automatiser la concaténation sur le serveur tu l'automatise en local et tu refais une build à chaque modif qui te régénère tout.
 
Mais par contre je ne suis pas trop partisan de ton approche, tu ne devrais pas agglomérer la base de commune de code avec les éléments spécifiques à une ou peu de page : en faisant ça tu rends impossible la mise en cache côté client et à chaque page avec un script spécifique tu fais retélécharger tout le code au client.
 
Tu devrais avoir :
- un script principal, base commune de la plupart de tes pages
- des scripts satellites spécifiques à une ou quelques pages
 
Si tes scripts satellites sont très courts tu peux aussi envisager de les agglomérer ensemble même si ça fait télécharger un peu de code inutile.

n°2033140
ksss
Posté le 29-10-2010 à 15:16:38  profilanswer
 

salut,
 
C'est exactement ça en fait; j'ai pas développé mais il y a effectivement un script principale qui lui est chargé en cache sans problème. J'avais restreint ma question au cas des scripts satellites. Mais si ant facilite les mises à jour en gardant en mémoire des sortes de "dépendances à recompiler" en quelques clics, jvais sérieusement me pencher dessus. En tout cas merci de me le faire découvrir!
 
 :jap:  

n°2033155
gatsu35
Blablaté par Harko
Posté le 29-10-2010 à 15:52:35  profilanswer
 

De toute facon un fichier JS n'a pas a être dynamique, dans ce cas comme je l'ai dit plus haut, tu as des variables pour configurer ton JS et ensuite ton JS statique s'occupera du reste


---------------
Blablaté par Harko
n°2033217
philippe06
Posté le 29-10-2010 à 21:29:06  profilanswer
 

MonsieurY a écrit :

Aucune idée, mais bon pour moi c'est plus un faux problème car packager les ressources statiques devrait toujours être fait à la publication (build) de l'application et jamais en ligne par la plateforme d'exploitation.


Avec les mécanismes de cache qui existent aujourd'hui, pourquoi se priver?


---------------
Aimer les femmes intelligentes est un plaisir de pédéraste. (Charles Baudelaire) - Vous vulgarisez :o (Jean-Kevin Dubois)
n°2033259
MonsieurY
Posté le 30-10-2010 à 12:10:52  profilanswer
 

philippe06 a écrit :


Avec les mécanismes de cache qui existent aujourd'hui, pourquoi se priver?


 
- Limiter la charge CPU à la génération (anecdotique grâce au cache je te l'accorde)
- Eviter d'exécuter un script php à chaque requête vers une ressource statique (script qui vérifiera le cache et au besoin fera la génération)
- Se prémunir contre tout problème qui pourrait arriver lors de la génération : aucun risque que la ressource soit inaccessible sur le serveur puisqu'on l'a déjà généré avec succès
- Eviter de maintenir différents scripts de génération qu'on devra peut être mettre à jour selon les changements de conf et de version d'apache/php
- Ant est plus pratique, tu n'as pas besoin de compresser tes scripts un par uns via yuicompressor puis les uploader puis les faire concatener par le serveur : tu fais tout simplement F6 sur netbeans et cela te concatène, compresse et upload tout tes scripts en une fraction de seconde
- Ant reste plus flexible, comme je l'ai dit plus haut tu peux tout faire (génération de doc, linteur, tests unitaires, préprocesseur, upload, commit suv un VCS, etc) et vu que c'est un outil spécifique tu as déjà énormément d'outil déjà développés. Tu as juste à écrire le fichier xml qui pilote ton processus.
 
L'appel à un cache serveur est une solution qui ne devrait être mise en place que quand c'est nécessaire : c'est à dire quand les ressources sont dynamiques.


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  YuiCompressor (ou autre) et javascript.php ?

 

Sujets relatifs
Problème de formulaire javascript validationsystème de popup javascript
Tester l'existence d'une classe en javascript mootoolsModification diaporama panoramique javascript
[JavaScript] Pb compatibilité avec Chrome (page vierge affichée)demande d aide pour integration de javascript sur blog
gwt et javascript[Javascript] Tableau de fonctions et Array.prototype
Javascript dans une iframecomment lire tableau html en javascript ?
Plus de sujets relatifs à : YuiCompressor (ou autre) et javascript.php ?


Copyright © 1997-2018 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR