Column | chapter nine algorithm

Url | http://www.jiuzhang.com

Google Chrome is one of the most commonly used browsers, and the developer tool Chrome DevTools is a necessary tool for performance debugging of Web front-end development. But Chrome can do much more than that. Its capabilities are expanded with thousands of extension tools that allow developers to use a variety of techniques during development to test websites and applications, try out other fonts and layouts, and greatly increase their productivity. Here is a list of 45 Chrome extenders for your reference.

1.Page Ruler

Current rating: 4.5/5 stars

Page Ruler is an extension that measures the size of web elements in Chrome. Page Ruler can in any a web Page display scale, it can provide any Page you want to measure control the width and the height, location (up, down, left, right), and other information, and the size of the scale, location can be easily by dragging the scale edge, changing the target location, or the toolbar manual update scale size and position to accurately adjust.

Page Ruler also offers a “component mode” that displays the outline of a component when you mouse over it. Even better, you can browse the parent, child, and sibling controls of any control. There’s just one glitch — it doesn’t save when the page reloads, and if you fix that glitch, it’s even better.

2. Dimensions

Current rating: 4/5 stars

Dimensions is another handy Chrome extension that is perfect for anyone who needs to measure screen sizes and other design elements on a web page. For example, Dimensions can measure elements such as images, input fields, buttons, video, giFs, text, and ICONS. And the extender is open source, so basically you can use Dimensions to see any area boundaries in the browser.

As a front-end development tool, it provides an incredible working experience — simple, reliable, and perfectly static designed to measure and fill margins.

3. Tape

Current rating: 4.5/5 stars

Tape is a web design tool for measuring pixel values. It intelligently intercepts page content and easily measures the location and size of elements. For pixel-perfect Web development, Tape is a very valuable Chrome plugin. It is simple, easy to use, and accurate to solve the customer’s need for perfect pixels and so on. If you often need screenshots to check if your page layout is perfect, Tape is a great choice.

4. WhatFont

Current rating: 4/5 stars

WhatFont is a Chrome extension that allows you to quickly identify fonts on your web page. WhatFont is a Chrome extension that allows you to quickly identify fonts on your web page. WhatFont is a Chrome extension that allows you to quickly identify fonts on your web page. These fonts are combined to create beautiful websites.

5. Font Playground

Current rating: 4.5/5 stars

Font Playground is another useful Font tool that allows you to use different fonts on your app/website without changing anything. It lets you preview the effect of your selected fonts in just a few seconds, and it also has the ability to search and bookmark your favorite fonts.

6. ColorPick Eyedropper

Current rating: 4/5 stars

ColorPicker is a JavaScript advanced ColorPicker that doesn’t rely on any JS framework. Its interface is simple but organized. ColorPicker displays an entire palette of colors in six different color modes. The ColorPicker has four different selection panels that can be dragged or fixed, and its appearance can also be changed using CSS.

7. Eye Dropper

Current rating: 4/5 stars

Eye Dropper is an open source extension that makes it easy to pick colors from web pages, color pickers, and your personal color history, and each selected color is stored in your personal history. The Eye Dropper tool is very useful when building sites on the CMS platform.

8. TinEye Reverse Image Search

Current rating: 4.5/5 stars

Tineye can quickly search the source files of almost any image. It creates a separate identity for each image to be searched and accurately matches the identity of other images in the database, including those that have been edited, compressed, and resized.

Another nice feature is that you can sort images by size. For example, it lets you find source images from memes and render them in larger sizes. It also allows you to report fake profiles from spammers by finding pictures that others have used to impersonate their Facebook profiles.

9. Search by Image

Current rating: 4.5/5 stars

Search by Image is Google’s own Image Search plugin that allows you to use Google Search on any Image on a web page. You can right click on any image and select “Search Google with this Image”. Or, if this is a plugin you use regularly, you can quickly use this feature by adding click image search.

And you can combine Search by Image with TinyEye Image Search. The two tools complement each other. That is, when you have both, you can basically find anything. However, the algorithms of Search by Image and TinyEye are different: Search by Image seems to use plate and color, so completely irrelevant things often appear in the Search; TinyEye, on the other hand, finds exactly the same image in all iterations, even if parts of it are changed, cropped, or it becomes a larger version, etc.

10. BuiltWith Technology Profiler

Current rating: 4.5/5 stars

BuiltWith Technology Profiler is a great tool for building web pages. You can get more information by visiting the BuiltWith page. You can also add urls to BuiltWith to search for the technology used by any site.

11. Wappalyzer

Current rating: 5/5 stars

As a cross-platform tool for building websites and apps in the Web community, Wappalyzer functions like BuiltWith. Can detect content management systems (CMS), e-commerce platforms, Web servers, JavaScript frameworks and installed analysis tools, etc.

12. Firebug Lite

Current rating: 4/5 stars

Firebug Lite, supported by the Firebug Working Group, analyzes HTML page code and provides a live preview of web style elements.

Firebug Lite is not a replacement for Firebug or Chrome Developer Tools, but can be skillfully combined with these Tools to provide rich visual effects like HTML elements, DOM elements, and Box model coloring capabilities. It can also test and evaluate web site performance, provide analysis of load times and so on.

