For a developer, it can be hectic to use numerous dedicated tools for each task. However, web browser add-ons can make you more productive by providing access to various features from one browsing platform.

All the top browsers come with extensions for professionals. And if you use Microsoft Edge, your development tasks can become easier with some browser add-ons. Here, we’ll discuss the best Microsoft Edge add-ons that web developers should use.

1. React Developer Tools

React Developer Tools is a DevTools add-on for the web browser. It’ll add two new tabs named Components and Profiler in your Edge DevTools. The open-source add-on will need your permission to access the React tree of a page.

The Components tab displays the root React components of the page, along with the subcomponents. Select any component from the tree to inspect and edit its current props, the state, and hooks in the right panel.

You can also use this add-on to find out whether an application contains React.js or not. Using the Profiler tab, developers can record performance information.

2. Octotree-GitHub code tree

If you’re into analyzing GitHub code, the Octotree add-on can enhance the experience of GitHub code review and exploration. It shows you an IDE-like code tree and lets you perform file and folder searches.

This high-performance add-on is capable of working with repositories of any size. Besides, it supports private repositories and allows you to bookmark pull requests, repo, files, and issues.

You can also subscribe to the PRO version of this add-on to get some additional features. These include support for multiple GitHub accounts and GitHub Enterprise, multiple tabs, code font settings, pull request code review, file icon themes, and change docking position.

3. Accessibility Insights for Web

Accessibility Insights for Web is a Microsoft Edge browser add-on that’ll let you locate and fix accessibility issues in various web applications and websites. You can use it to check for compliance with around 50 accessibility provisions.

Thanks to the clear instructions and a visual helper, you can quickly identify vital keyboard access issues, including keyboard traps, missing tab stops, and incorrect tab order.

It also helps you perform a two-step process to locate common but high-impact accessibility issues within a few minutes. However, you need Microsoft Edge Insider v.75 or later to use this add-on.

4. Design Analysis

Analyzing the HTML code of a page is a frequent task of a developer. With the help of the Design Analysis add-on, you can analyze an HTML page by enabling and disabling various components of that page.

It lets you disable internal and external (including print and handheld) CSS, hide images and background images, display image alt attributes, outline headings, frames, external links, tables, floating elements, and so on.

Besides, this add-on comes with miscellaneous tools that help you display hidden elements, reload images and external CSS, view source code, linearize pages, and mark all links as visited or un-visited.

This add-on doesn’t store or share any personally identifiable data. All the information required for its functioning stays in your device.

5. Save as MHTML

Using Save as MHTML add-on, developers can save the current webpage in the MHTML (MIME HTML)/MHT format. The add-on comes with a toolbar button for effortless use. It saves all online links in an offline format.

MHTML is an archive file format that saves the web page content for offline viewing. The file type incorporates all the resources like images, applets, and Flash animations into HTML documents during the process.

The add-on has two different tools that you can use to edit the webpage content of the page before saving it in the MHTML file.

You can choose the design mode for tasks like changing the text format to bold and italic, adding an image, or removing any content. Or you can select a section of the page and ask this add-on to make a new document from it.

6. Cookie-Editor

Developers have an indispensable relationship with cookies. Cookie-Editor is a powerful add-on that lets you perform the standard cookie operations during the web page development and testing phase.

This add-on comes with an easy-to-use interface that allows you to manage the cookies manually. With its help, you can quickly create, edit and delete cookies while staying on the tab.

With one click, Cookie-Editor will delete all cookies of the current page. It can also import/export cookies in a text format.

7. Node.js V8-inspector Manager (NiM)

Node.js V8 is an add-on you can use with Edge DevTools to streamline your Node.js development cycle. It can manage the window/tab lifecycle of Edge DevTools, so you get more time to focus on debugging your code.

Node.js V8 add-on lets you monitor local and remote debugging sessions while controlling the DevTools interface, both manually and automatically. You can also use it to debug VSCode node processes and customize the duration between the probes of the v8 Inspector.

With its help, you can automatically open and close Edge DevTools in a tab or window and make DevTools active or inactive on start. Its inspect feature spares you from copying and pasting DevTools URL by automatically detecting the generated URL when running the node.

8. BugReplay

BugReplay is primarily an add-on used for a screencast and network debugging. It helps you record your screen in sync with JavaScript console messages and network traffic. Thanks to this add-on, all you need to do is retrace the steps to capture bugs in real-time.

There’s no need for a developer to communicate back and forth with the end-users or the support executives. They can seamlessly find out when and where the bug occurred from the recorded information and resolve the problem in no time.

Recording the bug becomes easy with the BugReplay add-on. You can also review the bug before sharing it with your colleagues. The add-on also offers an option to make it public.

Choose Your Favorite Edge Add-Ons for Development

By going through this list of Microsoft Edge add-ons, you can pick the ones that’ll help you in web and app development work. Remember, Microsoft Edge also has other add-ons for regular users. You can browse and find mainstream extensions for other tasks like password management.