WordPress Plugin: Css Sprites for Google PageSpeed.

por | Sep 6, 2012 | otros, Sin categoría | 0 Comentarios

Estas ultimas semanas he estado trabajando en un plugin para la creacion automatizada de sprites de manera dinamica y desatendida para asegurar una optimizacion correcta de los blogsque usen WordPress.

El plugin ya esta en produccion, puede observar en funcionamiento en este blog. Basicamente lo que hace es convertir todas las imagenes presentes en la pagina en un sprite del cual mendiante CSS lo recorta y posiciona en la web.

Esta practica es fundamental en cualquier blog ya que Google esta poniendo especial interes en la velocidad de carga de la web e inlcuir todas las imagenes en una acelera enormente ese proceso.

Así la imagen que generaria en base a la pagina principal de este blog seria esta:

 

Se puede observar todos los elementos presentes incluidos en el sprite. De hecho haciendo click con el boton derecho sobre esta misma imagen y viendo su codigo html se puede comprobar como no es una tag de  imagen, si no un div con una porcion del sprite asignada.

Css sprite ademas cachea las imágenes generadas para no tener que crearlas cada vez que se carga la pagina ya que es un proceso muy costoso para los servidores. Asi aunque la primera carga sea un poco mas lenta el resto no deberian resentirse en absoluto.

Se usa un algoritmo en casos de las ampliaciones de imágenes para impedir la perdida de calidad asociada al convertir una imagen mas pequeña en una mas grande.

El plugin actualmetne dispone de menu de opciones en el cual se pueden excluir algunas imagenes de su inclusion en el sprite. En casos en los que la imagen es redimensionada a una muy pequeña (por ejemplo 16×16 pixeles) y es importante su resolucion no es recomendable tratarlas como un sprite.

Ademas de información sobre el espacio actual que ocupa la carpeta de cache dispone de un boton para borrar el contenido de la cache.

Ademas de un chequeo planificado que comprueba las imagenes que no se han visto en mas de 7 dias.

La razón de esto es que en algunos blogs donde las imágenes cambien constantemente pueden llegar a crear muchos archivos, los mas antiguos de los cuales no volverían a ser usados. No tendría sentido que esos sprites sigan presentes en el disco ocupando espacio.

Este plugin es perfectamente compatible con otros plugins de cache como WP-Supercache o W3 Total Cache.

Aun quedan algunos bugs por corregir, como por ejemplo la generación de imágenes, ya que en algunos casos recorta un pixel de mas dando lugar a ver trozos de otras capturas.

Ahora la pregunta que me surge es ¿ Debería liberarlo en el repositorio de wordpress para su uso libre y gratuito? ¿O debería usarlo solo para los blogs que se alojen en mi hosting?

Related Posts

Código ejemplo del desarrollo de extractor de contenido relevante

Hace unos días mostré un plugin de wordpress (más que nada es solo un Shortcode con administración de la caché generada) donde comenté que hacer un extractor del contenido relevante de una página de noticias es algo muy sencillito que solo necesita de un par de loops. Y para qué quiero esto uno puede preguntarse….

Extractor de contenido relevante de páginas web

Extractor de contenido relevante de páginas web

Este es un extractor de contenido relevante muy sencillo hecho con DOMDocument y un par de loops. Es cierto que ya hay extractores de contenido en PHP pero estos hacen uso de librerías externas ( Readability  ) o tienen un método de detección muy sencillo que hace uso solamente de los bloques de texto, lo…

Lotus Notes – Columnas con información extraída del contenido.

Lotus Notes – Columnas con información extraída del contenido.

Trabajando con Lotus Notes para la gestión de incidentes me encontré con una situación en la cual necesitaba mostrar en las vistas una columna con información extraída de un campo de texto. Esta información estaba localizada entre una cadena especifica (era una cadena de números) y para consultarla de otra forma necesitaba acceder al documento…

0 comentarios

Enviar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.