Web 开发必备的 9 款浏览器插件

Web 前端常用插件 Web 前端常用插件 目录 工具类 浏览器增强类 表单类 图片类 图标类 UI 框架 UI 组件类 用户体验增强 动画 SVG 测试 其他类 Bootstrap相关类 Vue.js 相关 React 相关 小程序 GraphQL JS Plugins仓库 工具类 方便操作对象,数组等的工具库 underscore.js lo-dash与underscore.js的api基本一致。与underscore比其优势是,效率高;可自定义构建 Sugar在原生对象.. 阅读详情

你好,我是坚持分享干货的 EarlGrey,翻译出版过《Python编程无师自通》、《Python并行计算手册》等技术书籍。

如果我的分享对你有帮助,请关注我,一起向上进击。

创作不易,希望大家给一点鼓励,把公众号设置为“星标”,给文章点个“赞”和“在看”,谢谢大家啦~

Web 开发是一个既有趣又有挑战的工作,但也需要不断地学习新的技术和工具,以提高开发效率和质量。Chrome 浏览器作为 Web 开发者的首选浏览器,拥有丰富的扩展插件,可以帮助开发者在各个方面提升开发体验和效率。

本文将介绍 9 款 Web 开发中可以提高效率的 Chrome 插件,希望对你有所帮助。

1. Scribe:用AI写文档 📝

f35c08d299232851bc682af1a136bdf3.jpeg
scribe

Scribe 是一个 AI 驱动的文档生成和分享工具,可以让你通过点击记录按钮,自动创建步骤指南,包括文本、链接和截图。

Scribe 的 Chrome 插件可以让你在浏览器中直接使用 Scribe 的功能,无需安装其他软件,节省时间和空间。Scribe 可以用于创建和分享如何指南、标准操作流程、软件文档、培训手册等内容。

2. FireShot:网页截图利器 📷

ede4cb8178cc660c838cd1c962a6ab8e.png

FireShot 是一个网页截图插件,可以让你捕捉完整或部分的网页截图,并保存为 PDF/JPEG/GIF/PNG/BMP 等格式,还可以编辑、注释、上传、打印、发送或导出截图。

3. Lighthouse:网站性能审计 🚀

30d01c641af8ec7dc1074c4669ac8600.png
Lighthouse

Lighthouse 是一个开源的自动化工具,用于改进网络应用的质量。

当对一个页面进行审计时,Lighthouse 会对页面进行一系列的测试,并生成一个报告,展示页面的性能、可访问性、最佳实践、SEO 等方面的评分和建议。

Lighthouse 的 Chrome 插件可以让你在浏览器中直接使用 Lighthouse 的功能,无需安装其他软件。😊

4. Dark Mode:暗黑模式切换 🖤

569bd572fe5d21774f2d43a973e107f7.jpeg
Dark Mode

Dark Mode 是一个可以让你快速地将浏览器页面转换为黑暗模式的插件,有助于减少视疲劳和节省电量。Dark Mode 的 Chrome 插件可以让你在浏览器的工具栏上点击一个按钮,就可以轻松地开启或关闭黑暗模式。

你还可以在选项页面中选择不同的黑暗主题,或者将某些网站加入白名单,排除黑暗模式的影响。

5. CSS Peeper:快捷查看样式 👓

a6fa06aa59ea664335ec61183e2aa3f9.jpeg
CSS Peeper

CSS Peeper 是一个简单实用的 CSS 属性查看器,可以让你在鼠标悬停在网页上的任何元素时,看到该元素的 CSS 样式信息,包括字体、颜色、尺寸、边距、定位等

6. JSON Formatter:JSON 美化 📝

32217481337d338a3614b263c93b4db5.png
JSON Formatter

JSON Formatter 是一个专业的 JSON 数据查看和格式化工具,可以让你在浏览器中直接查看和编辑 JSON 数据,支持多种格式的转换和导出,还可以让你以树状图、代码、表格等多种方式展示 JSON 数据,方便阅读和分析。

7. What Font:识别字体 🎨

f9a9b9d171f276ca132c182054c69080.png
What Font

What Font 是一个专业的字体识别工具,可以让你快速地识别网页上使用的任何字体,包括字体名称、大小、颜色、重量等信息,还可以让你试用和下载字体。