13. Web Developer

Current user reviews: 4.5/5 stars

Web Developer is a must-have extension tool for developers. Using Web Developer allows us to easily obtain more information about the Web page and further understand the Web page we are currently viewing. Web Developer runs on any browser-supported platform, including Windows, Mac OS, and Linux. Firefox and Opera can also use Web Developer.

14. PageEdit

Current rating: 3/5 stars

PageEdit is a Chrome plugin that turns any web page into a rich text editor. Not only is the extension tool simple to use, but the code it produces is clean. After installing the PageEdit plug-in in Chrome, users can launch the PageEdit plug-in while opening other web pages, adding rich text editor functionality to the current web page. Users can use the PageEdit rich text editor to edit regular web pages in the form of blog editing, such as adding a picture to the current page or editing text on the page.

15. HTML Instant

Current rating: 3.5/5 stars

With HTML Instant, you can edit HTML code in real time. It is a very useful tool for instant editing and coding instructions. You simply type in JavaScript, HTML and CSS code in the left window and your changes will be instantly displayed in the right window.

16. Pendule

Current rating: 4.5/5 stars

Pendule extends Chrome’s built-in development tools and adds features such as viewing, reloading CSS, disabling styles, turning selected inputs into text inputs, displaying hidden elements, viewing and editing HTML and CSS, JavaScript, validation, and much more.

The interface of the Pendule is beautiful and basically has all the key functions you need when using a browser in your web design.

17. Code Cola

Current rating: 4.5/5 stars

Code Cola is one of the best tools for visual editing CSS. Not only can Code Cola visually edit a page’s CSS, its source Code is also available on GitHub.

18. PerfectPixel

Current rating: 4.5/5 stars

Perfectpixel is an extremely useful tag plug-in for both developers and tag designers. Perfectpixel lets you overlay translucent images on web pages and do pixel-by-pixel comparisons.

19. Forget Me

Current rating: 3.5/5 stars

Forget Me deletes everything on a web site, including the message logger, the history, location and session store, and everything else.

By simply clicking on the icon, you can permanently delete all signs of sites you’ve visited; And when you double click on the icon, it only deletes the history and information programs of specific sites you’ve visited. It doesn’t delete all history from other sites, because it only works on pages in your address bar.

20. Clear Cache

Current rating: 4.5/5 stars

With Clear Cache, you can quickly delete Cache and data from your browser with a single click, without having to deal with annoying confirmation dialogs, pop-ups, and other tedious operations.

You can even customize the specific data you want to delete through preferences such as: application caches, info programs, downloaded files, file systems, form data, history, indexed databases, local storage, plug-in data, passwords, WebSQL, etc. Clear Cache also allows you to delete the Cache for a specific domain, which is really handy.

21. Click&Clean

Current rating: 5/5 stars

Click&Clean is the first personal data cleansing tool for Google Chrome. With the Click&Clean plug-in, users can choose a number of ways to clear history in Chrome. Click&Clean’s clean interface is also very modern and allows you to delete typed urls, caches, cookies, download history, and browsing history with a single click. Click&Clean can even delete client-side Web SQL databases, Flash Cookies (LSOs), and more.

22. User Agent Switcher

Current rating: 4/5 stars

User Agent Switcher is a program that can simulate search engine crawlers. Use the simulated Agent to visit web pages that have been rigged against search engines and see the real content.

In addition, the User Agent Switcher enables you to quickly switch the User Agent(User Agent, UA) of the browser to achieve the gorgeous transformation of the browser. Masquerading as a browser from another platform/brand, or masquerading as a browser from another version, is fine.

23. iMacros for Chrome

Current rating: 4/5 stars

IMacros for Chrome is an extension that helps you automatically fill in forms and save them. When you install iMacros for Chrome, the plugin will help you to automatically remember the contents of the form you typed, and the next time you type it, it will restore those repeated actions, thus helping you to fill out the form more efficiently and save you time.

You may sometimes encounter several problems that prevent you from properly recording Macros, but you can easily fix them by closing the dialog and re-opening or refreshing the page.

24. Resolution Test

Current rating: 4/5 stars

Resolution Test, a Chrome extension, is used to Test browser Resolution. It’s very convenient for front-end development.

25. IE Tab extension

Current rating: 4.5/5 stars

We can display web pages by using Internet Explorer Tab Extension in the Internet Explorer browser. This tool allows you to use Java, ActiveX, Sharepoint, Silverlight, and more to test whether your site will exit Chrome under different versions of IE. But IE Tab Extension only works on Windows.

26. IE Tab Multi

Current rating: 4.5/5 stars

Use IE Tab Multi to check how your application or website looks in IE. IE Tab Multi is the tool that produces the most similar behavior to IE, and it also lets you run ActiveX controls. But it only supports Windows, and in Windows 8 it only supports desktop mode.

27. Validity

8 Current Rating level: 4/5 stars *

You quickly validate your code with the Validity extender by clicking on the icon in the browser’s address bar. Using Validity validates the current HTML document by simply clicking the icon in the toolbar without leaving the page.

