Chrome extensions for web developers
For programmers who want to increase productivity and deliver high-quality products in less time, here are the 10 best Chrome extensions that web developers should install.
- Lighthouse.
- JSONView
- Awesome screen recorder.
- Edit this cookie.
- Test IE.
- Lorem Ipsum generator.
- Octotri
- Window Resizer
- Insights into web accessibility.
- Vimium
About Chrome DevTools
Before we discuss the top Chrome extensions for web developers, we should first talk about Chrome DevTools.
DevTools is not a Chrome extension or plugin. DevTools is built into the Chrome browser, and offers extensive monitoring, testing, and debugging capabilities.
Before a web developer can install a Chrome extension, they should first check to see if the functionality they want is part of DevTools. If so, enable that feature with the DevTools implementation before installing a plugin or extension. If the built-in feature doesn’t offer the specific functionality you need or isn’t as user-friendly as you like, look for a Chrome extension.
Some of the extensions listed below overlap with functionality available in Chrome DevTools, but are still recommended due to their ease of use or extended features.
Lighthouse Chrome extension
Lighthouse It’s an open source tool that inspects a website and reports mobile and desktop rendering metrics:
- Performance.
- Optimization opportunities.
- SEO Best Practices.
- Installation time.
- Page compression.
Use this Chrome plugin for developers to test apps from the first day a website is live. Also, monitor it regularly to spot performance issues before they become too difficult to correct.
The Lighthouse plugin generates a full site performance report.
JSONView Web Developer Extension
JSON is the web browser’s data exchange language. Unfortunately, browsers don’t display JSON in a nice format, only in plain text.
of JSONView plugin Not only can you decorate your JSON, but it also allows you to:
- Expand and collapse element arrays.
- Highlight important fields.
- Color code fields, attributes, and URLs.
- Provide raw text when errors occur.
If your web application handles JSON regularly, the JSONView Developer Chrome extension is a must.
The JSONView plugin makes it easy to view JSON in the browser.
Excellent screenshot and screen recorder
Tools that tout themselves as awesome don’t live up to their billing. But this screen recorder does not disappoint. Often used to create video tutorials or product demos, it really is. Excellent screenshot and screen recorder.
Because it allows developers such as Chrome plugins to catch errors when they occur, along with actions taken before and immediately after an error occurs.
Simply activate the plugin, generate your bug and attach the MP4 file that the screen recorder creates and add it to a JIRA ticket so your developers can fix the issue.
The ability to quickly record the screen is a great way to document errors and demonstrate features.
Try the IE extension for web developers
Many web applications still need to be tested on older versions of Internet Explorer. Modern versions of Microsoft Windows remove IE for Microsoft Edge, but that makes direct IE testing impossible.
with Test IE With the Chrome Developer plugin, testers can simulate IE versions 6-11 as well as create Edge environments, all from the comfort of the Chrome browser.
However, I have two issues with this plugin:
- You must be logged in to use it.
- The plugin only runs on the Browserstack website.
This didn’t feel like the right plugin. Web and mobile testingAnd more like a plugin that easily transfers your website to a SaaS service.
The TestIE plugin lets you see how your website performs on older browsers.
Edit this cookie
Application data that is not persistent to local storage is stored in a browser cookie.
The developer can directly edit the data in the browser’s cookie to try different state changes like tedious login, logout or other repetitive steps. Edit this cookie.
This Chrome extension allows developers to:
- Edit cookies.
- Delete cookies.
- Import cookie data to JSON.
- Change the cookie expiration time.
For applications that manage state on the browser, this is a Chrome extension that helps us have cookies.
Quickly edit cookies with this easy-to-use Chrome extension.
Lorem Ipsum generator
To test DIVs, textfields, SPANs, or any other web component that contains text, it’s common to fill these fields with Latin words and see how the component performs.
of Lorem Ipsum generator The Chrome plugin generates Latin text that you can use to populate web pages instantly. The tester sees how a web page performs at different text sizes, including where a sentence can overflow the bounds of poorly designed HTML or CSS elements.
Web developers looking to speed up their development should use this Chrome browser extension to help them test, validate, and bring software products to market faster.
The Lorem Ipsum Chrome plugin generates Latin text for you quickly.
Octotree for GitHub
Github is the most popular online source code repository around, but navigating around isn’t always easy.
Octotri Like Windows Explorer, it offers a simple menu-bar that allows developers to view files in a tree-like manner. It also offers search and bookmarking features.
If you do a lot of GitHub work in a browser, the Octotree plugin makes it very easy to navigate through the thousands of files in your repository.
The Octotree browser extension makes it very easy to browse GitHub repositories.
Window Resizer
There is a feature in Chrome’s built-in DevTools suite that allows you to change the view of the window, but I prefer the simpler one Window Resizer Extension.
It’s easy to use, and you don’t need to open Chrome DevTools to access it. With it, you can easily set a custom screen size or rotate from portrait to landscape.
The Chrome WindowResizer extension makes testing responsive web designs easy.
Web accessibility insights
To create an accessibility-friendly website, you need to do more than add alt tags to your images and names to your links.
Font sizes, color contrast, and UI elements that can be manipulated with just a click of the mouse are factors that can cause a website to fall out of compliance.
of Accessibility insights A Chrome extension for developers that examines websites and highlights parts that might be problematic for someone who is visually or hearing impaired.
According to Accessibility Extensions, this site is missing some link names and image alt features.
Vimium
Vim is a powerful text editor included in Linux distributions and offers a wide range of keyboard shortcuts.
Experienced power developers with Vim can do amazing things without their fingers leaving the keyboard.
Similarly, the Vimium The extension adds several shortcuts to the Chrome browser that allow users to quickly:
- Go forward and backward in history.
- Move between tabs.
- Scroll up, down, left or right.
- Open the link.
- Reload the page.
For users who love Vim, the Vimium plugin brings a Vim-like experience to Chrome.
We offer you some site tools and assistance to get the best result in daily life by taking advantage of simple experiences