13 Firefox plug-ins used to arm firebug

If you are a web designer, firebug will not be unfamiliar. As a Firefox plug-in, it may be one of the most useful tools for website front-end development. In particular, today's websites are using more and more JavaScript and Ajax techniques. firebug provides great convenience for Web Front-end development and debugging. Firebug has many advantages, including scalability. the Firefox plug-ins described below are used to arm firebug and make it more functional and convenient.

2. Yslow (Why slow? -Why is it slow ?)

   Yslow is a Firefox plug-in used to analyze Web pages and propose front-end performance improvement suggestions. Yslow rates webpages based on predefined or custom rules. It also provides many performance analysis tools, such as smush. It and jslint.

4. Page speed

   Similar to yslow, page speed is a plug-in launched by the Google team to evaluate web page performance. In particular, You can provide suggestions for improving web page performance based on "best web page performance practices.
   Page speed can automatically optimize images and provide compressed versions. It can also detect JavaScript and CSS that are not actually used to optimize them.
   Page speed is a large plug-in of 1.3m. It also has many outstanding features to try.

6. Pixel perfect

   Before creating a webpage and adding a new design element (such as an image or icon) to the webpage, we often want to see the overall effect of the page after the element is added in advance. Pixel perfect can help you implement this idea. It allows developers to overwrite the design elements you want to add on the webpage. When using it, you can adjust the transparency and position of the elements to be added.
   I feel that this plug-in can also be used to fine-tune the elements in the web page to ensure that it is consistent with the original design blueprint, such as its name, perfect to a pixel.

8. Codeburnder

   After codeburner is installed, you can view the reference panel on the firebug panel to query HTML elements, HTML attributes, and CSS attributes, just like a dictionary.
   When you select a node in firebug, it also provides relatedCodeFor your reference.

10. Fireunit

    Fireunit provides a simple API for simple test records and unit tests.

12. Firephp

    With the help of firephp, you can call a simple PHP method to record logs in firebug.

    Data is sent through the response header, which does not affect the webpage content.

14. Firerainbow

    Firerainbow can be used to control and modify the script syntax highlighting in firebug.

16. Firediff

    It adds a change monitor recording every change made, by firebug and the website itself, to CSS and the Dom.
    It records every change to the CSS or DOM of a website through firebug.

    After I installed it, I didn't see anything more on firebug, and I don't know how to use it. A friend who wishes to know left a message.

18. Jiffy Firefox extension
    

    After Jiffy Firefox extension is installed, a new panel will appear in firebug, which is used to display the Javascript runtime graphically and print the report.

    Reading the Home Page instructions seems to be a little troublesome. If you are interested, read it by yourself.

20. Hammerhead

    Hammerhead can help you calculate the loading time of web pages. (This seems to be available in Firefox)

    It supports multiple pages and allows you to clear the disk or memory cache before testing the loading time.

22. Firecookie

    Firecookie is a cookie browser management plug-in embedded in firebug.

    If a cookie is used in web development, you can use it to easily browse the cookie value, expiration time, and so on, facilitating rapid development.

    When using it, you must enable cookie monitoring in the network panel of firebug. It displays both sent and received cookies.

24. Firefinder

    In the previous article "firefinder, a Firefox plug-in for quick search of page elements", this plug-in was specifically introduced. I will not talk about it more. If you need it, take a look.

26. Livecoder

    Livecoder is an extension of firebug to view Firefox Chrome. This is very useful for Firefox plug-in developers. It can help you check and modify the DOM of the Firefox plug-in.