10 Extensiones de Firebug que deberias conocer

 

Logo Firebug

Si estas en el mundo del Desarrollo Web, es muy probable que ya conozcas Firebug.

Este popular plugin de Firefox nos permite, entre otras cosas, hacer debug del Javascript, cambiar el CSS de tus paginas en tiempo real y ver el trafico de red de tu pagina.

Pero aparte de lo que viene de serie, Firebug nos permite añadirle funcionalidades a traves de extensiones. Algunas de estas extensiones se estan convirtiendo en imprescindibles para muchos diseñadores y programadores web.

Asi que aquí os dejo una lista de las 10 extensiones para Firebug que considero más interesantes:

1.- PixelPerfect

Screenshot de PixelPerfect

La herramienta perfecta para los diseñadores y para los obsesivos del pixel perfectamente colocado (conozco yo a unos cuantos).

Te permite poner como fondo semi-transparente el diseño de tu página web, de forma que luego puedes ajustar el CSS para hacer tu maquetado “pixelarmente” perfecto.

Descargar PixelPerfect

2.- YSlow

Screenshot YSlow

YSlow analiza tu sitio web y te muestra un informe de su rendimiento. En este informe sugiere mejoras que puedes acelar para acelerar la carga de tu página.

El analisis que hace YSlow está basado en las reglas que sugiere Yahoo para webs de alto rendimiento desde su Developer Network.

Descargar YSlow

3.- CodeBurner

Screenshot CodeBurner

CodeBurner te permite acceder desde Firebug al material de referencia de HTML y CSS de SitePoint http://www.sitepoint.com/.

Te muestra un pequeño informe con la posibilidad de acceder a la descripción detallada de la propiedad CSS http://reference.sitepoint.com/css o del tag HTML http://reference.sitepoint.com/html seleccionado

Descargar CodeBurner

4.- FireQuery

Screenshot FireQuery

Con este complemento de FireBug podras ver desde la consola o desde el inspector de DOM tus expresiones jQuery (eventos, data, colecciones).

Imprescindible si quieres depurar Javascript bajo jQuery.

Descargar FireQuery

5.- Widerbug

Screenshot Widerbug

Con esta extensión instalada podras ver Firebug como panel lateral del browser lo que nos permite aprovechar el ancho de las pantallas panorámicas.

Simple pero efectivo, no?

Descargar Widerbug

6.- FireCookie

Screenshot de FireCookie

Con esta extensión podras ver y manejar las cookies desde Firefox de una manera sencilla.

Descargar FireCookie

7.- FireRainbow

Screenshot de FireRainbow

FireRainbow colorea tu codigo y te permite aplicar diferentes temas. Muy util sobre todo para la lectura del código JavaScript desde Firebug.

Descargar FireRainbow

8.- FirePHP

Screenshot FirePHP

Te permite comunicarte con la consola de Firebug desde PHP. Ideal para debuggear desarrollos PHP con llamadas AJAX.

Descargar FirePHP

9.- Jiffy

Screenshot de Jiffy

Esta extensión añade un panel a Firebug que te muestra de forma visual los tiempos de ejecución del JavaScript. Perfecto para analizar el rendimiento de tu JS.

Descargar Jiffy

10.- FireFinder

Screenshot de FireFinder

Con esta herramienta podras localizar rapidamente los elementos HTML de tu paginas mediante selectores CSS o expresiones XPath.

Tambien te puede servir para chequear que tus selectores CSS estan accediendo a los elementos correctos.

Descargar FireFinder

Y hasta aqui la lista…

¿Que opinas de Firebug? ¿Y de estas extensiones? ¿Las has probado? ¿Alguna extension que no esté en la lista y que nos quieras recomendar?

Fuente: PixelLovers

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>