All in one (js & css)

Azi, în timpul unei „ședințe” de optimizare a unui blog la care am lucrat în ultima săptămână, s-a pus problema de a reduce la minim numărul de requesturi. De fapt eu am pus problema :)

Cum fișierele javascript au rămas singurele cu un număr mai mare de 1, cea mai la îndemână soluție a fost folosirea unui mic script php:

<?php header("Content-type: text/javascript");ob_start("ob_gzhandler");
$files = array(
	'jquery-latest.min.js',
	'ui.js',
	'script.js'
);
foreach($files as $file){
	include_once $file;
}
ob_flush();
&#91;/php&#93;

Am salvat script.php în folderul &#91;acro js&#93; din tema de wordpress în cauză (voi da și linkul când va fi gata) și am purces la editarea <code>functions.php</code>:


if(!is_admin()){
	wp_deregister_script('jquery');
	wp_register_script('jquery', (get_bloginfo('stylesheet_directory').'/js/js.php'), false, '1.3.2', false);
	wp_enqueue_script('jquery');
}

Ce se întâmplă?

  1. Dacă nu este admin, ștergem bindul default pentru jQuery (care este prin wp-includes/js/jquery);
  2. Definim din nou jQuery, precizând path-ul spre scriptul de mai sus;
  3. Re-binduim jQuery, astfel încât să poată fi folosit de alte plugin-uri.

În acest fel, ai în același fișier toate fișierele externe. Cu puțină îndemânare (care, drept să-ți spun, îmi cam lipsește în cazul PHP) poți include diferite fișiere, în funcție de ce pagină accesezi (de exemplu, poate nu ai nevoie de ui.js decât pe prima pagină) șamd.

Dar pentru CSS?

Poți face același lucru și pentru CSS dacă schimbi Content-type în text/css.

2 Comentarii to “All in one (js & css)”

  1. O alta metoda ar fi sa pui pe toate intr-un singur fisier (cat mai putine request-uri), mai ales ca ele sunt deja “minifycate” (jquery si jquery.ui) si in .htaccess punem regula urmatoare:

    SetOutputFilter DEFLATE

    Toate bune.

  2. Eu nu as incarca toate fisierele .CSS/JS in layout fara vreo conditie. La aplicatii mici cred ca e ok. Ceva mai sus, o sa ai fisiere pe care trebuie sa le incarci doar pentru pagina de detalii, sau chestii de genul.

    Imi place ideea de a avea in layout ceva ifuri gen :

    if(isset($load_js_gallery)):
    blabla incarca

    iar din Controller la actiunea show()/details() sau cum o ai, ii trimiti $data[‘load_js_gallery’] = 1;

    cativa kb in plus conteaza, zic eu. :-)

Show trackbacks

Ți-a plăcut articolul? Lasă un comentariu!

You can insert code snippets using BBcode:
[js].[/js] [html].[/html] [php].[/php] [css].[/css]
You can also use some HTML tags:
<blockquote>.</blockquote> <code>.</code> <a href="">.</a> <strong>.</strong> <em>.</em>

windows apple dropbox facebook twitter