Chrome扩展程序: Appoint Font 钦定字体 - 最暴力的字体设置扩展

长久以来, 我对 Chrome 上的字体设置扩展都是抱有怨念的, 这个世界上有一些很简单很直接的需求, 可就是没有人去完成.

在 Chrome Web Store 用 Font 作为关键字搜索, 你会见到各式各样的奇葩. 有的字体扩展干脆就是废的, 比如 Advanced Font Settings, 这个扩展程序的功能很全面, 差不多囊括了整个 chrome.fontSettings API 的功能, 然而没卵用: chrome.fontSettings API 的设计是有问题的, 它提供的 getFontList 方法给出的并不是能直接在 CSS 样式里使用的字体值, 大量有字重和没有字重的字体混杂在一起, 你根本无从得知哪些是有用的字体哪些是没用的字体. 于是 Advanced Font Settings 就刚刚好没法使用思源黑体: 如何在 Windows 版 Chrome 中将默认字体设置为思源黑体? - 知乎.

再看其他的字体设置扩展, 有很多用的都是部分強制メイリオちゃん这个扩展程序提供的 font-face 样式文件, 它定义了一大堆 font-face, 甚至针对 CJK 都有单独区分处理, 让人很是敬佩, 到这里还没有什么问题. 可那帮做扩展程序的是怎么想的呢? 把这个 CSS 文件抄过来, 改成微软雅黑的, 改成思源黑体的, 就是不会想着去做一个可以自定义字体的, 然后就当新的扩展发布了. 如果你要换字体, 就要手动替换样式文件然后创建一个新的扩展程序, 这是怎样的一种精神? 很多时候我真的不想说脏话, 但现实中就是有这么多只有用脏话才能描述的东西. 另外, 其实这个 CSS 文件也没卵用, 它的内容虽然定义很全面, 但根本没有必要, 在我这种粗人眼里其实就只有普通字体和等宽字体两种字体罢了, 而且大多数中文网页也只有这两种字体区别.

我自己也是够懒, 之前凑合着在 Stylish 写了一个 Noto Sans CJK & Monaco, 用的是最简单的强制修改页面 font-family 的方法, 不过我也是不懂为什么在有这种样式的情况下还会有人用我写的那个...

用着用着就感觉出 Stylish 的 2 个问题:

  1. 样式修改起来非常不方便, 用别人的样式也是一样.
  2. Stylish 对 CSS 本身有所限制, 既然这样我自己弄一个自动加载 CSS 的东西就行了还用你干嘛?

我觉得 Stylish 和油猴脚本这两个东西, 完全设计反了, Stylish 应该突破自身 CSS 的桎梏, 做一些原生 CSS 做不到的事情, 而油猴脚本应该直接加载 JavaScript, 让 JavaScript 代码能够与时俱进 (我就是用这种完全相反的思路做的 Gloria), 至少现在看来是这样的, 以至每当我看到那些折腾样式和脚本的人, 总觉得他们迟早有一天会改用倒立的方式走路.

Stylish 的方案太粗糙, 为了解决这个长久以来像积怨一般的字体切换需求, 我开发了 Appoint Font 钦定字体, 从此只需要打开扩展程序的选项, 就可以强制调整以后打开的页面字体, 只能说用起来感觉自己活在梦里.

标题里写了"最暴力的字体设置扩展", 是因为 Appoint Font 的原理非常简单粗暴直接, 它的运行原理是这样的:

  1. 通过 chrome.fontSettings.getFontList 获取一份很全面但是很没用的字体列表.
  2. 通过 Canvas 绘制列表里的字体, 将其与默认字体的绘制结果进行对比, 筛选出可以用的字体列表, 并区分出普通字体和等宽字体(极耗 CPU, 每次打开 Appoint Font 的选项界面都要等上几秒就是在干这个).
  3. 将得出的字体放在 select 元素里让用户选择, 当扩展知道你钦定了某个字体后, 会组合出一份用 font-face 替换原生字体的样式表.
  4. 每当有新页面打开, 将之前组合出的样式表插入页面.

我自己用的方案是这样的

Chrome 浏览器自带的字体设置:

除了等宽字体设置为 Monaco, 其他字体全部设置成 Noto Sans CJK SC DemiLight.

最小字号调整到 14px.

Appoint Font 设置: Noto Sans CJK SC DemiLight 和 Monaco.

显示效果还算不错, 现在 Windows 的 Chrome 53 也是 DirectWrite 渲染了, 可喜可贺.

如果你觉得 Noto Sans CJK SC DemiLight 在 Chrome 53 里显示得有些细, 可以试试别的字体.

安装

最近我通过Rollba(一个错误追踪服务)发现有用户使用过低的 Chrome 版本运行此扩展程序并遇到语法错误, 在此强调一下, 我的所有扩展程序都仅支持最新版本的浏览器, 如果你的浏览器版本还停留在 Chrome 4X, 请升级浏览器版本再安装扩展.

前往本扩展的Chrome Web Store页面直接安装.

Github

BlackGlory/appoint-font: The most violent extension about font setting.

最后抱怨一下, 在开发期间遇到不少问题, 比如 Chrome 出 bug 让 canvas.measureText 在本地和商店扩展的运行结果不同, 调试几个小时重启浏览器就解决了, Chrome 出现的这类傻逼问题总是搞得我一肚子火, 以后真的要把 Chrome 当 Windows 10 来看了. 说真的 Chrome 开发者信息中心有个低级到不能再低级明显到不能再明显的 bug 存在快一个月了也没人修我他妈也是服了管 Chrome 的那帮傻逼.

PS: 惊了, 我发出这篇文章后过了二天 Chrome 开发者信息中心的 bug 就被修复了.