【应用推荐】高度可定制的新一代浏览器vivaldi，chrome用久了也该换换口味了

快来打我* 2021-07-26 17:12 486阅读 0赞

### 【应用推荐】高度可定制的新一代浏览器vivaldi，chrome用久了也该换换口味了 ###

*  写在前面
 *  初识vivaldi
 *  vivaldi 亮点功能
 *  我的vivaldi

# 写在前面 #

仍记得在上大学之前，一直都用的是国产360极速浏览器，后来上了大学，室友给我推荐了chrome浏览器，在很长的一段时间里，我一直都是chrome忠实追随者。一是丝滑的浏览体验，二是丰富的扩展应用。随着近两年edge的呼声越来越高，平时也用用Edge，当始终没有chrome那种亲切感。直达有一天无意发现了edge的侧边栏标签功能，简直是开发者的福音。放两张图给大家感受下垂直标签页的魅力。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70]![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 1]  
edge的这个功能让我不得不重新审视目前的浏览器市场，长时间使用chrome让我对外界的东西已经变得陌生了，但是习惯了chrome后，又本能的排斥其它产品。于是我报着希望搜索了chrome设置垂直标签页相关的文章，得到的零碎信息告诉我chrome并没有设置垂直标签页的相关功能，于是我又搜索了相关的插件，果然市场上确有相关的插件，经过测试和筛选发现以下两款插件相对做的不错。  
**1. Treely: Tree Style Tab Manager** 插件界面如下

*  优点：UI美观简洁，结构化展示，层次分明
 *  缺点：悬浮面板，不能固定，触发时会有短暂抖动影响阅读体验  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 2]  
    **2. Tabs Outliner** 主要界面如下
    
     *  优点：悬浮面板，可自由拖放，界面可调节
     *  缺点：同Treely，无法固定，且需要手动触发，操作不方便  
        ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 3]

# 初识vivaldi #

就当我带着chrome垂直标签页的执念在各大知识平台搜索解决方案时，一位网友的回答，让vivaldi帧数进入的我视野（一开始还以为是个浏览器插件，一搜才知道是一款浏览器产品）  
对于一个使用chrome数年的老用户来说，换掉chrome肯定是需要一番考量的，但是我浏览了vivaldi的官网后，完全打消了我的顾虑。官网介绍的功能太多，我简单列一下我看中的几个功能，详细内容大家可自行前往官网查阅。[vivaldi][]

# vivaldi 亮点功能 #

*  **支持4种标签分布方式**，分布是顶部（同大部分浏览器）、底部、左侧、右侧（同edge）
 *  **支持多种主题配置**，不同于chrome的扩展主题，vivaldi允许用户自定义主题
 *  **支持面板视图**，面板视图是一个不同于其它浏览器的新功能，其中包括常规的下载面板、书签面板，历史记录面板。还有一个非常实用的网页面板（用手机模式打开网页）这个功能可以说是非常实用了，不论是摸鱼划水，查阅参考资料都是非常的方便，甚至还可以调试移动端网页。开启网页面板的效果如下图：  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 4]
 *  **丰富的方便的快捷键**，支持修改和自定义
 *  开发利器，**支持标签平铺，垂直，网格显示**（类似vscode）平铺效果如下，可自由调节页面大小  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 5]
 *  底层实现**广告拦截**，无需利用插件
 *  当然作为chromium的套壳浏览器，**无缝支持chrome插件**
 *  **高度自定义**，主要分几个区域，菜单栏、地址栏、标签栏、书签栏、状态栏、面板栏。  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 6]

# 我的vivaldi #

上面的把所有面板放到一起看着花里胡哨的，实际上所有面板都可以隐藏的，可随时通过快捷键访问。下面分享一下我设置的界面。

*  大多数时候是这样的  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 7]
 *  唤醒面板栏  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 8]  
    另外还有一个比较nice的功能是菜单栏的主题会跟随当前网站的主题色，比如下方访问知乎时菜单栏是知乎蓝，访问CSDN时菜单栏自动过渡到CSDN的主题色，页面整体看起来非常协调，完全不出来是浏览器，到像是桌面应用。  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 9]

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 10]  
好了，vivaldi就介绍到这里，喜欢的朋友赶紧DIY起来吧  
[vivaldi官网][vivaldi]

--------------------

本文同步发布于个人G众号【**前知识营地**】（收集&分享前端相关的知识、应用和和工具，平时也会分享一些生活、工作中使用的高效应用、工具、浏览器插件、vscode插件等。）期待各位看官的关注！

--------------------

（完）

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20210531222853210.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 1]: /images/20210726/f6861683f1944ccb8379e4a4615d74f2.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 2]: /images/20210726/25a02d2947974fb9915554abf9f65ecc.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 3]: /images/20210726/2fc35428bff24497a4b7c2b7cdb141df.png
[vivaldi]: https://vivaldi.com
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 4]: /images/20210726/93c0b23848e94df181d61d6a21ff79e3.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 5]: /images/20210726/7c3e045ae8ba476088a2593528abc5f1.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 6]: /images/20210726/5080ac5beeda42d09c79e2a7c7b9bf3b.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 7]: /images/20210726/5e8f934763044af9b2133bbff5a925b1.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 8]: /images/20210726/2206c6aaf53c42a6acd3f1cb7a5090cd.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 9]: /images/20210726/ac22cd6f82cb4bee8cb5022f31b24fca.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDY3MDk3Mw_size_16_color_FFFFFF_t_70 10]: /images/20210726/37b9bc5798894e5eb377fc46fd53bb1a.png