Mejora el rendimiento de tu sitio web Joomla con Amazon CloudFront

Modificado por última vez en Lunes, 09 Septiembre 2013 03:13
(0 votos)

Amazon CloudFront con Joomla

Usaremos Amazon S3, CloudFront y el plugin CDN for Joomla!

Ya sea que acabas de lanzar un nuevo sitio web Joomla o estás manteniendo uno ya existente, tarde o temprano va a buscar la manera de mejorar su rendimiento.

En pocas palabras, querrás que las páginas carguen lo más rápido posible para todos los visitantes de tu sitio. Además, las velocidades de carga son ahora un factor importante en la valoración de los buscadores.

Hay muchos blogs, extensiones y herramientas que abordan los problemas de rendimiento de Joomla, pero una de las maneras más fáciles para acelerar un sitio es entregar imágenes, CSS y otros elementos estáticos mediante una Content Delivery Networks (Red de Distribución de Contenidos) o CDN.

Push vs. Pull

Las CDN son de dos tipos: zonas push y zonas pull. Mientras que una zona de CDN pull se piensa que es un poco menos eficiente que una zona push, esta última requiere mantener y actualizar periódicamente una copia maestra del contenido en un servidor independiente.

Como resultado, la configuración de una zona CDN push es muy complicada y casi siempre requiere más espacio de almacenamiento que una zona CDN pull.

Hoy voy a describir cómo utilizar Amazon CloudFront como zona CDN pull para un sitio web Joomla.

Mide tu rendimiento actual

Con el fin de evaluar la eficacia de nuestra aplicación CDN, debemos estar familiarizados con al menos dos herramientas para medir la velocidad y el rendimiento de nuestro sitio. Te recomiendo las siguientes, pero hay para elegir muchas herramientas gratuitas o de pago.

1. El test Full Page de Pingdom mide el tiempo de carga de la página completa del sitio. Basta con introducir la URL de nuestra web teniendo cuidado en marcar la opción 'Save Test'. De esta manera tendremos un registro del tiempo de carga a medida que avanza.

Antes de continuar, comprueba tu sitio un par de veces esperando de 5-10 minutos entre las pruebas.

2. La otra herramienta que recomiendo para las pruebas de rendimiento es YSlow. Es una herramienta muy versátil de Yahoo que analiza las páginas web en base a reglas de Yahoo para los sitios web de alto rendimiento.

YSlow califica el sitio en varias categorías y calcula una puntuación global. Puedes ver el cambio en la puntuación al implementar un CDN en tu sitio. YSlow está disponible como un add-on para Firefox y Chrome.

addons.mozilla.org/en-US/firefox/addon/yslow/
chrome.google.com/webstore/detail/ninejjcohidippngpapiilnmkgllmakh

Una vez que hayas instalado YSlow, carga tu sitio web un par de veces y anota la puntuación total. Los detalles sobre el uso de YSlow se pueden encontrar en otros lugares.

Elegir un CDN

Una vez que hayas tomado algunas medidas iniciales usando el test Full Page de Pingdom y YSlow, estarás listo para seleccionar un proveedor de CDN. He elegido Amazon CloudFront pero se puede usar cualquier servicio confiable que soporte las zonas pull.

Al elegir un servicio, primero debes mirar las estadísticas de tu servidor y tratar de estimar el ancho de banda mensual. Con esto en mente, comparar los costos debe ser relativamente sencillo.

Por ejemplo, elegí Amazon CloudFront ya que sólo se paga por el ancho de banda que se utiliza. Otros servicios tienden a cobrar al por mayor, independientemente de la cantidad de ancho de banda.

Tendrás que registrarte en Amazon Web Services y activar CloudFront.

La activación puede llevar algún tiempo, así que antes de proceder, espera un correo electrónico de Amazon indicando que tu cuenta está activa y lista para trabajar (En el anterior tutorial de CDN para WordPress explico algo más sobre el tema).

Configurar CloudFront

1. Accede a CloudFront desde la Amazon Web Services Management Console.

2. Crea una distribución de la zona pull para tu sitio haciendo click en el botón "Create Distribution". Se abrirá un asistente emergente de distribución (puedes ver todos los detalles con imágenes en el anterior tutorial de CDN para WordPress).

Asegúrate de que el "Delivery Method" se establece en "Download" y selecciona "Custom Origin". Introduce la URL de tu sitio web en el campo "Origin DNS Name field". Cuando lo hayas completado, la distribución debe ser similar a la siguiente imagen. Haz clic en "Continue" para seguir con el siguiente paso.

origin DNS name

3. En la pantalla de Distribution Details, agrega index.php en "Default Root Object" como se ve en la siguiente captura de pantalla. Asegúrate de que el "Distribution Status" está en "Enabled" y selecciona "Continue" para revisar tu distribución.

CloudFront default root object

4. Cuando estés satisfecho con la configuración, selecciona "Create Distribution". El servicio CloudFront genera ahora un dominio para que puedas utilizarlo. En nuestro ejemplo, el dominio es el siguiente:

d2zvk3vuszux5u.cloudfront.net

