2013-07-30 Comprimes el HTML, el CSS y el Javascript de tu tienda online (1)

¿Comprimes el HTML, el CSS y el Javascript de tu tienda online?

Una de nuestras máximas obsesiones en el desarrollo de las tiendas online de nuestros clientes es la velocidad de carga y la optimización del código. Para nosotros es de vital importancia que el código que desarrollamos tenga la máxima eficiencia.

Por eso hoy me gustaría escribiros sobre una de las cosas que más trabajo nos ha llevado a lo largo de mucho tiempo y que ahora podemos decir que lo tenemos controlado. Gracias a esto, todos nuestros clientes se pueden beneficiar  de ello y pueden decir que son de los pocos que pueden disfrutar de este completa característica.

Todas las tiendas online que desarrolla liveCommerce llevan de serie la compresión del HTML, CSS y Javascript.

Para el ejemplo de este artículo podéis fijaros en uno de nuestros últimos proyectos, desarrollado con el máximo cuidado y cariño posible: INKPRIME

Si veis el código fuente os daréis cuenta que está completamente comprimido. Si utilizáis el inspector de Firebug podréis ver como solo cargamos un archivo CSS el cual contiene todos los estilos que la tienda online necesita cargar, al igual que los archivos Javascript.

Esto, hace que INKPRIME obtenga una nota del Google Page Speed de un 94% y de un 82% del YSlow de Yahoo. Dejo aquí el enlace del examen de optimización:
http://gtmetrix.com/reports/www.inkprime.com/WAvW2EtL

Nuestro objetivo es conseguir un 100% de optimización, para ello deberemos mejorar el tiempo de respuesta de nuestros servidores y optimizar las imágenes.

¿Cómo se hace?

Existen muchas formas de hacerlo. Voy a contaros la que utiliza la plataforma liveCommerce.

Al ser un software completamente modular los archivos relacionados con la presentación de la tienda están clasificados en carpetas que vienen a ser cada uno de los módulos. La programación modular facilita enormemente el desarrollo de software y al mismo tiempo genera más cantidad de archivos.

Más archivos como por ejemplo los estilos CSS que debemos juntarlos uno por uno para luego comprimirlos y finalmente mostrarlos en un archivo comprimido.

Utilizamos lenguaje de servidor para eliminar los espacios y saltos de línea que son innecesarios para la lectura del navegador y conseguimos un archivo de una sola línea que contiene todos los estilos de los archivos CSS de cada módulo.

Lo mismo hacemos con los archivos Javascript, con la dificultad añadida, de que al ser un lenguaje de programación cualquier error en la separación de un “punto y coma” se ve comprometido en la compresión.

¿Es realmente importante el trabajo de optimización?

La pregunta que nosotros nos hacemos es:
¿Para el usuario es importante la velocidad de carga?
Y la respuesta todos la sabemos. Claro que sí!

Yo mismo salgo de una página que tarda más de 5 segundos en cargar. No me interesa leer nada de una página que no se preocupa por el tiempo de respuesta que le da a sus usuarios.

No me interesa leer nada de una página que no se preocupa por el tiempo de respuesta que le da a sus usuarios

Somos exigentes por naturaleza, y si la velocidad de carga es importante para los usuarios de Internet, lo es también para Google.

¿Y tu ecommerce tiene comprimido el HTML, CSS y Javascript?
¿Nos lo enseñas?

Sigue leyendo