DevTools: ¿Qué necesitas saber?

18 marzo, 2017 19:32 por

Esta es una traducción del artículo original publicado en el blog de Mozilla Hacks.

Hemos buscado hacer una revisión a los últimos meses del 2016. Muchas cosas cambiaron en las Herramientas de Desarrollador de Firefox el último año, particularmente hacia el final del año. El esfuerzo para refactorizar algunas de nuestras herramientas empezó a dar sus frutos y hemos completado algunos rediseños que deberían facilitar la vida de los desarrolladores web.

Nuevas herramientas brillantes

Liberamos una nueva herramienta de inspección para CSS Grid, la primera de su tipo (gracias a gabrielluong, helenvholmes, y jensimmons).

También liberamos un nuevo y rediseñado panel de consola. Sólo está habilitado en Nightly por ahora, pero está en camino para ser habilitado en cualquier lugar pronto.

Se hizo mucho trabajo en crear Reps, los widgets reusables responsables de mostrar todos los tipos de resultados en la consola. Esto es genial porque estos reps son componentes compartibles que ya hemos empezado a usar en muchas otras herramientas de desarrollo.

Gracias a todas las personas, especialmente a los contribuidores nicolaschevobbe, bgrins, Honza, linclark, y otros.

Consola

El 2016 también fue el año en el que liberamos nuestro nuevo front-end para el depurador de JavaScript. Este fue un gran logro del cual estamos orgullosos, ya que establece una etapa para la liberación de más herramientas asombrosas en 2017.

Estamos realmente emocionados por el impacto que hemos visto desde que que se movió el proyecto a GitHub. El inicio del 2017 ha sido momento un interesante para nosotros para experimentar  moviendo más código a GitHub. Y estamos seguros que esto es lo correcto para nosotros en esta etapa, y tenemos el proyecto del depurador para agradecer por esto.

Las gracias van para jasonlaster, jlongster, clarkbw y la comunidad de GitHub del Depurador de JavaScript que ha sido tan genial.

Depurador

Como si esto no fuera suficiente para impresionar, también liberamos la nueva y completamente rediseñada Vista de Diseño Adaptable en noviembre de 2016.

No solamente muestra una vista adaptable y funciona mejor, también viene con unas características nuevas principales como la limitación de red y más. Gracias a jryans, zer0, gabrielluong.

No hay XUL. Sólo Web.

El 2016 fue el año cuando el equipo removió activamente el lenguaje no estándar de marcado XUL y JavaScript privilegiado sólo para Firefox de las herramientas. De hecho, fuimos capaces de cargar el panel del inspector en una pestaña normal del navegador al finalizar el año, lo que significa que ahora el inspector está construido enteramente con HTML y las API Web.

Buen trabajo bgrins, juliandescottes, tromey.

¡El equipo llegó, incluso, a poner en funcionamiento un flujo de trabajo de desarrollo local basado en npm! Así que puedes construir el inspector, abrirlo en una pestaña del navegador, hacer cambios y verlos en el navegador simplemente recargando la página.

Pasando al panel de red, gracias al trabajo duro de Honza, rickychien, steveck, gasolin y al contribuidor jsnajdr ¡El panel a sido casi enteramente limpiado de su marcado XUL y migrado a React! Ahora tenemos un nuevo y más moderno código que estamos seguros será muy emocionante para la gente trabajar con él.

Hablando del final de XUL, tatumcreative erradicó una gran pieza de código antiguo rescribiendo las pestañas de las barra de herramientas usando HTML y React.

El inspector se renueva

Mucho del trabajo estuvo en corregir errores de corte de papel – ya sabes, esas pequeñas (o no tan pequeños) molestias que causan frustración al usar nuestra UI.

Un gran agradecimiento a ochameau por hacer el inspector mucho más rápido y más resistente, y a mikeractliffe por corregir muchos bugs en la información sobre eventos en el inspector.

Mientras cubrimos el inspector, les mencionamos algunas notables nuevas características: los colores de CSS de nivel 4 ahora están soportados (gracias a jerry y tromey), hay sugerencias visuales entre las etiquetas de apertura y cierre (gracias a juliandescottes), los nodos de texto ahora son resaltados (juliandescottes, de nuevo), y los espacios en blanco en diseños en línea son fáciles de depurar (gracias a patrickbrosset, autor del artículo original).

Al azar pero importantes

Nuestras herramientas se vuelven un poco mejor para usuarios RTL (de escritura de derecha a izquierda) también, gracias al contribuidor tomer.

Los estados de los Service Workers ahora son visibles en about:debbuging gracias a juliandescottes.

La herramienta de animación puede mostrar las aceleraciones gracias a daisuke y birtles.

Tambiéen hemos escrito sobre React más que antes. Estamos muy felices que nuestra UI se convergiendo hacia un estilo común. Gracias a jlongster por mostrarnos el camino.

mikeratcliffe hizo trabajo mucho en el inspector de almacenamiento también, e incluso ahora funciona mucho mejor con IndexedDB, es capaz de borrar cookies, y más.

Mirando hacia el futuro

En 2016 también dedicamos tiempo a la planificación para el futuro y en particular a la creación del nuevo proyecto de la Herramienta de Rendimiento.

Se realizaron muchas charlas y trabajo de diseño. Ahora estamos seguros que somos capaces de liberar una asombrosa herramienta de rendimiento que Firefox que los desarrolladores web amarán usar.

Gracias a jimb, tatumcreative, ejpbruel, mstange.

Gracias a todos quienes contribuyen a hacer DevTools mejor en 2016. Gracias a todos los contribuidores quienes ayudaron a corregir errores de las DevTools. No podemos mencionar a todos ellos aquí, desafortunadamente.

¡Vamos a tener un 2017 genial, juntos!

The following two tabs change content below.

AngelFQC

Web Developer at BeezNest Latino
Ingeniero de Sistemas y Computación. Desarrollador PHP. Mozilla Peru. Chamilo LMS Developer.

Compartir artículo:

Start the discussion at foro.mozilla-hispano.org

  • ¡Participa!

    Firefox Friends »
    Agrega botones de Firefox en tu sitio web y comparte tu amor por Mozilla Firefox.
    Ayuda a otros usuarios en Twitter.
    Colabora con la comunidad »
    En Mozilla lo importante son las personas. Descubre cómo puedes colaborar.

    Boletín Firefox

    Suscríbete al boletín de novedades de Firefox.

  • Descargas

    Descarga los programas de Mozilla.

    Lo más visto

    cc-by-sa