Funzione per caricare css in modo selettivo

18 contenuti / 0 new
Ultimo contenuto
Funzione per caricare css in modo selettivo

Ciao a tutti,

sto cercando di ridurre le richieste http di un sito drupal e vorrei affrontare il discorso degli innumerevoli file css inutili che spesso ll nostro amato CMS carica su tutte le sue pagine (ma che sono utili spesso solo nel back-end o in area amministrativa).

Sto cercando quindi una funzione di preprocessore (template.php) per ottenere qualcosa di simile a questa funzione.

Lo scopo è gestire con soli DUE file page.tpl due template di base dove su uno per poter caricare TUTTI i css (per le pagine "admin" "user" "node/add" e "node-edit" con la variabile "$styles" immutata) e sull'altro solo i css da me selezionati.

In alternativa sarebbe ottimo anche un ovverride di $styles (sempre tramite preprocessore) per utilizzare un template solo.

QUalcuno ha già utilizzato soluzioni simili? Il tutto per Drupal 6.

Grazie, ciao!

Invece di fare quello, dopo che hai sviluppato il sito poi usare le funzioni di prestazioni per ridurre il CSS e JavaScript a due file solo. Vai in admin/settings/performance/default spunti 'Attivato' sotto le voci 'Ottimizza i file CSS' e 'Ottimizza i files JavaScript' ed il gioco è fatto...

Più imparo, più dubito.

Si si, quelle le conosco... anzi stavo pensando anche a qualcosa di più tosto tipo "boost" o "cache router" ma volevo in ogni caso cercare di limitare il rendering di codice inutile nella pagina (o almeno ridurlo il più possibilie).

Ciao!

Con Boost puoi mandare i file gzippati (altro 50% di risparmio, circa). Se non hai proprio tonnellate di codice (vedo sul mio sito CSS 40KB e JS 90KB) non sarà un problema.

Gli immagini sono più di un problema per bandwidth. I browser moderni leggono quei quantità di CSS e JS abbastanza rapidamente (millisecondi), così io non mi preocuperei.

Ovviamente se hai tanti visitatori può diventare un problema - ma fasciamo la testa quando è rotta.

Più imparo, più dubito.

jhl.verona wrote:
Con Boost puoi mandare i file gzippati (altro 50% di risparmio, circa). Se non hai proprio tonnellate di codice (vedo sul mio sito CSS 40KB e JS 90KB) non sarà un problema.

Concordo, ma altrettanto perdi la dinamicità del sito, quindi attenzione :)

jhl.verona wrote:
Gli immagini sono più di un problema per bandwidth. I browser moderni leggono quei quantità di CSS e JS abbastanza rapidamente (millisecondi), così io non mi preocuperei.

ms? Scusa, ma su che hosting? :)
Scherzi a parte, è vero che le latenze sono ridotte e che la banda ormai non è più un grande problema, molto meglio ottimizzare altre cose che non qualche kb nei CSS.

jhl.verona wrote:
Ovviamente se hai tanti visitatori può diventare un problema - ma fasciamo la testa quando è rotta.

K.I.S.S. :)

Ciao
Marco
--
My blog
Working at @agavee

jhl.verona wrote:
I browser moderni leggono quei quantità di CSS e JS abbastanza rapidamente (millisecondi), così io non mi preocuperei.

Attenzione solamente al numero di css e IE 7+ : sopra i 27 file non viene letto più nulla, quindi se hai un sito molto articolato devi per forza abilitare le funzioni di prestazione.

M.

--
Michel 'ZioBudda' Morelli -- [email protected]
Sviluppo applicazioni CMS DRUPAL e web dinamiche -- Corsi Drupal -- Amministrazione Drupal -- Hosting Drupal

mavimo wrote:
jhl.verona wrote:
Con Boost ...

Concordo, ma altrettanto perdi la dinamicità del sito, quindi attenzione :)

Boost è molto sofisticato, se aggiorni una pagina, cancella quella pagina dallo cache. Comunque si, un pò come la vita, e difficile avere la moglie ubriaca e la botta piena (frase fatta che non ho mai capito - perchè la moglie, io bevo di più...)

mavimo wrote:
jhl.verona wrote:
...I browser moderni leggono quei quantità di CSS e JS abbastanza rapidamente (millisecondi), così io non mi preocuperei.

ms? Scusa, ma su che hosting? :)

Mea colpa. Intendevo il tempo che il browser fa il parsing e costruisce un abstract syntax tree, non il tempo per scaricare il file - che comunque sarà breve...

Ci sarà un momento quando l'editor rifiuta il nesting dei quote?

Più imparo, più dubito.

ziobudda wrote:
Attenzione solamente al numero di css e IE 7+ : sopra i 27 file non viene letto più nulla, quindi se hai un sito molto articolato devi per forza abilitare le funzioni di prestazione.

A me risolta che sui CSS il limite sia di 31 per IE e non 27, inoltre anche la dimensione dei CSS è fondamentale, sopra il 288kb (vado a memoria, quindi magari controllate) IE collassa.

Ciao
Marco
--
My blog
Working at @agavee

Sbagliato entrambi: è 32 il numero di file massimi. Mentre per la dimensione del singolo CSS è corretto il limit dei 288kb.

