Acelerar carga web con PHP
Enero 25, 2008Como algunos ya se habrán dado cuenta, este blog ha estado cargando cargando lento en los últimos días. Esto se debe a que el servidor donde me hospedo está realizando una actualización masiva de servidores MySQL. Debido a esto, estuve tentado a sacar del aire mi sitio por unos días, ya que lo que más odio es la carga lenta de una web. Pero pensé: “Mejor busco la manera de optimizar mi sitio”. Y en eso ando últimamente.
Andaba merodeando por el blog de unijimpe y me encontré en la portada con una clase en PHP escrita por Leon Chevalier de Acid Drop, que permite acelerar la carga de nuestra web al unir y comprimir los archivos CSS y Javascript asociados a nuestro web.
¿Cómo se acelera la carga?
Para acelerar la carga de una web hay varios puntos a tener en cuenta:
- Menos peticiones HTTP, es decir cargar menos archivos asociados a un web.
- Agregar headers indicando que los archivos estáticos expiran en el futuro.
- Utilizar compresión Gzip los elementos estáticos de una página.
- Optimizar el tamaño de los CSS, Javascript y el HTML, por ejemplo eliminando espacios en blanco y saltos de línea en el código.
Todos estos criterios están implementados mediante la clase class.compressor.php la cual pueden descargarla en: Improve website load time by 500% with 3 lines of code (actualización del script). Hay que tener en cuenta que esta clase funciona con PHP 4 y si deseas utilizar la compresión de Javascript es necesario PHP 5.
Utilizando la Clase
El uso de esta clase es muy sencillo, lo primero es adjuntar la clase al inicio de nuestra página y luego crear una instancia del objeto compressor de la siguiente forma.
require_once(‘class.compressor.php’); //Incluir la ruta completa de la ubicación de la clase
$compressor = new compressor(‘css,javascript,page’);
El segundo paso es colocar al final de la página una llamada al método finish el cual ejecuta la compresión necesaria, esto de la forma:
$compressor->finish();
Entonces si por ejemplo tenemos una determinada página que carga varios Javascript y un css incluyendo la clase para comprimir tendríamos el siguiente código fuente:
<?php
require_once(‘class.compressor.php’);
$compressor = new compressor(‘css,javascript,page’);
?>
<html>
<head>
<title>Ejemplo de class.compressor.php</title>
<link href=”styles.css” mce_href=”styles.css” rel=”stylesheet” type=”text/css”>
<script type=”text/javascript” src=”js/mootools.js” mce_src=”js/mootools.js”></script>
<script type=”text/javascript” src=”js/swfobject.js” mce_src=”js/swfobject.js”></script>
<script type=”text/javascript” src=”js/functions.js” mce_src=”js/functions.js”></script>
</head>
<body>
<!–código html de nuestra web–>
</body>
</html>
<?php
$compressor->finish();
?>
La implementación es bastante sencilla, como pueden ver. Ahora falta ver resultados verdaderos.
Uso de la clase en Wordpress
Debido a que la estructura de Wordpress es simple pero complicada a la vez, recomiendo que primero creen una carpeta dentro del directorio raiz de Wordpress. Por ejemplo, “clase”.
Suban el fichero y las librerías de la clase a ese directorio, y otorguen permisos de escritura al directorio. Esto último es muy importante para el correcto funcionamiento de la clase.
/*NOTA*/ Esto puede ocasionar problemas de seguridad, así que tengan cuidado al implementar este proceso.
Ahora editen el archivo del encabezado de su plantilla (header.php) agregando las 2 líneas para la llamada a la clase y la creación de la nueva instancia antes de la etiqueta <HTML> o la cabecera <!DOCTYPE>. No olviden modificar la ruta de acceso al archivo.
<?php require_once(‘./clase/class.compressor.php’); //Incluir la ruta completa de la ubicación de la clase
$compressor = new compressor(‘css,javascript,page’); ?>
Guarden los cambios y ahora abran el archivo para el pié de página (footer.php) o el correspondiente donde se cierre la etiqueta </HTML>. Justo después del cierre incluyan la línea <?php $compressor->finish(); ?> y guarden cambios.
Pueden hacer pruebas usando Firefox y el add-on Firebug antes y después de implementar la clase para ver las diferencias de tiempo.
Según la página del autor, esta clase puede mejorar la carga del sitio hasta en un 500%.
Resultados
En las pruebas realizadas en este blog, sí hubo una mejora en el tiempo de carga y ejecución de consultas a la base de datos, aunque tampoco fueron resultados verdaderamente sorprendentes.
Antes de incluir la clase, realicé 10 refresh a la página “Acerca de“, por su poco contenido y ninguna dependencia de archivos de otro sitio.
Los resultados mostraron un promedio de carga del sitio de 8.346 segundos y 2.666 segundos para las consultas a la base de datos.
Después de incluir la clase hubo cierta mejora. El promedio de carga del sitio bajó a 5.185 segundos y las consultas también descendieron a 1.664 segundos.
Según los resultados, el rendimiendo del sitio mejoró ligeramente. El tiempo de carga se redujo a sólo un 62.125% y las consultas a la base de datos a un 62.415%.
Osea que las mejoras fueron de un 37.874% y 37.584%, respectivamente.
No es un 500%, pero es algo.
Descarga
La versión 0.3.1 de la clase la puedes descargar directamente de aquí:
aciddrop website speedup v0.3.1.
La información del autor la encontrarás en este enlace:
Boost your website load time with 3 lines of code.
Las actualizaciones al script las encontrarás aquí:
Site speed boost script updated.
Ya hay 1 comentario... en “
Acelerar carga web con PHP ”
También podrias “descargar” un pokito tu web.. ! tanto icono y tanta xorrada kobra!! XD deja solo el de k se folla la oveja y el meon, tengo k probar esto k has dicho haber como tira!
saluds !
Enero 26, 2008 @ 6:40 AM (UTC -6) - [Citar]