8. Octotree:Github树形代码展示 🎋

289900b589f2307bee8c259d2bcad163.jpeg
Octotree

Octotree 是一款对GitHub和Gitee视图展示非常友好的插件,用于将Github 或者Gitee项目代码以树形格式展示,而且在展示的列表中,我们可以下载指定的文件,而不需要下载整个项目。项目结构展示非常清晰直观,推荐下载使用。

9. Grepper:代码搜索引擎 🔍

cfae967ff197a238f573a9cb8ec081cd.jpeg
Grepper

Grepper 是一个查询和回答系统,专为编程社区设计。它可以让你轻松地从网上获取代码示例。

文章已经看到这了,别忘了在右下角点个“赞”和“在看”鼓励哦~

- EOF -

推荐阅读  点击标题可跳转

1、VS Code 变身小霸王游戏机!

2、认知升级:模型与范式转换

3、超赞的 Python 编译器,单核提速100倍

4、高效的终极秘诀

5、Python 3.12 版本有什么变化?

👇关注我的公众号👇

告诉你更多细节干货

08e066ae7fe0344f709b2503839e902c.jpeg

欢迎围观我的朋友圈

👆每天更新所想所悟

lighthouse的介绍和基本使用方法 Lighthouse是一个开源的自动化性能测试工具,我们可以使用该功能检测我们的页面存在那些性能方面的问题,并会生成一个详细的性能报告来帮助我们来优化页面。 阅读详情

相关推荐

浏览器插件开发必备知识介绍

浏览器插件开发必备知识

u013558123的博客 820

WEB入门之二十 插件

10.1.1了解jQuery插件插件也可称为扩展,是一种遵循某规范的应用程序接口而编写出来的程序。jQuery的易扩展性吸引了全球无数开发者共同来编写jQuery的插件。目前已有成百上千个jQuery插件发布,并且数量在不断增加中。jQuery插件按作者分为两种:jQuery官方插件和第三方插件。前面学习的jQuery UI是由jQuery官方开发并维护的插件,而本节课要学习的是数量众多的第三方

张晨光老师的播客 1290

WebOperation.rar

有很多时候获取网页POST /GET的时候直接使用HttpWebRequest会影响主线程序的运行,视觉上有卡卡的感觉,因此封装了一个HttpHelper库,方便使直接调用就行了,支持代理 cookies 超时值自定义协议头,后期准备封装多线程下载之类的。

2024年Web开发者应知道的20款浏览器插件

给自己打个广告,我的前端面试、娱乐小程序 —— 工具人的工具箱在这篇文章中,我们将查看2024年对Web开发者有用的20款不同的浏览器扩展。所有这些扩展都可以在Google Chrome上找到,但大部分也在Firefox和其他浏览器中都有提供。一、ColorZillaColorZilla是一个颜色采集器和渐变生成器,可以用来获取网页中任何像素的颜色。这对于web设计非常有用,因为大多数时候,我们...

wang_yu_shun的博客 1633

Pixhawk变砖自救指南:从DFU模式到固件重刷全流程(附2.4.8实测)

本文详细介绍了Pixhawk飞控变砖后的自救方法,从DFU模式进入、固件重刷到高级恢复技巧全流程。特别针对国产版本boot0引脚未引出的特殊情况提供了解决方案,帮助用户通过QGC或Mission Planner地面站工具恢复飞控功能,适用于2.4.8等常见固件版本。

weixin_29168813的博客 338

永磁同步电机矢量控制(十一)——基于损耗模型的PMSM效率优化策略

本文深入探讨了永磁同步电机(PMSM)基于损耗模型的效率优化策略,详细分析了铜损和铁损的构成与建模方法,并提出了最小损耗控制策略的实现方案。通过与传统MTPA控制的对比,展示了在不同工况下的效率提升效果,同时讨论了工程实现中的关键问题与解决方案,为PMSM的高效运行提供了理论支持和实践指导。

7z8x2c4v6b9的博客 231

Visual Studio Code Web开发必备插件合集

新手入门:优先安装「基础必备插件」+「语法补全插件」(如Chinese Language Pack、Auto Close Tag、HTML CSS Support、JavaScript (ES6) code snippets),降低上手门槛;框架开发:Vue开发者必装「Vue 3 Snippets」+「Vue (Official)」,React开发者可补充「ES7+ React Snippets」(本文未列出,可自行搜索);效率提升。

