大家好,我是 dom 哥。这是我关于 Chrome 扩展开发的系列文章,感兴趣的可以 点个小星星

工欲善其事,必先利其器。Chrome 可能是前端开发中使用最多的浏览器。在日常开发中,下列几款 Chrome 扩展也许能让你的开发工作事半功倍

Vue.js devtools ⚙️

vue 官方专为 vue 应用开发的调试工具。

通过使用它,你可以快速查看组件的状态和属性,分析性能瓶颈,并进行性能优化。同时,它还提供了方便的 Vuex 状态管理和组件时间旅行功能。无论你是 Vue.js 初学者还是有经验的开发人员,Vue.js Devtools 都是一个值得掌握的工具。

React Developer Tools ⚙️

React Developer Tools 专为 React 应用程序开发者设计。它提供了一系列功能,帮助开发者更轻松地调试和优化 React 组件。

通过深入掌握 React Developer Tools,你可以更好地理解组件层次结构、跟踪组件状态和性能,调试 React Hooks,以及进行组件时间旅行等操作。无论你是初学者还是有经验的开发者,掌握 React Developer Tools 都将极大地提升你的 React 开发能力和效率。

Vimium

将 Vim 式的快捷键带入浏览器世界。

Vimium 为用户提供了类似 Vim 编辑器的键盘导航和操作方式,大大提升了浏览器操作的效率和速度。通过安装和使用 Vimium,你可以像在 Vim 中一样快速浏览网页、打开链接、搜索内容,甚至进行高级操作和自定义设置。不管你是 Vim 用户还是想要提高浏览器操作效率的用户,Vimium 都值得一试。

Resource Override

Resource Override 提供了实时修改,重定向和调试网页静态资源的能力。

前端开发者经常需要将线上资源重定向到本地,以此实现本地开发调试,这正是 Resource Override 的用武之地。

通过使用 Resource Override,我们可以定制和优化网页资源加载,满足个性化需求,或进行调试和优化。不论是开发者还是调试专家,Resource Override 都是一个不可或缺的工具,能够显著提升开发和调试效率。

GoFullPage - Full Page Screen Capture

简单快速生成网页全页截图的高效工具。

下面是我截的 github 首页长图:

我们经常需要生成网页的全页截图,以便进行展示、分享、文档编写或错误排查。GoFullPage 就是这样一款强大而高效的网页截图工具,能够快速生成高质量的网页全页截图。它提供了多种截图模式、定制化设置和高性能算法,帮助开发者、设计师和测试人员更轻松地进行网页截图工作。无论是展示、分享、文档编写还是错误排查,GoFullPage 都能为你提供便捷而优质的截图体验。

觉得不错可以 点个小星星 支持一下哦

推荐给前端开发的 5 款 Chrome 扩展 🚀的更多相关文章

  1. Web 开发人员必备的12款 Chrome 扩展程序

    之前已经分享过一些帮助 Web 开发人员和设计师的 Chrome 扩展,这次我们继续展示一组很有用的 Chrome 应用程序.这些免费的 Chrome 应用程序可以简化您的工作流程,为了加快您的工作流 ...

  2. 前端开发必备调试工具(Chrome的F12自带的功能和firebug插件差不多)

    前端开发必备调试工具(Chrome的F12自带的功能和firebug插件差不多) 一.总结 Chrome的F12自带的功能和firebug插件差不多 二.前端开发必备调试工具 在前端开发中我们经常会要 ...

  3. 在半小时内从无到有开发并调试一款Chrome扩展(Chrome插件/谷歌浏览器插件)

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_120 就在不久之前,我们目前这个毕业班的班长那日同学和我说,他正在公司开发Chrome扩展,看起来很高大上的技术,实际开发却非常简 ...

  4. 前端开发中的一些chrome插件推荐

    这篇博客推荐的都是谷歌chrome浏览器插件,理论上,与之相同内核的浏览器都能使用.由于是谷歌插件,所以在天朝的网络,你懂的! 红杏 专为 学者 .程序员.外贸工作者 打造的上网加速器.我们相信,上网 ...

  5. 【开源】前端练手笔记,Chrome扩展应用程序(html+CSS+JS) (1)

    项目名称:github-notification 项目地址:https://github.com/WQTeam/github-notification 说明:本人打算抽时间学习前端(html + cs ...

  6. 前端开发必备 40款优秀CSS代码编写工具推荐

    摘要:CSS工具可以简化工作流,可以提高CSS编写速度,是开发者和设计者所不可缺少的.本文列举了40种CSS工具,功能涉及CSS菜单.动画.3D图形.响应式页面.图层.按钮等界面元素的设计与制作,你定 ...

  7. [转]前端开发必备 40款优秀CSS代码编写工具推荐

    编写工具地址如下 英文地址:http://webtoolsdepot.com/40-css-tools-to-improve-your-productivity/ 中文地址:http://www.cs ...

  8. 十款 Chrome 扩展工具,提高前端编码效率

    1. 掘金 Chrome 插件 对于开发者来说,比开发过程更重要的,应该要算平时对于开发资源以及技术文章一点一滴的积累了吧.那么,开发者能够在哪里获取需要的技术内容呢?过去,你可能需要在 GitHub ...

  9. Chrome浏览器扩展开发系列之八:Chrome扩展的数据存储

    Google Chrome浏览器扩展可以使用如下任何一种存储机制: HTML5的localStorage API实现的本地存储(此处略) Google的chrome.storage.* API实现的浏 ...

  10. 开发人员必备的 Chrome 扩展

    Firebug:不用多介绍了吧 https://chrome.google.com/webstore/detail/bmagokdooijbeehmkpknfglimnifench ChromeSni ...

