#firebug

Saying Goodbye to Firebug ★ Mozilla Hacks – the Web developer blog
▻https://hacks.mozilla.org/2017/10/saying-goodbye-to-firebug

https://hacks.mozilla.org/files/2017/10/firebug-large.png

The story of Firefox and Firebug is synonymous with the rise of the web.

So long Firebug, and thanx for all the fish :)

#mozilla #firebug #webdev

Hommage à Firebug – Medium
▻https://medium.com/@mathrobin/hommage-%C3%A0-firebug-f9c86d0a7048

So long, #firebug, and thanks for all the fish!

Storage Inspector - Firefox Developer Tools | MDN
▻https://developer.mozilla.org/en-US/docs/Tools/Storage_Inspector

The Storage Inspector enables you to inspect various types of storage that a web page can use. Currently it can be used to inspect the following storage types:

– Cache Storage (new in Firefox 47) - any DOM caches created using the Cache API.
– Cookies - All the cookies created by the page or any iframes inside of the page. Cookies created as a part of response of network calls are also listed, but only for calls that happened while the tool is open.
– Local Storage - All local storage items created by the page or any iframes inside the page.
– Session Storage - All session storage items created by the page or any iframes inside the page.
– IndexedDB - All IndexedDB databases created by the page or any iframes inside the page, their Object Stores and the items stored in these Object Stores.

For the time being, the Storage Inspector only gives you a read-only view of storage. But we’re working to let you edit storage contents in future releases.

#cookie #storage #local_storage #inspector #webdev #firebug #firefox_devtools #mdn

Using the Web Animations API - Web APIs | MDN
▻https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API/Using_the_Web_Animations_API

The Web Animations API lets us construct animations and control their playback with JavaScript. This article will start you off in the right direction with fun demos and tutorials featuring Alice in Wonderland.
The Web Animations API opens the browser’s animation engine to developers and manipulation by JavaScript. This API was designed to underlie implementations of both CSS Animations and CSS Transitions, and leaves the door open to future animation effects. It is one of the most performant ways to animate on the Web where supported, letting the browser make its own internal optimizations without hacks, coercion, or Window.requestAnimationFrame().

With the Web Animations API, we can move interactive animations from stylesheets to JavaScript, separating presentation from behavior. We no longer need to rely on DOM-heavy techniques like writing CSS properties and scoping classes onto elements to control playback direction. And unlike pure, declarative CSS, JavaScript also lets us dynamically set values from properties to durations. For building custom animation libraries and creating interactive animations, the Web Animations API might be the perfect tool for the job.