M.

--
Michel 'ZioBudda' Morelli -- [email protected]
Sviluppo applicazioni CMS DRUPAL e web dinamiche -- Corsi Drupal -- Amministrazione Drupal -- Hosting Drupal

Grazie, avete indirettamente risposto ad altre mie perplessità sull'argomento!

Intanto, per il problema originale ho trovato una soluzione qui, magari a qualcuno può servire;

nel template.php :

nel mio caso ho riservato l'esclusione ai soli nodi lascianto intatto il resto, compresa modifica, aggiunta ed amministrazione (bisognerà modificare qualcosa si volesse applicarlo anche a tassonomie e views, penso)

function NONEDELTEMA_preprocess(&$vars, $hook){
if (arg(2) =='edit' || arg(1) =='add') {
$back_off = 1;
}
if (arg(0)=='node' && $back_off !== 1)  {
    $css_exclude_list = array(
'node.css',
'defaults.css',
'system.css',
'system-menus.css',
'user.css',
... e di seguito tutti gli altri .css che si vuole escludere dal caricamento
    );
    $vars['styles'] = _phptemplate_get_css($css_exclude_list);
}
}
function _phptemplate_get_css($exclude = array(), $include = array()){
$css = drupal_add_css();
foreach ($css['all']['module'] as $k => $path) {
   $file = substr($k, strrpos($k, '/') + 1);
   if (in_array($file, $exclude)){
     unset($css['all']['module'][$k]);
   }
}
foreach ($include as $file){
   $css['all']['theme'][path_to_theme() .'/'. $file] = true;
}
return drupal_get_css($css);
}

Nota: qualche programmatore PHP può dirmi come semplificare il codice senza utilizzare la varibie di appoggio $back_off, usando in pratica una sola IF ?

Grazie!

PS: per il numero massimo di CSS in IE è stato fatto un modulo apposito: IE Unlimited CSS Loader !

<?php
function NONEDELTEMA_preprocess(&$vars, $hook) {
    if (
arg(0) == 'node' && !(arg(2) =='edit' || arg(1) =='add'))  {
   
$css_exclude_list = array(
     
'node.css',
     
'defaults.css',
     
'system.css',
     
'system-menus.css',
     
'user.css',
    );
   
$vars['styles'] = _phptemplate_get_css($css_exclude_list);
    }
}
function
_phptemplate_get_css($exclude = array(), $include = array()){
 
$css = drupal_add_css();
  foreach (
$css['all']['module'] as $k => $path) {
   
$file = substr($k, strrpos($k, '/') + 1);
    if (
in_array($file, $exclude)){
      unset(
$css['all']['module'][$k]);
    }
  }
  foreach (
$include as $file){
   
$css['all']['theme'][path_to_theme() .'/'. $file] = true;
  }
  return
drupal_get_css($css);
}
?>

Ciao
Marco
--
My blog
Working at @agavee

...azie! ;)

...rego ;)

Ciao
Marco
--
My blog
Working at @agavee

Vi segnalo che, pur funzionando... questo script PHP pare non essere digerito molto bene dalla compressione CSS di Drupal.

Quindi nel caso uno volgiate usarlo per caricare un minor numero di css, dall'altro lato perdete la possibilità di comprimerli.

No, devo verificare meglio ho problemi di server... forse è un falso allarme!

No... penso di dover confermare il problema (strano, perche in origine sebrava un problema di server):

Se riduco con questa funzione il numero dei Css caricati... quando vengono compressi. il ccs "screen" risulta vuoto (paradossale quello "print" no!).

No..!!
ATTENZIONE è un problema della 6.19 (uscita pochi giorni fa!).

Qui il post del forum ufficiale dove viene segnalato anche da altri utenti: il problema è nella funzione di compressione del css.

Mi sembra che siamo tornati al punto di partenza. Il codice che costruisce il CSS/JS compresso deve sapere quale file deve concatenare/comprimere, è questo lo legge dalla lista costruita nel momento che la funzione viene chiamato (di solito in admin/settings/performance).

Nel tuo caso quindi i files che elimini rimangono presente perchè nel file compresso. Quindi niente guadagno. (Mi rendo conto che quello che scrivo non sembra correspondere con quello che hai rilevato empiricamente, ma la funzione pubblicato qui elimina solo CSS del tipo 'all', non tocca quelli 'screen' o 'print')

Forse è sufficiente aggiungere un controllo che non è settato la compressione dei CSS, tipo:

<?php
 
function NONEDELTEMA_preprocess(&$vars, $hook) {
 
$preprocess_css = (variable_get('preprocess_css', FALSE) && (!defined('MAINTENANCE_MODE') || MAINTENANCE_MODE != 'update'));
  if (!
$preprocess_css && arg(0) == 'node' && !(arg(2) =='edit' || arg(1) =='add'))  {
   
$css_exclude_list = array(
     
'node.css',
     
'defaults.css',
     
'system.css',
     
'system-menus.css',
     
'user.css',
    );
   
$vars['styles'] = _phptemplate_get_css($css_exclude_list);
  }
}
?>

...anche se mi sembra di andare nella direzione apposto (cioè complicare affari semplice)

HTH

John

Più imparo, più dubito.