IDE:VS Code 配置同步

内容列表

利用一款插件来同步 VS Code 的配置到 GitHub 的 gist 上,实现多个设备间共享一套配置。

VS Code

Visual Studio Code 是由微软出品的一款轻量级编辑器,兼有部分 IDE 功能。在之前,Sublime Text 是最受欢迎的编辑器(开源),也为多数前端开发者所推崇,当然说到底它依然是个编辑器。随着时间的推移,GitHub 打造了自家的编辑器 Atom,微软的 VS Code 也横空出世,更有其它优秀的轻量级编辑器在市场上展开角逐。不过,到现在来看,VS Code 可能胜出了,已成为前端开发的利器。

前端开发的工作流向来是个令人头疼的问题,虽然说现在利用 gulp、grunt、webpack 可以解决大部分问题,但要换台电脑重新配置一遍那真的是令人不敢想象的事情。而且,开发过程中大量依赖了 VS Code 插件提高了开发效率,但要换台电脑重新配置一遍编辑器,装一遍插件那也是相当头疼,时间都浪费在了重复性工作上。

Setting Sync

Setting Sync 插件恰好就是为了解决多个设备间编辑器和插件配置同步难题的。

Setting Sync : https://marketplace.visualstudio.com/items?itemName=Shan.code-settings-sync

这个插件大概的原理就是将本地的 VS Code 的配置文件和插件配置同步到 GitHub 的 Gist 服务器上,然后在另一台设备上可以通过 Gist ID 和 Token ID 下载配置,即实现了多个设备间配置共享。

插件的使用步骤在它的说明页面很详细,大概就是以下几步:

  • 在 GitHub 上新建一个 Personal access tokens,保存 token id
  • 在 VS Code 中安装 Setting Sync 插件,然后输入 token id,上传配置信息,得到 gist id
  • 在另一台设备上的 VS Code 中安装 Setting Sync 插件,然后输入 token id 和 gist id 即可同步配置

总结

现在vscode官方登录功能已经上线了,所以这个插件已经没有太大意义了,不过可以了解一下。

相关

git依赖包发布

最近在开发npm包,需要发布到内网或者公网,便于是乎调研有多少种方案

了解更多

Web 前端性能优化:批量 DOM 操作 - FastDOM

利用 JS 开发的原生应用与依赖于 React.js/Vue 开发的框架/库应用,性能孰高孰低?这两者最显著的区别在于原生应用需要手动操作 DOM 完成业务,而框架/库应用是基于数据变化响应式的应用,后者只需要关注数据如何变化,至于体现在 DOM 上的变化皆由框架/库内部自动完成。所以,要搞清楚两者的性能优劣,可能批量的 DOM 操作是一个不可忽略的核心因素。从代码执行的角度分析,框架/库也是基于原生 API 进行的封装抽象,因此代码执行时的路径更长、堆栈更深,由此可见原生 API 的操作性能应该是最高的。但是,现实情况是业务通常来说是复杂的,代码实现中 DOM 操作的逻辑分散在各处,那么多个 DOM 操作之间是否会产生影响从而不利于性能?这个时候就要关注宿主浏览器的渲染机制是如何理解批量的 DOM 操作的,这里引入的概念就是关键渲染路径(Critical rendering path)

了解更多

DOM-文档片段

DOM 操作是非常消耗性能的,如果要进行大量的 DOM 操作,我们可以选择在内存中先构建一个文档片段然后一次性插入 DOM 树。

了解更多