En el momento de analizar la performance de nuestro sitio puede ser útil Helium, un JavaScript que permite obtener un informe detallado sobre los estilos que se están utilizando (o no) en una o más páginas.

Hace un tiempo había conocido a CSS Usage, una extensión para Firebug que permite realizar el mismo trabajo, sin embargo esta ya no es mas actualizada.

Nuevamente, en el marco del Velocity 2011, Nicole Sullivan y Nicholas Zakas presentaron CSS Lint, una herramienta para detectar errores en código CSS. La misma, en base a distintas reglas, analiza el archivo de entrada para otorgar una serie de recomendaciones útiles. Ver el listado de reglas.

Sin embargo, desde mi punto de vista es muy difícil analizar algo si no se tiene en cuenta el contexto de la aplicación (en este caso, el HTML que lo conforma, las tecnologías utilizadas, funcionalidades externas…), además que existen algunas advertencias un poco pretenciosas (¿Don’t use IDs in selectors?).

Habrá que ver como evoluciona la herramienta, creo que aún le faltan opciones importantes (nivel de análisis, selección de reglas, etc), pero en principio, y siempre teniendo en cuenta lo que comentaba, me parece útil para detectar errores que se nos pueden pasar o replantear como estamos escribiendo nuestros estilos.

Por otro lado, todo el código de la aplicación está disponible en GitHub por lo cual seguramente su evolución será bastante rápida.

Y si les interesa utilizarla para si mismos, existe también una versión disponible por linea de comandos a través de Node.js / Rhino.

Varios anuncios interesantes se están dando en el Velocity 2011, la conferencia más importante sobre rendimiento y optimización de sitios.

Entre los más destacados, la nueva versión de YSlow, pensada para utilizar en móviles a través de un bookmarklet (notar el detalle de como cambia la URL del sitio para hacer más fácil el guardado del marcador).

Como se ve en la captura, la interfaz no esta optimizada para ser utilizada en móvil pero igualmente posee gran parte de las características que existen en las versiones para Firefox/Chrome.

Me gustó Book of Speed, un libro abierto (repositorio en GitHub) sobre la optimización de sitios web. Actualmente posee completos 5 capítulos de los 9 en total, así que habrá que seguirle la evolución.

Hace un tiempo hablé de SmartSprites, una aplicación que permite generar CSS sprites muy fácilmente.

Spritemapper es una herramienta que realiza el mismo trabajo de una manera similar: Tan solo hay que incorporar un par de comentarios en el CSS indicando algunos parámetros y luego la aplicación se encarga del resto, concatenando las imágenes y generando un archivo .css con los nuevos estilos.

Algo que no me convence de Spritemapper (y que SmartSprites lo permite hacer) es la posibilidad de descriminar entre imágenes (por ejemplo: en un CSS podemos tener imágenes que queremos concatenar en una sola, pero otras que no (como un patrón que se repite)).

Me gustó Holmes.css: permite de forma rápida y sencilla detectar errores en nuestra página:

• Elementos obsoletos (ejemplos: strike, font, center…);
• Elementos con atributos erróneos (imágenes sin alt, enlaces sin href, label sin for…);
• Espacios vacíos;
• Y más

Para utilizarlo, debemos incorporar el archivo .css de la herramienta en nuestro sitio ó utilizar su bookmarklet (haciendo aún más sencillo el proceso). Repositorio en GitHub

Nueva versión de YUI Compressor. Lo más interesante de este lanzamiento es la posibilidad de comprimir archivos por lotes (aunque si lo usas en conjunto con ANT podes comprimirlos y concaternarlos muy fácilmente).

HTTP Archive es un interesante proyecto de Steve Souders, el cual tiene como objetivo recopilar de forma histórica y constante el desempeño web y las tendencias de los mayores sitios de internet.

En el sitio es posible obtener información muy precisa sobre como están construidos los sitios, velocidades y tecnologías utilizadas tanto en términos generales como particular, ideal para trabajos de análisis e investigación. Ninguna de sus secciones tiene desperdicio.

El proyecto es de código abierto y toda la información que se va recopilando es descargable.

Actualización: Parece que hoy es un día con novedades en temas de optimización de sitios, ya que Google anuncia Page Speed Online, una herramienta igual que la extensión para Firefox/Chrome, pero online y con soporte para analisis de sitios moviles.

Una de mis extensiones favoritas en Firefox, ahora también para Google Chrome (en versión beta).