Pour la mise au point/débogage de ces animations, la version de firebug fusionnée avec Firefox DevTools (à partir de Firefox 49, cf ▻https://blog.getfirebug.com/2016/06/07/unifying-firebug-firefox-devtools) propose « Animation Inspector », une console spécifique : cf ▻https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Work_with_animations

Pour aller plus loin : ▻https://hacks.mozilla.org/2016/08/animating-like-you-just-dont-care-with-element-animate

Pour la compatibilité avec les navigateurs ne supportant pas l’API Web Animations (Internet Explorer et Safari actuellement) : ▻https://github.com/web-animations/web-animations-js

#web_animation #mdn #API #firebug #firefox_devtools

Tester la vitesse de chargement des pages de vos sites Web
▻http://www.dsfc.net/internet/referencement-internet/test-vitesse-chargement-pages-sites-web

http://www.dsfc.net/wp-content/uploads/2013/04/pingdom-website-speed-test-dsfc-net.jpg

De nombreux outils de mesure de la vitesse de chargement des pages des sites Web existent. Citons, entre autres, #Pagespeed, #Yslow, #Pingdom_Tools ou #GTmetrix.

#Référencement #Consultant_SEO #Firebug #Firefox #Formateur_Apache #Formateur_LAMP #Formateur_Référencement_naturel #Formateur_SEO #Formateur_Web_Analytics #Formation_Apache #Formation_LAMP #Formation_Référencement_naturel #Référencement_naturel #SEO #Web_Analytics

#jquery-inlog
▻http://prinzhorn.github.io/jquery-inlog

jQuery-inlog allows you to easily debug your jQuery code. See exactly what you pass to functions, what they return and in which context (this-value) they were executed. No more alert($obj.length) to see if your selector worked. No more pain when chaining many calls and figuring out which one fails Include jquery.inlog.js after jQuery core and enable it by calling $l(true) or $l(options).

#débogage #javascript #jQuery-inlog #firebug

FirePHP - Firebug Extension for AJAX Development
▻http://www.firephp.org

FirePHP enables you to #log to your #Firebug Console using a simple #PHP method call.

All data is sent via response headers and will not interfere with the content on your page.

FirePHP is ideally suited for AJAX development where clean JSON and XML responses are required.

#Firebug 1.8 : #console.timeStamp()
►http://www.softwareishard.com/blog/firebug/firebug-1-8-console-timestamp

Firebug 1.8b3 introduces a new #API that can be used to create time-stamps during #Javascript #execution and compare them together with #HTTP traffic #timing on the timeline in the Net panel: console.timeStamp();

This feature is useful in cases where the developer needs to know when particular piece of Javascript code is executed relatively to the HTTP request made by web page. Especially in cases when Javascript is loaded through dynamically appended <script> tags or through XHR and evaluated using eval().

#dev

Le « hall of shame » des extensions Firefox : un classement selon leur impact sur le temps de démarrage.
►https://addons.mozilla.org/fr/firefox/performance

#Firebug 1.7 New Features ✩ Mozilla Hacks
►http://hacks.mozilla.org/2011/03/firebug-1-7-new-features

http://hacks.mozilla.org/wp-content/uploads/2011/03/sessionStorage.png

#firefox

h5o - Project Hosting on Google Code
▻http://code.google.com/p/h5o
“The current (Nov, 2009) HTML5 draft defines quite a precise algorithm, for producing an outline for HTML documents. h5o is an implementation of the algorithm in JavaScript.”
#HTML5 #outline #extension #Firefox #Firebug #Opera #Chrome #bookmarklet #dev #web

What does (Aborted) mean in HttpWatch? - HttpWatch Blog
▻http://blog.httpwatch.com/2008/01/28/what-does-aborted-mean-in-httpwatch
#trace #réseau #Firebug #Aborted #ressource #dev #web #performance #clevermarks

Firefocus : : Modules pour Firefox
▻https://addons.mozilla.org/fr/firefox/addon/49662?collection_uuid=38e04bf2-accc-dcbb-37b8-b30a96dc0fa1

« Track Page Focus in Firebug »

#firebug #Firefox #extension #dev #web #focus #accessibilité #test

Typecut :: Modules pour Firefox
▻https://addons.mozilla.org/fr/firefox/addon/61269?collection_uuid=38e04bf2-accc-dcbb-37b8-b30a96dc0fa1

“The Firebug plugin that extracts embedded (Typekit) font resources from websites and allows their separate download.”

#font-face #fonte #police #dev #web #firebug #clevermarks #extension #Firefox #Typekit

FireFontFamily :: Modules pour Firefox
▻https://addons.mozilla.org/fr/firefox/addon/111672

“Highlight the rendered font-family in Firebug”

#font-face #fonte #police #dev #web #firebug #Firefox #extension #clevermarks

Firebug Lite
►http://getfirebug.com/lite.html

#javascript #firebug #ie #tools #debug #webdev

Page Speed Home
▻http://code.google.com/intl/fr/speed/page-speed

Page Speed is an open-source Firefox/Firebug Add-on. Webmasters and web developers can use Page Speed to evaluate the performance of their web pages and to get suggestions on how to improve them.

#test #vitesse #chargement #page #web #dev #optimisation #performance #Firefox #extension #firebug #clevermarks

FireScope - HTML Brains at your Fingertips
►http://tools.sitepoint.com/firescope

FireScope is a Firefox add-on that integrates with Firebug, to extend it with reference material for HTML and CSS.

#reference #webdev #css #webdesign #firebug #tools #firefox

Clever Title Here » Article » Announcing jQuery.Firebug
▻http://jasonkarns.com/blog/?p=5

#jQuery #Firebug #log #debug #javascript #plugin #dev #clevermarks

Jiffy Firefox Extension - Documentation
▻http://billwscott.com/jiffyext

The Jiffy Firefox Extension adds an additional panel to Firebug that provides a visual view of the Javascript time measurements captured by Jiffy-Web

#performance #javascript #firebug #jiffy #firefox #extension #groupe:clever-age

YSlow for Firebug
►http://developer.yahoo.com/yslow

YSlow analyzes web pages and tells you why they’re slow based on the rules for high performance web sites. YSlow is a Firefox add-on integrated with the popular Firebug web development tool. PAS ENCORE COMPATIBLE FF3

#ajax #debug #css #firebug #performance #firefox #web #webdev #yahoo

Software is hard | Firecookie
▻http://www.softwareishard.com/blog/?page_id=5

Firecookie is a an extension for Firebug that makes possible to view and manage cookies in your browser. Apart from all the other cookie managers and viewers available as Firefox extensions, this one is made as an extension for Firebug, so web developer h

#cookie #dev #webdev #groupe:clever-age #firebug #firefox #extension #debug

Software is hard | Firecookie
▻http://www.softwareishard.com/blog/?page_id=5

#dev #plugins #web #firebug #Extension #cookies #debugging #debug

Ajaxian » Fireclipse: Debug from FF straight into Eclipse
▻http://ajaxian.com/archives/fireclipse-debug-from-ff-straight-into-eclipse

John J. Barton has released a new open source framework named Fireclipse that enables nice coupling of Firefox and Eclipse for debugging purposes, working on top of Firebug.

#firefox #javascript #debug #eclipse #firebug #dev #groupe:clever-age #clevermarks