随机推荐

  1. Lazada商品详情(代码封装)以及应用

      编辑切换为居中 Lazada平台的分析可以从以下几个方面入手: 1. 市场分析:对Lazada平台市场进行分析,及时了解市场趋势和变化,调整企业的经营策略.可以监测Lazada平台上商品的销售量. ...

  2. WPF 自定义窗体(一)

    .Net默认的窗体样式只有四种:None.SingleBorderWindow.ThreeDBorderWindow.ToolWindow,都比较"丑".而很多时候,我们希望自定义 ...

  3. 4.go语言复合类型简述

    目录 1. 本章前瞻 2.来自leetcode的例题 描述 分析 题解 3. 复合类型新版本的变化 3.1 string和[]byte的高效转化 3.2 内置函数clear 4. 复合类型概述 4.1 ...

  4. .NET6.0实现IOC容器

    .NET6.0实现IOC容器 IOC的作用这里省略-只对如何使用进行说明. 1. 创建一个.NET6应用程序 这里使用 .NET6.0 WebAPI 应用 2. 声明接口 public interfa ...

  5. Vue vs React:你需要知道的一切

    Vue 和 React 是创建 JavaScript 网络应用程序最常用的两种工具.但我们该如何在两者之间做出选择呢?在本篇 Vue 与 React 的对比中,我们将尝试找出答案.我们将回顾每种工具的 ...

  6. Falcon-7B大型语言模型在心理健康对话数据集上使用QLoRA进行微调

      文本是参考文献[1]的中文翻译,主要讲解了Falcon-7B大型语言模型在心理健康对话数据集上使用QLoRA进行微调的过程.项目GitHub链接为https://github.com/iamaru ...

  7. Docker部署中间件

    Docker 安装 1. 卸载旧版本 sudo yum remove docker \ docker-client \ docker-client-latest \ docker-common \ d ...

  8. 解决Dependency 'fastdfs-client-java’not found

    如何能把 fastdfs的jar包安装到本地的仓库中(因为中央仓库没有FASTDFS的jar包地址) 1.首先去github上下载下来fastdfs的压缩包 下载链接 然后直接解压出来 2.使用cmd ...

  9. 如何用ppt打印9张一面,并且去除边距?

    如何用ppt打印9张一面,并且去除边距?      方法其实很简单,答主不要在ppt软件的打印选项里设置[每页打印9张幻灯片],而是使用默认的[每页打印1张幻灯片]. 然后去[打印机属性]里设置,我是 ...

  10. TIM-有感BLDC转速解析

    TIM-有感BLDC转速解析 1.基本概念解析 霍尔传感器的原理:通电线圈产生的磁场会使得转子所在位置会产生磁场,其中离得最近的霍尔传感器的磁场最强,进而导致最近霍尔传感器会产生最大的电压信号,这个最 ...