Chrome浏览器Tab开太多了,怎么办-阿里云开发者社区

开发者社区> 开发与运维> 正文
登录阅读全文

Chrome浏览器Tab开太多了,怎么办

简介: # 背景 在日常工作中,我想大家应该都有一个烦扰,Chrome浏览器的Tab开得太多了,找到需要使用的Tab太难了,过多的Tab也会导致系统性能下降。为此,我上chrome应用商店寻找可以解决这个问题的拓展程序,尝试了很多拓展程序,没有找到一个满意的拓展程序。 为什么不自己动手做一个自己想要的拓展程序呢,于是我就开始了chrome拓展程序开发之旅。首先,我将介绍我开发的拓展程序SortYo

背景

在日常工作中,我想大家应该都有一个烦扰,Chrome浏览器的Tab开得太多了,找到需要使用的Tab太难了,过多的Tab也会导致系统性能下降。为此,我上chrome应用商店寻找可以解决这个问题的拓展程序,尝试了很多拓展程序,没有找到一个满意的拓展程序。

为什么不自己动手做一个自己想要的拓展程序呢,于是我就开始了chrome拓展程序开发之旅。首先,我将介绍我开发的拓展程序SortYourTabs,然后,简单介绍下如何开发一个拓展程序。

SortYourTabs已经发布到chrome应用商店,欢迎安装使用。SortYourTabs项目的代码已经上传到GitHub,欢迎下载或贡献

SortYourTabs

简介

SortYourTabs拓展程序的作用正如名称所述,它可以帮助您记录访问Tab的时间,并可以按照最近最少使用算法(LRU)对您的Tabs进行排序,您就可以快速找到您最近使用的Tab,您也可以快速找到最近都没有使用的Tab,然后及时把不需要的Tab关闭,避免Tab累积得越来越多,影响系统性能。

在使用该拓展程序时,如果有一些经常使用且不能关闭的Tab,您可以将该Tab固定,固定的Tab将不会被重新排序。

使用介绍

  1. 安装后第一次使用时,请使用快捷键Ctrl(Win)/Command(Mac)+Shift+1进行初始化,拓展程序将开始记录您访问Tab的时间。下次如果想重新初始化记住当前Tab排序时,同样可以执行该命令;
  2. 使用快捷键Ctrl(Win)/Command(Mac)+Shift+Right将Tab按照LRU从左到右排序,最右边的Tab为最近使用的,最左边的除固定Tab是最近最少使用的;
  3. 执行2中快捷键对Tab排序后,如果想恢复最初的排序,则使用快捷键Ctrl(Win)/Command(Mac)+Shift+0。

如何开发一个拓展程序

文件结构

拓展程序的开发需要使用前端技术体系,如JavaScript、CSS、HTML。你可以选择任何一个你喜欢的文本编辑器进行开发,我使用的是vscode。首先,我们需要创建一个文件夹,文件夹名称为你的拓展程序的名称。然后,在该文件夹中创建一个必要的文件manifest.json,可以参考SortYourTabs。manifest.json文件中permissions表示需要申请的权限,commands表示定义的快捷键,scripts表示拓展程序的脚本,这里也是主要的逻辑代码。
scripts中指定了运行的js脚本,主要的业务逻辑就在这个js脚本里面,因此接下来就是在这里开发你的业务逻辑。接下来你将需要了解chrome提供给开发者的API有哪些。

API

chrome开发者社区为我们提供了非常详细的资料,同时也详细介绍了如何开发一个拓展程序,如果有什么疑问,这里无疑是最好的资料。如果你不知道需要使用什么API,你可以通过搜索关键字查询。

image.png

Debug

使用chrome浏览器[点击打开拓展程序安装页面](),打开页面右上角开发者模式,然后从页面左上角选择加载已解压的拓展程序,选择你的开发文件夹,拓展程序就安装好了。找到你安装的拓展程序,点击背景页(如下图所示),这时就出来了一个console,拓展程序的所有输出和debug都在这里。如果需要在代码中加入断点,可以在代码中需要断点的位置加上一行代码“debugger”。

image.png

发布

使用chrome浏览器点击打开开发者中心页面,首先你需要注册成为chrome应用开发者,并且需要支付5美元的费用。很多人可能并没有visa信用卡,这该怎么办呢,我找到了一个神奇的网站:全球付,在全球付网站上面注册一张MasterCard,最低充值金额是50美元,可以使用国内银行卡进行快捷支付。

image.png

image.png

接下来你就可以开始上传你的拓展程序了,你需要将你的文件夹打包成zip格式的压缩文件,并填写拓展程序的信息。根据你拓展程序使用的权限会花费不一样的时间,如果你的拓展程序不需要申请使用比较敏感的权限,提交审核后几个小时就通过了。这个时候你上应用商店还并不能搜索到你的拓展程序,你可以点击你的拓展程序进入到拓展程序的安装页面。

image.png

image.png

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

分享:
开发与运维
使用钉钉扫一扫加入圈子
+ 订阅

集结各类场景实战经验,助你开发运维畅行无忧

其他文章