Firefox Developer Tools

Creació

Eines d'autor per a llocs web i aplicacions web.

Bloc de notes (Scratchpad)

Un editor de text integrat a Firefox que us permet escriure i executar JavaScript.

Editor d'Estils

Veure i editar els estils CSS de la pàgina actual.

Editor Shader

Veure i editar vèrtexs i ombrejadors de fragments utilitzats per WebGL.

Web Audio Editor

Examinar el gràfic de nodes d'àudio en un context d'àudio, i modificar els seus paràmetres.

Explorar i depurar

Examinar, explorar i depura llocs web i aplicacions web.

Consola Web

Veure els missatges registrats en una pàgina web, i interactuar amb la pàgina utilitzant JavaScript.

Inspector de Pàgina

Veure i modificar la pàgina HTML i CSS.

Depurador JavaScript

Parar, pas a pas, examinar i modificar el codi JavaScript que s'executa en una pàgina.

Monitor de xarxa

Veure les sol·licituds de xarxa que es realitzen quan es carrega una pàgina.

Inspector d'emmagatzematge

Inspeccionar les cookies, emmagatzematge local, IndexedDB i emmagatzematge de les sessions presents en una pàgina.

Barra d'eines de desnvolupador

Una interfície de línia d'ordres per a les eines de desenvolupament.

Vista 3D

Visualització en 3D de la pàgina.

Comptagotes

Tria un color de la pàgina.

Treballar amb iframes

Com apuntar a un iframe en particular.

Mòbil

Eines per al desenvolupament mòbil.

App Manager

App Manager ha estat substituït per WebIDE.

WebIDE

Substitueix a App Manager, disponible a Firefox 33 en endavant.

Simulador Firefox OS

Executar i depurar l'aplicació Firefox OS a l'escriptori, sense necessitat d'un veritable dispositiu de Firefox OS.

Visualització sensible al diseny

Veureu com el vostre lloc web o aplicació es veu en diferents mides de pantalla sense canviar la mida de la finestra del navegador.

Depurar Firefox per Android

Connectar les eines de desenvolupament de Firefox per Android.

Depurar Firefox per Android amb WebIDE

Per Desktop Firefox 36+ / Android Firefox 35+ , hi ha un procés més simple.

Valence

Connectar les eines per a desenvolupadors de Chrome en Android i Safari en iOS

Rendiment

Diagnosticar i solucionar problemes de rendiment.

Eina de rendiment

Analitza la capacitat de resposta general, el rendiment de Javascript i el disseny del lloc.

Gràfic de velocitat de fotogrames

Veure la velocitat de fotogrames del vostre lloc.

Waterfall

Esbrinar el que el navegador està fent mentre executa el vostre lloc.

Arbre de crides

Esbrinar on el vostre codi JavaScript està invertint mes temps.

Gràfic de Flama

Veure quines funcions estan a la pila al llarg d'un perfil de rendiment. .

Eina Paint Flashing

Destaquen les parts de la pàgina que es repintan en resposta als esdeveniments.

Registre d'esdeveniments de reflux

Veure esdeveniments de reflux a la consola web.

Rendiment de la xarxa

Veure quant temps triga les parts del vostre lloc han carregar-se.

Depuració del navegador

Per defecte, les eines de desenvolupament estan associades a una pàgina o aplicació web. Però també es pot connectar al navegador com un tot. Això és útil per al navegador i el desenvolupament de complements.

Consola del navegador

Veure els missatges registrats i els complements del navegador i executar codi JavaScript en l'àmbit del navegador.

Caixa d'eines del navegador

Fixar les eines de desenvolupament al navegador.

Ampliació dels DevTools

Les eines de desenvolupament estan dissenyades per a ser extensibles. Els complements del Firefox poden accedir a les eines de desenvolupament i els components que s'utilitzen per estendre les eines existents i afegir noves eines. Amb el protocol de depuració remota podeu implementar els vostres propis clients i servidors de depuració, el que us permet depurar llocs web utilitzant les seves pròpies eines o depurar diferents objectius utilitzant les eines de Firefox.

Afegir un nou panell per als devtools

Escriure un complement que afegeixi un nou panell a la caixa d'eines.

Protocol de depuració remota

Protocol utilitzat per connectar les eines de desenvolupament de Firefox per a un objectiu de depuració com una instància de Firefox o un dispositiu Firefox OS.

Editor de codi font

Un editor de codi integrat a Firefox que pot ser incorporat en el seu complement.

Interfície de depuració

Una API que permet al codi JavaScript observar l'execució d'un altre codi JavaScript. Les eines de desenvolupament de Firefox utilitzen aquesta API per a implementar el depurador de JavaScript.

Sortida perosnalitzada de la consola web

Com estendre i personalitzar la sortida de la Consola Web i la Consola del Navegador.

Exemple de complements de devtools

Utilitzeu aquests exemples per a comprendre com implementar un complement de DevTools.

Firebug

Una eina de desenvolupament web molt popular i potent, incloent un depurador de Javascript, visualitzador i editor d'HTML i CSS i monitor de xarxa.

DOM Inspector

Inspeccionar, revisar i editar el DOM de pàgines web o finestres XUL.

Desenvolupament web

Afegeix un menú i una barra d'eines al navegador amb diverses eines per a desenvolupament web.

Eines Webmaker

Conjunt d'eines desenvolupades per Mozilla, dirigides a persones que s'inicien en el desenvolupament web.

W3C Validators

La pàgina web de W3C alberga una sèrie d'eines per a comprovar la validesa del vostre lloc web, incloent HTML i CSS.

JSHint

Eina d'anàlisi de codi JavaScript.