VS Code 一些有意思的新特性 - Web Worker

前几个月拿到了 GitHub Codespaces 的 beta 版测试资格，正好这段时间也一直在做 KAITIAN 的架构改造，也参考了一些 VS Code 的实现，由于内容比较杂，所以把遇到的一些有意思的点分享一下(水一篇)。

Web Worker 扩展线程

看过专栏第一篇文章的同学应该知道，VS Code 插件运行在一个独立的 Node.js 进程中，这一架构也是社区开源的 Thiea 以及我所在的团队自研的 KAITIAN IDE 所采用的。在这个背景下，要想使用扩展能力，就必须在为每一个会话启动一个容器环境，以便能运行扩展以及实现文件编辑。在过去的一年，我们遇到了一些更个性化的定制需求，例如期望在没有容器的环境下能够复用编辑器+插件的能力，这有点类似早期的 CodeSandbox。

在这个过程中，我们将 KAITIAN 的文件系统进行重构并抽象成一层可替换的底层接口。这样一来便可以在不使用 Node.js 能力的情况下使用诸如 BorwserFS、MemoryFS 来为编辑器提供文件读写能力。

而对于插件我有个模糊的想法，是否可以将插件借助这个能力运行在纯浏览器环境下，例如 Web Worker 这种浏览器原生的多线程能力。经过短暂的尝试，将第一个插件(vscode-html-language-features)移植到 Web Worker 版本的过程中，偶然发现 VS Code 官方也有类似的方案，而经过更多的挖掘(啃源码)，VS Code 也正在试图将编辑器与一些核心插件改造为纯浏览器可用的版本。

如果你打开最新版本(1.52 + )的 VS Code 设置并搜索 Worker ，则会发现在 Extensions 设置项中，有一个 Enable web worker extension host 选项。但实际上即便开启了这个选项，也不会有任何作用，不知道是不是实验性特性忘记关闭了。

不过你仍然可以通过这个 VS Code Web Playground 来体验 Web Worker 扩展。

怎么判断加载的是 Web Worker 扩展呢？打开 Dev Tools - Network 标签，可以看到加载了很多 web worker 脚本。这其中就包含 Emmet、Merge Conflict、以及 TypeScript Language Features 插件。

当然这只是测试版本，预计不久的未来就可以在 GitHub Codespaces 里体验到 Web Worker 版本的插件了。

TypeScript 的 tsserver.web

带着好奇心，我在 TypeScript 仓库里搜了一圈，发现了一个来自 VS Code 团队的 Pull Request。

Adds experimental support for running TS Server in a web worker #39656 ​ github.com

目前这个 PR 经过 TypeScript 团队的 Review 已经合入了主分支，预计在 ts 4.2 版本就可以体验到。

关于具体的原理性解析有空我会写一篇文章来介绍(一定不鸽)，当然略微熟悉 TypeScript 架构的同学从这个 PR 的内容应该也可以理解个大概。

所有的插件都可以运行在 Worker 线程吗？

很可惜答案是否定的，诚然 Web Worker 插件在 VS Code Web（或者说 Cloud IDE）环境下相比传统的 Node.js 插件有较大的优势，大幅度减小了 B/S 架构下的通信消耗，但也并不代表 Worker 插件可以完全替代所有 Node.js 插件。

Worker 能替代的是那些仅依赖或者完全不依赖文件读写的插件，但对于 Debugger、Terminal 这类插件，无论如何都无法通过 Worker 来模拟。

PS: 题图终于可以用我自己拍的照片了 ^_^