28. YSlow

Current rating: 4/5 stars

YSlow is a FireFox plugin that analyzes your site’s pages and tells you how to optimize your site based on certain rules in order to improve performance.

29. Chrome Daltonize!

Current rating: 4/5 stars

With Chrome Daltonize! Test the usability of your apps and web pages for color blindness. Chrome Daltonize! With two different filters, you can imagine how the elements appear to color-blind people.

30. Check My Links

Current rating: 4/5 stars

For a Web developer, basically every time you complete a page, you need to check that every link in the page has been hyperlinked. Then you need to Check My Links. Just click on the Check My Links icon on the web page you want to Check and it automatically starts checking. Unchecked links are black, live links are green, and dead links are highlighted in red. These will be displayed in the upper right corner of the page, which will show the current check progress, the number of live links and the number of dead links.

31. After the Deadline

Current rating: 4/5 stars

After the Deadline uses artificial intelligence to evaluate your spelling, style and grammar by simply clicking on the ABC icon in the bottom right corner of the editable area.

32. Websecurify

Current rating: 3/5 stars

Websecurify is a powerful, cross-platform Web security testing tool designed for developers. It can quickly and efficiently assess the security of websites and applications. For developers, having this tool improves productivity.

33. Awesome Screenshot

Current rating: 4.5/5 stars

Awesome Screenshot is an easy to use extension that quickly grabs any screen Screenshot you want to share or save, and it can grab full screen or part of the screen, as well as add comments and comments, blurt personal or sensitive information, and more before sharing.

34. Clipular

Current rating: 4/5 stars

Clipular is another Chrome extension for grabbing screens, which is essentially a screengrab tool with bookmarks. Like Awesome Screenshot, Clipular will also quickly grab any screenshots you want to share or save and will automatically save your clips in Google Drive.

With Clipular you can double click ALT, click and drag the area of the screen you want to capture and several options are presented including: Share, download and backup to Google Drive.

35. Bukket

Current rating: 4.5/5 stars

Bukket is a very useful Chrome extender. It can take screenshots and record video of the screen. And Bukket makes it possible to “capture and record animated giFs from your browser with a simple, reliable visual bookmarking tool.”

36. Marmoset

Current rating: 5/5 stars

Marmoset can help you take screenshots, output wireframes, and mark up code in just a few seconds. In addition, you can call snapshots of code you’ve made and add themes and other effects to your profiles and call them snapshots.

37. Web Timer

Current rating: 4.5/5 stars

Use Web Timer to see how you spend your time online. It keeps track of the tags you use and updates them every three minutes, giving you a clear idea of where you’re spending or wasting the most time. Your data will be displayed in an intuitive pie chart, making it easy for you to see how your time is allocated, which will help you better review and improve your focus and efficiency when surfing the Internet.

38. Lorem Ipsum Generator

Current rating: 4/5 stars

Using the Lorem Ipsum Generator to create virtual text and place it on your website or application is fast and convenient, and avoids repetitive cut and paste work. The Lorem Ipsum Generator aims to make this process easier and faster. Also, to make Lorem Ipsum faster to use, you sometimes need to refresh.

39. Linkclump

Current rating: 5/5 stars

Linkclump is an extension tool for batch opening multiple links in a web page. You just need to drag the mouse box to select all the links you want to open, so that you can open them in a new TAB, window, and save them as bookmarks, copy them to the clipboard, etc. Linkclump’s source code can be found on GitHub, and using it will make your research on any project more effective.

40. AutoPagerize

Current rating: 4/5 stars

AutoPagerize lets you load paging pages on a page, a handy and intuitive gadget that makes Web browsing more efficient.

41. Website Blocker

Current rating: 4/5 stars

Working with Website Blocker can block you from accessing specific websites. If you find yourself wasting time on sites like Facebook and Twitter, this extension will block you from visiting sites that tend to hog your time so you can focus on the work that’s more important to you.

42. Session Manager

Current rating: 3.5/5 stars

Session Manager allows you to quickly and easily save the current browser state at any time, and it allows you to instantly back up all your tabs as needed. Session Manager also helps to group websites, such as collecting social media profiles, tabs related to certain projects, etc.

43. LastPass

Current rating: 4.5/5 stars

If you use a different password for each site, you may not be able to remember passwords and login accounts for as many sites as you need to use. With LastPass, you can solve that problem by remembering a single, secure password.

44. Domain Checker

Current rating: 4/5 stars

Domain Checker supports a number of Domain extensions, allowing you to quickly switch registrations and even click on favorite domains. When you like a domain, you can choose to periodically check the status of the domain. The selection is never (default), automatically it detects the date and checks frequently.

45. Tab Resize

Current user reviews: 4/5 stars

Tab Resize allows you to move the current Tab to the right in a separate window. Tab Resize makes it easier to split screens and supports multiple monitors.

You can use Tab Resize to Resize all the tabs and organize them on the screen. You can also use Tab Resize to simulate multiple monitor Settings.

Welcome to follow my wechat official account: Ninechapter.



Elite programmer exchange community, regular release of interview questions, interview skills, job information, etc