Notion 编辑器是怎么实现的？
本文写于 2020 年 12 月，当你读到本文时文中提到的部分 Notion 内容可能已经过时，望读者知晓 Notion 是一款 All in one 的协作工具，集个人笔记，知识管理以及项目管理于一身。作为一个笔记软件爱好者自然早闻大名，早在两年前就开始使用 Notion…
使用 Telegram Bot + Beancount 记账
由于最近听的捕蛇者说的这期播客节目，去了解了一下经常听到但是从来没去了解过的 Beancount，看了几篇网上的博文 初步使用了几天。Beancount 的记账模式我非常的喜欢，但是美中不足的是基于文本很难能够进行随手记录。 发现了一款需要注册的 Beancount…
写给 VS Code 用户的 Vim 入坑指南
现实当中使用 Vim 来写前端的人是少之又少，大多数人基本上都是使用 VSCode。但作为「编辑器之神」，不管使不使用 Vim 进行编码，学习 Vim 的编辑模式都是有好处的。 本文会从最基本的使用和配置开始介绍作为前端工程师怎么从零到一到开始使用 Vim…
使用 TiddlyWiki 进行个人知识管理
近一段时间在研究个人知识管理，期望能够找到一个好用并且能够长期使用的「非线性笔记」软件来进行管理。近期比较火的 Roam Research 与 Notion 都尝试过，但可惜的是两者都有些地方我不是特别满意。最后我选择了 TiddlyWiki…
用 RIME 定制输入法
一直以来我都希望能够有一款输入法能够让我高度的进行自定义，就像 Vim 一样能通过配置文件来进行配置。发现 Rime 正好符合我的需求，加上最近在学习双拼，便折腾了起来。 什么是 RIME？ RIME…
为网站添加 dark mode 支持
本文主要介绍如何通过 prefers-color-scheme 来为网站添加 dark mode 支持，另外还赠送一些 prefers-color-scheme 在 tailwind.css 与 React 中的实践。 那么 prefers-color-scheme…
如何实现一个 Babel Macros
通过 babel 插件，我们很容易的就在编译时将某些代码转换成其他代码以实现某些优化。例如 babel-plugin-lodash 可以帮我们将直接 import 的 lodash 替换成能够进行 tree shaking 的代码；通过 babel-plugin-preval…
关于 tapable 你需要知道这些
在阅读 webpack 前如果不了解 tapable 的话，很有可能会看得云里雾里，那么 tapable 到底是什么，又有什么用呢？本文主要介绍 tapable 的使用以及相关实现，通过学习 tapable 能够进一步的了解 webpack…
你可能不知道的 Node.js util 模块
作为 Node.js 的内置模块，其实 util 模块中包含了许多实用的工具函数。这篇文章主要介绍其中的两类函数：函数转换类（callbackify/promisify/deprecate）与调试辅助类（debuglog/inspect）。 函数转换 callbackify…
如何使用 Hammerspoon 实现剪贴板历史
写在前面 Hammerspoon 是一款 macOS 下的自动化工具，软件本身几乎没有什么功能。所有的功能都需要以 lua 脚本的形式编写，放置在 ~/.hammerspoon 下。Hammerspoon 会通过 lua 脚本直接调用 macOS 本地提供的 API…
从 /register 到 node.js require()
通常我们会用 babel 来将浏览器未兼容的新语法编译为兼容的代码，以便在旧浏览器或者环境下运行。 除了编译运行外，babel 还提供了 /register 来即时编译运行。 如何使用 /register 使用 /register…
React 初始化渲染
本文将阅读 React 初始化渲染相关的代码，并实现一个简单的将 JSX 渲染到页面的功能。（不包括组件生命周期与事件处理相关部分） 源码解析：渲染过程 JSX 解析 我们知道在 React 组件render() 返回的是 JSX，而 JSX 将会被 babel 转换。JSX…
开始使用 Neovim
很久之前就听说过 Neovim，但一直没有怎么了解过。昨天下午折腾了一下，彻底转投 Neovim 了。 虽然说这两货的差别目前还不是很大，但是 Neovim 实现了嵌入式终端模拟器，Excited! 各种 REPL 插件统统都可以卸载了！ 迁移配置文件 Neovim…
从零开始制作 Hexo 主题
写在前面 本文将会从零开始开发一个简单的博客主题。样式主要参考 Hexo theme 中的 Noise 主题。 开始之前你需要了解： 模板引擎 CSS预处理器 Hexo 文档 本文使用的模板引擎为 ejs，使用的 CSS 预处理器为 stylus。这也是 hexo…
如何减少浏览器回流
什么是浏览器回流 浏览器在显示网页时，需要计算每一个元素应该放置的位置，这个计算过程就称为浏览器回流（browser reflow）。回流会重新计算页面的布局，在回流中会重新计算元素的尺寸与位置，并且也会触发对子元素的回流。 触发浏览器回流的操作： 在 DOM…
从 optimizeCb 说起
optimizeCb 在 underscore 中的内部函数 optimizeCb，顾名思义就是 optimize callback，即优化回调函数。 optimizeCb: 它是这样处理回调的，当回调函数指定上下文环境时，根据 argCount 来分情况使用 call…