Optimizar las páginas javascript con PHP

Hace un par de días estuve hablando con miembros de mi equipo de trabajo sobre ¿Cómo hacer que una web cargue mas rápido?, hoy he leído un artículo sobre un colega (Alexis Cardenas) en donde habla sobre como optimizar las webs a manera de código que básicamente se fundamentaban en dos cosas:

  • Hacer código javascript mas optimo, reducido, etc…
  • Hacer que la programación en php sea optima igualmente

Ahora yo quiero mostrar herramientas adicionales para hacer que un sitio cargue mucho más rápido.

  1. Utilizar algun compresor para el código javascript, el más popular es YUI Compressor pero en la web hay una gran lista de ellos, aquí dejo el nombre de algunos otros importantes: Packer, Crunchy, JSCruncher, Dojo ShrinkSafe
  2. Para comprimir una página web donde puedes ejecutar PHP colocas al inicio del archivo:
    <?php ob_start(«ob_gzhandler»); ?>
    y luego, despues de cualquier codigo PHP ponemos: <?php ob_end_flush(); ?>
  3. Para el CSS y el JAVASCRIPT, en el archivo .htaccess agregamos lo siguiente:
    AddHandler application/x-httpd-php .css .js php_value auto_prepend_file /home/… RUTA LOCAL …/public_html/gzip-start.php php_value auto_append_file /home/… RUTA LOCAL …/public_html/gzip-end.php
    En el archivo gzip-start.php ponemos: <?php ob_start(«ob_gzhandler»); ?>
    y en el archivo gzip-end.php ponemos: <?php ob_end_flush(); ?>

Esto ayuda al tiempo de carga debido a que ahorrando tiempo al transferir los archivos se ahorran recursos de CPU y RAM y al transferir menos información el cliente puede mostrar la web mucho mas rápido.

Usar mootools y jQuery al tiempo

Luis Carlos, uno de los programadores de mi grupo encontró en jQuery la solución a un efecto que necesitábamos realizar para Bubok, el me ha mandado por correo el demo para yo aplicarlo a la nueva funcionalidad que estaba desarrollando pero cuando termine todo y voy a aplicar el efecto que necesitaba (un carrusel de imagenes) me he topado con que mootools y jQuery tienen funciones que se llaman iguales por lo tanto generan conflicto, tratando de solucionar esto me he tardado gran parte de la mañana hasta que Luis Pallares, quien es un nuevo miembro del equipo, me dio la solución al problema, y es muy sencillo… lo que hay que hacer es una vez incluido el paquete jquery.js debemos agregar la siguiente linea de código:

jQuery.noConflict();

Una vez agregada esta linea de código ya jquery no accede a los objetos de la forma $(‘id_objeto’) sino jQuery(‘id_objeto’), y listo, problema solucionado 🙂

Calcular cambio de divisas

Resulta que desde el primero de enero de 2008 estoy pendiente al cambio de divisas casi que a diario, la que me interesa es de EUR a COP. El hecho aquí es que yo siempre escribía en el buscador de google «eur to cop» y ya obtenía el cambio de esta divisa, así que google es una buena herramienta para eso, ustedes pueden escribir el código de la divisa origen y la destino y Mr. Google les da el respectivo cambio del momento.

Resulta que un día Bubok necesitaba implementar un script que nos mantuviera actualizado el valor de la divisa en la base de datos cada cierto intervalo de tiempo. Fue allí donde Luis Carlos, un programador de mi grupo de desarrollo, encontró una forma de obtener estos valores de cambio gracias a que yahoo decidió compartir su información con la Internet.

La url para obtener un archivo .cvs es esta:

http://finance.yahoo.com/d/quotes.csv?e=.csv&f=sl1d1t1&s=EURCOP=X donde EURCOP es la divisa origen y la divisa destino respectivamente.

Ahora el código PHP que encontró Luis para obtener la razón de cambio de las divisas es muy sencillo, lo copio a continuación:

$url = ‘http://finance.yahoo.com/d/quotes.csv?e=.csv&f=sl1d1t1&s=EURCOP=X’;
$handle = @fopen($url, ‘r’);
if ($handle) {
$result = fgets($handle, 4096);
fclose($handle);
}
$array = explode(‘,’,$result);

Entonces se tiene que el valor de cambio en $array[1]

Espero que a alguien mas le sirva 🙂