5. Antes de continuar, debes esperar a que los servidores CloudFront propaguen el CDN por todo el mundo. Esto por lo general dura unos 15 minutos y el estado de tu distribución cambiará de "In Progress" a "Deployed" en el administrador de CloudFront:

CloudFront distribution básica

Configura tu sitio web Joomla

Con el CDN creado y desplegado, es el momento de aplicar el CDN a los elementos estáticos en tu sitio web.

1. Comienza por descargar CDN for Joomla!

A diferencia de otras soluciones CDN para Joomla, este plugin requiere un proveedor CDN de zona pull.

2. Instala el plugin desde el área administrativa backend de Joomla.

3. Agrega el dominio de CloudFront en los parámetros del plugin como se muestra en la siguiente captura de pantalla y guarda los cambios. Los demás parámetros pueden permanecer en sus valores predeterminados.

plugin CDN for Joomla

4. Asegúrate de que el plugin esté publicado y ahora puedes probar tu sitio mediante la prueba de página de Pingdom y YSlow. Si todo ha ido bien, en teoría, verás mejoras en ambos indicadores.

También puedes examinar el código fuente de la página que estás probando para asegurarte de que las imágenes, CSS, javascript y otros elementos estáticos se sirven desde el dominio de CloudFront.

Cualquier persona que mire el código fuente o el control de la barra de estado de su navegador vería este dominio de CloudFront. Para solucionar este detalle en el próximo tutorial veremos cómo ajustar los registros CNAME de nuestro servidor y mostrar nuestro dominio.

Conclusión

A pesar de que he descrito estos pasos con gran detalle, el proceso es bastante rápido una vez que se haya completado la primera vez. Con la excepción del tiempo requerido para la propagación de la distribución, todo el proceso se puede completar en aproximadamente 5 minutos.

Así que date una oportunidad y comprueba lo fácil que puede ser aumentar significativamente el rendimiento de tu sitio web Joomla mediante la adición de una red de distribución de contenido CloudFront.


Comentarios (5)

This comment was minimized by the moderator on the site

saludos, una pregunta, como coloco la url si el sitio web que quiero aliviar de carga esta en una url: http://www.mipagina.com/portal gracias por la ayuda..

This comment was minimized by the moderator on the site

Hola Copernico,
Yo lo estuve utilizando un tiempo y tampoco vi mejoras sustanciales en la velocidad. Luego, en la ?ltima actualización a Joomla 3.2, lo he inhabilitado. De cualquier forma yo utilic? tambión Amazon S3 para alojar los archivos...

Hola Copernico,
Yo lo estuve utilizando un tiempo y tampoco vi mejoras sustanciales en la velocidad. Luego, en la ?ltima actualización a Joomla 3.2, lo he inhabilitado. De cualquier forma yo utilic? tambión Amazon S3 para alojar los archivos est?ticos del sitio, pero era un engorro porque tenía que subir las im?genes de cada nuevo art?culo (aunque hay aplicaciones que lo sincronizan).
Lo que mejor me ha ido respecto a la velocidad de la página es el plugin http://extensions.joomla.org/extensions/core-enhancements/performance/site-performance/12088 JCH Optimize , pero algunos de los nuevos templates de Joomla ya tienen integrada alguna optimización de CSS y JavaScript as? que deberús ajustar los par?metros de ambos.
Un saludo

Leer más
This comment was minimized by the moderator on the site

Hola Jesús,
Ante todo gracias por el tuto. Tras seguir todos tus pasos de forma correcta (creo) el CDN ha empeorado la descarga de mi página. Ahora me localiza 85 request (cuando antes eran 45) y 4,,82 sg de descarga de pagina (antes 4,14) y un...

Hola Jesús,
Ante todo gracias por el tuto. Tras seguir todos tus pasos de forma correcta (creo) el CDN ha empeorado la descarga de mi página. Ahora me localiza 85 request (cuando antes eran 45) y 4,,82 sg de descarga de pagina (antes 4,14) y un tama?o de 622 K (antes 350). Es eso posible?

Leer más
This comment was minimized by the moderator on the site

Hola Humberto
Tienes que poner en el plugin CDN de Joomla la URL de tu bucket de Amazon S3, luego publicas el plugin y ya est

This comment was minimized by the moderator on the site

Hola Jesus, antes que nada mil gracias por este excelente articulo

Nada mas tengo una duda..En que momento se configuro amazon S3 en el plugin CDN for Joomla?

Muchas gracias

No hay comentarios escritos aquí

Deja tus comentarios

  1. Publicar comentario como invitado. Regístrate o ingresaa tu cuenta
Archivos adjuntos (0 / 3)
Compartir su ubicación
close

Recibe gratis nuestros nuevos artículos!

Serás el primero en conocer las novedades y noticias que pasan en Internet, nuestros tutoriales, trucos y más.

Escribe tu email:

Se abrirá una nueva ventana deFeedBurner a la izquierda de la página y habrás de validar un Captcha.

Lee nuestras Política de privacidad & Política de cookies
Puedes darte de baja de la lista de correo electrónico en cualquier momento