Jetbrains Mono 这几天刚刚发布,话不多说,也没什么表情包了,我们来简单评测一下,Jetbrains Mono、FiraCode、Source Code Pro、Consolas哪个才是开发人员的心头好?
一、评测前期准备
鲁迅有云:工欲善其事,必先利其器
Font 资源下载
-
Jetbrains Mono
-
FiraCode
-
Source Code Pro
-
Consolas
VsCode 设置
由于Jetbrains Mono
、FiraCode
都是具有编程连字的等宽字体,VSCode要启用连字特性还需要做一些设置,同时为了方便评测也用到了Font Switcher插件,请提前安装好这个插件哦!
首先,我们通过 preference/settings 打开设置页面,进行快捷操作,也可以直接编辑setting.json
文件,如下:
// settings.json
{
// ...
"editor.fontLigatures": true, // 是否启用字体连字
"editor.fontSize": 14, //设置字体大小
"editor.fontWeight": "normal", //设置字体粗细
"editor.fontFamily": "'Jetbrains Mono'",
"font-switcher.enableLivePreview": true,
"font-switcher.fontFamily": "'Jetbrains Mono','Fira Code', 'Source Code Pro', Consolas, 'Courier New', monospace",
}
Ctrl+Shift+P
打开命令面板,键入Switch Font,然后就可以肆意地切换字体啦🎉!
二、测评开始
笔者信奉“一图胜千言”,“一千个人心里有一千个哈姆雷特”,我们先来看各个字体的实际效果吧!ps:由于笔者是前端开发小菜鸟,于是下文会以Vue的模板代码来作为测评基准
Jetbrains Mono
FiraCode
Source Code Pro
Consolas
本次测评使用的代码模板 Code Template
<template>
<div class="home">
<HelloWorld msg="Welcome to Your Vue.js App" />
</div>
</template>
<script>
import HelloWorld from "@/components/HelloWorld.vue";
export default {
name: "home",
components: {
HelloWorld
},
methods: {
/**
* ABCDEFG abcdefg
* 1234567890 这是一段评测文本
*/
foo: (name, age) => {
name = name == "Foo" ? "A real foo" : "Are you ok?";
return age >= 35 ? "淘汰" : "996";
}
}
};
</script>
笔者不成熟的小总结
作为一枚不成熟的前端开发,深知我敲的每一行不是代码,是Bug!呸,是艺术和禅学!
而一款优秀的字体能够帮助我们形成整洁的卷面,以后要是有产品经理过来找Bug,我们至少拿到了卷面分不是~
对于笔者而言,首先做排除法,由于Source Code Pro
和Consolas
不具有连字的功能,所以不幸被笔者排除在外。
连字为什么好?这里引用Jetbrains Mono页面上的一段话:
连字是由两个或多个连接符号组成的字符。传统上,它是作为节省空间的技术引入印刷文本中的。在代码中,此技术用于显示运算符,主要用于两个目的:
- 通过合并符号和删除细节来减少噪声,从而减少了对眼睛的劳损。
- 在某些情况下,通过移动字形可以更有效地平衡空白。
然后,Fira Code
看上去觉得没有Jetbrains Mono
清晰,看久了眼睛会觉得糊(这个可能也跟后者的优化设计有关,请戳其官网查看特性)。OK,本次测评的冠军诞生啦,它就是Jetbrains Mono
!麻烦Jetbrains的工作人员看到这里,请给我打钱💰,我的支付宝账号是157XXXXXXXX ~
当然,除了本文提及的4款字体,当然也有很多其他优秀的字体被大家钟爱,欢迎在评论区留言~
恭贺新禧,新年快乐🎊!
掘金上的Dawnlck在掘金也欢迎关注哈~逃了逃了~
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。