Firefox – Nouvelles fonctionnalités d’inspection

Travaillant dans le domaine du développement web, j’ai toujours l’habitude d’alterner le navigateur web que j’utilise dans mes tâches courantes.

Cette semaine, j’ai fais l’utilisation du navigateur Firefox Nightly afin d’avoir une idée d’où s’en va le développement du navigateur de Mozilla.

Firefox Nightly est le navigateur qui est la sortie quotidienne de la branche de développements du navigateur. C’est dans cette branche de développements que se retrouvent les fonctionnalités expérimentales et parfois brisées.

Le principal ajout qui m’a intéressé est l’ajout d’un inspecteur HTML et de styles CSS au même titre que Firebug directement dans le navigateur.

La vue 3D de votre code HTML

Certains pourront dire que le nouvel inspecteur de styles de Firefox imite sommairement les fonctionnalités de Firebug. Ce qui est à retenir cependant est que cet inspecteur permet d’afficher le contenu de votre DOM en 3D en utilisant WebGL pour alimenter le tout.

En plus de donner la représentation 3D de votre structure HTML, il est possible d’interagir avec votre page web en cliquant avec votre souris sur le modèle 3D.

Les possiblités sont les suivantes :

  • Glisser vers le haut, bas, gauche et droite : Permet de changer l’angle de vue de votre structure HTML
  • Clic : Permet de sélectionner un élément dans le DOM
  • Scroll : Permet de faire un zoom sur votre structure HTML.

Pour les gens qui ne tenteront pas d’installer Firefox Nightly sur leur ordinateur, vous pouvez voir un aperçu vidéo de la fonctionnalité de prévisualisation 3D de votre DOM sur Youtube.

Advertisements

Auteur : Pascal Paradis

Je suis les mains et le cerveau derrière http://frenchcoding.com. Je développe des microservices chez @UbisoftMTL. Amateur de Hockey et j'aime la technologie, en général.

6 réflexions sur “Firefox – Nouvelles fonctionnalités d’inspection”

Laisser un commentaire

Entrer les renseignements ci-dessous ou cliquer sur une icône pour ouvrir une session :

Logo WordPress.com

Vous commentez à l’aide de votre compte WordPress.com. Déconnexion /  Changer )

Photo Google+

Vous commentez à l’aide de votre compte Google+. Déconnexion /  Changer )

Image Twitter

Vous commentez à l’aide de votre compte Twitter. Déconnexion /  Changer )

Photo Facebook

Vous commentez à l’aide de votre compte Facebook. Déconnexion /  Changer )

Connexion à %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.