Optimizar las páginas javascript con PHP

por | Nov 25, 2009 | PHP, Trabajo

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

por | Oct 17, 2009 | Trabajo

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 🙂