梁辰兴的博客 1901

鸿蒙OpenHarmony技术:【Docker编译环境】

OpenHarmony为开发者提供了两种Docker环境,以帮助开发者快速完成复杂的开发环境准备工作。独立Docker环境:适用于直接基于Ubuntu、Windows操作系统平台进行版本编译的场景。基于HPM的Docker环境:适用于使用HPM工具进行发行版编译的场景。点击或者复制转到。表1Docker镜像介绍系统类型运行平台Docker镜像仓库标签标准系统(独立Docker环境)3.2小型系统(独立Docker环境)3.2轻量系统(独立Docker环境)3.2。

m0_62167422的博客 1445

web大前端必备的VSCode插件,常用的(15个)

Visual Studio Code 是由微软开发的一款免费、跨平台的文本编辑器。由于其卓越的性能和丰富的功能,它很快就受到了大家的喜爱。 就像大多数 IDE 一样,VSCode 也有一个扩展和主题市场,包含了数以千计质量不同的插件。为了帮助大家挑选出值得下载的插件,我们针对性的收集了一些实用、有趣的插件与大家分享。 1.Open-In-Browser 由于 VSCode 没有提供直接在浏览...

IT博客技术分享 3万+

FPGA实战:手把手教你用Verilog驱动4.3寸RGB触摸屏(附完整代码)

本文详细介绍了如何使用Verilog语言在FPGA上驱动4.3寸RGB触摸屏,包括时序设计、信号交互原理及完整代码实现。通过双计数器引擎设计和参数化模块,开发者可以高效构建800*480分辨率的显示驱动,并解决工程实践中的信号完整性和时序收敛问题。

rice5的博客 702

blenderproc 制作位姿估计数据集

blenderproc 制作位姿估计数据集 准备工作 1.首先需要去下载blenderproc的源码blenderproc,按照作者的readme文件进行编译。 2.其次需要下载bop_toolkit源码,链接如下bop_toolkit 3.说明:blenderproc主要用来生成数据,包括depth,rgb,位姿标签文件(scene_gt.json),bop_toolkit主要用来生成mask和mask_visib,scene_gt_info.json,用于判断物体的可见区域比例,如果遮挡太多考虑去掉。做

qq_43814359的博客 5698

Firefox必备的24款web开发插件

开发工具   Web Developer 1.1.8   https://addons.mozilla.org/en-US/firefox/addon/60    以工具栏的形式对网页的(X)HTML、脚本、多媒体、CSS、缓存、图象等多方面的实用工具。使我们能轻易的获得网页的更多信息,使我们进一步的了解当前所浏览的网页。   说明:超强的web分析工具,开发人员必装。   Firebu

到达的专栏 6448

STM32F103C8T6+HX711:手把手教你打造高精度智能体重秤(附完整代码)

本文详细介绍了如何使用STM32F103C8T6微控制器和HX711称重模块构建高精度智能体重秤,涵盖硬件选型、电路设计、软件开发到无线数据传输的全过程。通过完整的代码示例和校准方法,帮助开发者快速实现毕业设计或商业项目,打造具备物联网功能的智能健康设备。

h6i7j8的博客 1028

前端人员必备的9款web前端开发框架

近年来,Web技术的发展速度快得让人窒息,特别是最近几年一代又一代的变革一次又一次的创造。各大巨头又纷纷把技术转向HTML5和CSS3,各种企业级框架如雨后春笋般涌现。   那么今天我就给大家介绍几个在web界比较优秀的web前端框架。 一、Foundation框架   Foundation框架总体来看要比Bootstrap略显高大上一点,但他们俩的设计理念都是非常清楚的,Bootstrap有引导的意思,它尝试处理你项目中的一切所需。Foundation有基础、地基及支柱的意思,给你项目中强有力的创造与支持

qf2019的博客 4886

ultralytics.data.utils——utils.py子模块代码详读

ultralytics.data.utils——utils.py子模块代码详读

Together_CZ的博客 1720

【AutoSAR】【诊断栈】传输层CANTP

