Common web development plug-ins in Firefox

Debugging tool

1. firebug

Firebug is a plug-in Firefox that can debug all Website Languages, such as HTML and CSS. But what attracts me most is the Javascript debugging capability, which is very convenient to use, it's incredible that you can use it in a variety of browsers (ie, Firefox, opera, Safari. In addition, other functions are powerful. For example, HTML, CSS, Dom viewing and debugging, and overall website analysis. In short, it is a complete and powerful web development tool. It's awesome. Then there is open source, and the future is limitless.
Official firebug Website: http://getfirebug.com/
Breakpoint debugging is supported in Javascript. You can see the effect immediately after changing the attribute value in CSS viewing (it is also a debugging of CSS), and you can easily see which CSS is used, powerful functionality! In the console, asynchronous requests will be output like the terminal. Where is the parsing error? This is easy to enable. You can directly open the editor and edit the corresponding file after it is enabled.

The general impression is that it is simple but not simple. It is very suitable for programmers!

2. firephp

Firebug is a good development tool for CSS, HTML, and Javascript. However, firephp is only available after users install firebug and can be used by PHP developers to facilitate their management of PHP functions.

 

 

 

3. Javascript Debugger

A powerful JavaScript debugging tool.

 

Analysis Tools

1. Coral ie Tab

Open the page with IE in Firefox tab. It is an IE tab of Firefox version. You can switch between IE and Firefox engine at any time. Because cookie transmission is supported, you do not have to log on to the website you want to log on to after switching. Using wtl completely overwrites the plug-in's Linked Library file, providing better performance.

2. operaview calls the Opera Browser in Firefox, Mozilla, flock, and Netscape 8 to view the extensions of the current webpage.

3. View Source chart displays the colors used on the page in the form of charts.

4. View Dependencies

View dependencies Firefox extension is an extension that adds a label in the "view page information" window to display all loaded files on the current page. The file list is based on the host domain name and file category (image, sample table, script ...) sort and display the size of each file, including the size of all files under each domain name and the size of all files contained on the current page. By right-clicking the menu, you can choose to open any selected file in a new tab or window. You can also copy the file URL to the clipboard. Version: View dependencies 0.3.3.0 for: Firefox 1.0-3.0b5pre flock 0.4-1.0 + Mozilla 1.4-1.8 SeaMonkey 1.0-2.0a1: http://addons.mozine.cn/firefox/714/

5. Lori tells you how long it took to load the page.

6. the HTML validator HTML syntax validation plug-in can mark the number of HTML syntax errors on the current page on the icon of the status bar, not only the HTML file sent by the Verification server, it also checks the HTML code in the memory (usually the return value after the Ajax request is executed ).

7. CSS validator verifies the CSS syntax. the W3C CSS standard is used to check the page, and the verification result is displayed on the new page, but it only works for pages that contain CSS style files, its shortcut buttons can be added to the right-click menu or toolbar.

8. RSS validator verifies the RSS format.

9. Window resizer adjusts the window size to various standard sizes, such as 1024*768,800*600. This allows you to view the page display effects in various sizes.

9. dafizilla viewsourcewith
By default, "view page source code" in Firefox is opened in a window of Firefox. This plug-in can specify an external application to browse the page source code. The main purpose is to use an external program to browse the original page code, but you can also open the original page code as a DOM file, see FAQ-open the CSS and JS files used on the page-use the Image Browsing software you specified (such as Gimp or ACDSee) open the image-Use Acrobat Reader, Foxit Reader, or your specified program to open the PDF link-Use your favorite text editor to edit the content in textbox, when you switch the focus to Textbox, you can immediately see the modified text in the browser, which simplifies the editing of the wiki page. See the FAQ-open the page where the server generates the browser content, this simplifies debugging for Web developers. For more information, see server-FAQ-open the files listed in the Javascript console. When the Text Editor opens the file time mark, you can move it to the line displayed on the Javascript console. For more information, see the js faq. You can also add Microsoft IE to the editor list.

 

10. CSS usage

A firebug-based Firefox extension can be used to view the CSS usage on the page, and clearly view the actual usage of all the rules in the CSS file on your website. You can view the usage of CSS on multiple pages of a website to see the global usage of CSS on the website.

Preview:

11. yslow

Yslow is a very useful tool for Firefox optimization. Yslow can report for any web page and review the quantity of information, HTTP requests, cdns usage, CSS and JS compression will give you a score and tell you how to improve this web page, in order to load faster. The basis for determining webpage performance is Yahoo! 'S predictional performance team has identified 34 rules that affect web page performance.

 

 

SEO:

1. Niche watch tool:

 

This wonderful Seo extension provides you the technical information required to beat your competitor websites in SERPS. it gives you backlinks number, indexed pages, keyword occurences on the page, Page Rank, all in anchor, all in title and all in text rank for both domain and webpage information.

This cool Firefox extension is very useful for webmasters and Seo extensionals for analyzing niche keyword competition for ranking at top in Google.

2. kgen:

Kgen (keyword generator) is an extension that allows you to see what keywords are strong on visited web pages. Than, you can retrieve them for social sharing (TAG filling) or webmastering/Seo.

 

Others:

1. Web Developer

Https://addons.mozilla.org/zh-CN/firefox/addon/60? Src = API

Web Developer can be said to be the most commonly used Firefox extension package by web designers. It can help us design webpages more easily, with built-in HTML, CSS, feed... Such as validators, so that the web pages we designed can meet the standards, not only save time and money for future maintenance, but also ensure that the web pages we designed are in different browsers, they can be displayed normally and are the expected results. Others include canceling CSS, canceling Java, canceling JavaScript, viewing or clearing cookies... .

2. showip displays the IP addresses on the current browser page.

3. serverspy: displays the name and version number of the Web server on the current page.

Note: It took nearly three hours to write this article. I browsed many articles about the Firefox plug-in and summarized them. I hope they will help you, when selecting a plug-in, you can quickly find the plug-in that suits you.