一、功能介绍 数据包发送放拆包分段发送 数据包接收方重组 流控 错误检测 二、参考协议 ISO 15765-2 三、数据帧格式 1、协议数据单元(PDU)格式 2、协议数据单元 - PCI格式 四、数据帧传输 1、单帧传输 CAN帧数据长度小于8字节(包括PCI信息) 无流控握手 PCI包含帧类型、数据长度和数据域 未使用字节填充 2、多帧传输 数据长度超过8字节 流控握手 定时控制 CAN帧类型包括: 首帧 流控帧 后继帧 3、多..

专注汽车软件开发、AutoSAR、车载以太网、SOA、EE架构。 1554

15个Web开发必备的Firefox扩展插件

Firefox是一款越来越热的Web浏览器,多种多样的扩展,主题,插件,是它快速流行的重要原因。Mozilla的网站上提供了许多扩展和插件的下载,由于众多开发者的支持,这些扩展和插件的数量也在随着需求日益增长,下面列举15款比较优秀的插件,仅供大家参考。 以下是15款火狐的插件,可以使得Web开发人员的开发工作更加容易: 1、 Aardvark:Aardvark可以让你从网页中选择元素...

389

蓝牙模块HM-10手册

蓝牙模块HM-10手册,该手册对蓝牙模块HM-10进行了详细的介绍和使用方法以及一些AT指令。

11款开发者必备插件,第1款简直神器!

添加微信:code_7steps,备注“进群”,邀请你加入大牛云集的技术交流群! 无论你是个入门开发的初学者,还是经验丰富的开发者,每天都会花费大量的时间在浏览器上面。 开发是一个知识体系相对灵活、开发领域,有很多内容我们无法全部记载脑子里,所以,就需要经常借助于浏览器,去搜索需要的答案。 我曾经有意识的总结过,以翻译工具为例,虽然我电脑上也安装了有道词典,但是,我几乎不怎么打开,我查词、翻译几乎都是使用Chrome插件沙拉查词。 因为,这让我触手可及,在我浏览网页过程中,不需要切换窗口,能够很.

jakpopc的博客 2011

pscad IEEE标准系统搭建说明

pscad IEEE标准系统搭建说明,包含典型的IEEE 9节点、14节点、30节点、39节点和118节点系统。内含标准测试系统的原始数据和潮流结果。

精雕软件(JDpaint) 5.5 绿色版

精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版

java web插件_程序猿必备的10款web前端开发插件五

原标题:程序猿必备的10款web前端开发插件五1.SVG实现的一组超华丽Loading加载动画Loading动画我们已经分享过很多了,大部分都是基于纯CSS3的,或者有些也有jQuery协助完成。比如这个10组蓝色风格的纯CSS3 Loading动画图标就非常实用。今天我们要分享的是一组基于SVG的超华丽Loading加载动画,利用SVG的路径特性,动态绘制形状和状态,从而产生Loading加载的...

weixin_30837611的博客 1104

程序员爱不释手的20款开发必备软件

在数字化时代,程序员扮演着关键的角色,他们的工作不仅仅是编写代码,更是创造了无限可能的世界。而要让这个创造过程更加高效和愉悦,选择适合自己的开发工具和软件是至关重要的。今天,我将为大家介绍一些程序员爱不释手的开发必备软件,这些软件不仅能够提升开发效率,还能使整个开发过程更加顺畅和便捷。无论你是新手程序员还是经验丰富的专业开发人员,这些工具都能帮助你更好地组织代码、调试程序、管理项目以及与团队成员进行协作。让我们一起来探索这些利器,让编码变得更加轻松愉快!整理不易,关注一波!!

小王博客基地 2万+

渗透测试必备火狐浏览器插件推荐

一键部署渗透测试中各种方便使用的插件我用夸克网盘分享了「插件」,点击链接即可保存。打开「夸克APP」,无需下载在线播放视频,畅享原画5倍速,支持电视投屏。链接:https://pan.quark.cn/s/6c80dc9f785e通过网盘分享的文件:插件链接: https://pan.baidu.com/s/1gBy3ymcB5EoWAS5Ko5jwBw 提取码: jay1。

m0_74786138的博客 1374
上一篇: 性能远超 pandas,又一款数据处理神器
下一篇: 神奇VS Code插件,秒级纠正代码错误!
codingpy
博客等级 码龄11年 1870粉丝 104原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值