2020 年的总结
工作工作方面，今年在工作上实际感觉少有成果
首先是年初的时候，因为疫情而在家中几乎蹉跎了整个 2-3 月，自然没有什么可做的
而后回到公司正常工作之后，实际上接手的是一个相当老旧的系统项目，我这一年大部分时间都投入到这个老旧项目当中
原项目是基于 gulp 和 angular 1.3 所构建的项目，说实话，在如此老旧的系统面前，保持其堪堪可用已经耗费了大量的精力，根本难以多有建树。
因此我在年中的时候花了不少时间做了一番工具开发环境的改造
迁移手脚架到 webpack 利用现代前端生态的种种优势
支持各种 cicd 自动发布，避免人工发布带来的弊端
持续重构大量难以维护的代码实践
至此才可以说整体的情况才稍微好了一些，但是
底层框架带来的性能损失实在太大
长久以来的历史包袱依然难解（单个源码文件 1w+行代码）
系统承载的服务之重，让完全重构的成本几乎无法承担。
可是，重点总在可是之后，迁移手脚架到 webpack ，部署 cicd ，这些工作对于这个项目来说确实是能提高可维护性的事情。
然而从我个人的角度而言，这些事情我不曾做过吗？我不过是在重复曾经做过的工作而已，麻烦却带不 ...
时间停止
背景/问题由于不得已需要在前端做一个路由跳转判断，其中是否判断需要请求接口，为了尽快触发判断，相关逻辑置于 head 里面尽早执行，形如
1234567891011121314<html> <head> <script> const shouldRedirectUrl = '' fetch(shouldRedirectUrl) .then(d =>d.json()) .then(({url})=>{ if(url){ window.href= url } }) </script></head></html>
将代码置于 head 确实能第一时间运行，然后问题是他需要等待一个接口的异步返回，之后才能做判断。
这就导致了实际判断逻辑需要等待非常长的时间。
因为当代码同步执行完，页面其他正常的资源就会开始加载，页面渲染也会不断进行。这个时候即使接 ...
如何通过 eslint-plugin 实现对校验结果的过滤
明确问题首先明确「只校验 git diff 内容的 eslint 校验逻辑」的含义，那就是只校验存在于 git diff 的文件内容，也就是被改动过的文件内容，同一文件其他地方即使存在 esilnt 问题也不校验提示
从最直观的角度来讲，我们可能会想输入入手，考虑如何将 git diff 的内容喂给 eslint 作校验，这样看起来就满足了需求。
不过，这有一个显而易见的问题
就是 eslint 的许多校验逻辑是需要上下文的，例如 unused-var 没有上下文，就无法判断是否没有被使用过。而我们处于变更的文件内容是不一定有上下文的，大概率只有零散的片段。
缺乏上下文会让 eslint 无法正确执行。
因此我们可以换一个思路，并不是在对输入动手脚，而是对输出作处理
具体实现做法并不困难，eslint 支持基于 eslint-plugin 自定义 processor 参照 https://eslint.org/docs/developer-guide/working-with-plugins#processors-in-plugins
其中 postprocess 这个 proces ...
神话之城中满是空虚之物
今天的两本书是
满是虚空之物
神话之城
满是虚空之物首先是 「满是虚空之物」，这本书也是我在图书馆流连的时候发现的的，是一本短篇漫画集。
原作应当是在推特连载的小短篇，不同于一般漫画连载，在推特上连载漫画更加随心所欲，篇幅短小甚至大都是完整的单页而没有分格，没有叙事注重于情感与第一印象的表达，不用拘泥于编辑的压力，更倾向于作者个人情感的一种宣泄。
说实话如果光看那些短篇，你会惊讶于居然可以出书。因此，本书相对于推特连载，做了一定的调整，首先是变得更加漫画，例如使用更多的分格增加叙事空间。故事篇幅从1页拉伸到3，4页。
此外，和推特的单页短篇相比，本书最大的不同在于给各个故事设计了一个温情结尾，不知道这是出于商业上的考量，还是作者自身思想上的转变。同时，虽然说是短篇，但是六个短篇环环相扣，算是做为短篇集的一个小伏线，颇为有趣。
虽然我对好的结局温情的结局相当受用，但我也在想某种角度上来说，本作所代表的那种负面情绪的展现力和他是短篇单页是相辅相成的。正因为他短，所以他必须只把最有渲染力的一刻展现出来，可一旦篇幅扩大，我们看见了整个前因后果，叙事节奏上的山峰山谷，而相对温情的结局又让我们 ...
文学少女见习生读后感
迟来的偶遇文学少女见习生系列，是文学少女系列的外传，设定时间点在正篇的一年以后，而出版时间也是在正篇完结出版以后一年左右就出版完毕，也就是这个外传系列也已经快十年以前的书了。
有趣的是我当时并没有留意到有这样一个外传，自然也没有读过。
而在几天前的国庆假期里，我到图书馆闲逛的时候，赫然发现一本有着竹冈美穗老师插画，以及文学少女标题的书本被放在了小说区的新书推荐当中。
正当我以为是正篇的某卷而走近仔细观察的时候，却发现这并不是正篇的任何一卷，放置其中的是见习生系列的最后一本。这时我才发现原来文学少女还有一套外传，而且在国内居然直到去年才翻译引进。
最终，我把见习生系列的三本书一次性的借了回家。
读后感在见习生系列故事中，虽然故事主体大体上还是本篇一样透露出一种哀伤的气息。但其整体基调却因为女主的缘故（元气属性）比正篇更加阳光一些。
而另一方面，我们的男主——井上心叶，既继承了远子学姐的文艺部部长之名，也继承了正篇故事中那个为观众解惑答疑，解决谜题的侦探角色，在 外传中为我们的文学少女见习生——日坂菜乃，解决谜题，指引前路。
这这种角色上的继承，恰恰印证了经历正篇故事后，心叶的成长，曾经需 ...
event loop: do not ask about the order
结论
microtask macrotask 的顺序依赖于 host 实现，我们不应该去依赖其顺序来实现具体逻辑
讨论一个基于 host 的顺序问题犹如孔乙己讨论茴香的茴字有四种写法一样
背景如果你面试前端，那你大概率对这个 issue 中的问题有所了解
这个问题不知从何时起成为了一个面试中常见的问题，各种文章解释也如雨后春笋出现，之前我也并没有深究过这个问题，但在群大佬的指导下我才发现：
这个问题，他或许并不合理
要回答这个问题，我们必须要抛开那些对顺序的讨论，回到一切的根本，最终的裁判，js 语言行为和表现的守望者，去探寻规范中对这种行为的真实定义
ECMA don’t care首先需要表明的一个事实。
尽管这个问题常常被归类为 js 问题，其实不然。
如果我们仔细看看，这个问题中最核心的内容：
Promise.then 回调的 microtask 是什么
settimeout 的 macrotask 是什么
以及 event loop 对两者的调度，（顺序如何
然而如果我们去查找 ECMA，就会发现
ECMA 并没有对 event loop 做定义，也不考虑 eve ...
initial, inherit, unset 与 revert
initial：initial 关键字用于设置 CSS 属性为它的默认值，可作用于任何 CSS 样式。（IE 不支持该关键字）
https://developer.mozilla.org/en-US/docs/Web/CSS/initial
inherit：继承父元素的定义，前提该属性可继承
https://developer.mozilla.org/en-US/docs/Web/CSS/inherit
unset： initial 和 inherit 的组合。 https://developer.mozilla.org/en-US/docs/Web/CSS/unset
如果该属性是默认继承属性，该值等同于 inherit
如果该属性是非继承属性，该值等同于 initial
revert：将属性值还原
https://developer.mozilla.org/en-US/docs/Web/CSS/revert
如果是在网站自定义的样式中使用，如果有用户自定义样式，则还原到用户自定义样式的属性值，如果该值不存在这还原到浏览器默认样式的属性值中
如果在用户自定义样式中使用，直接还原 ...
vue-reactivity-readonly
vue-reactivity readonly 阅读通过 readonly 可以设置一些只读的值，
123456789const original = { foo: 1, bar: { baz: 2 } }const wrapped = readonly(original)effect(()=>{ console.log(warpped)})// not effactwarpped.foo = 2
readonly 是对 createReactiveObject 的封装
12345678910export function readonly<T extends object>( target: T): Readonly<UnwrapNestedRefs<T>> { return createReactiveObject( target, true, // isReadonly 标记 readonlyHandlers, // 一般类型的处理 r ...
如何写一个简单的 tg bot
起因为了试用一下 vercel ，因此写一个转发 twitter 的简易 bot，bot 本身不难，主要还是把整个过程串联起来
其中实际用到的东西
vercel 提供 faas 服务，是 tg bot 的服务的
telegraf telegram 的api封装库，实际上没有深入使用，直接用 telegram原生 api 库也可以
iftt 中转
前期准备申请一个 bot要写一个 bot ，需要先申请一个 tg bot
这里可以参考 https://core.telegram.org/bots 进行 bot 的申请，非常简单，这里不作过多说明了
ps：申请 bot 的方式实际上也是通过一个 bot @bot_father 进行申请（
申请成功之后，你会获得一个 token 作为你的 bot 的认证 token，后续和服务的端沟通全靠他
twitter 账号与 iftt既然是 twitter 转发 bot ，那也必须要一个 twitter 账号。
iftt 中转接入其实原来我是想直接申请 twitter 的开发者权限直接使用 twitter sdk 的，无奈 twitter 的开发这 ...
《南北战争三百年》读后感
长久浸淫在各种小说戏剧等艺术化表达古代战争的大环境下，本书严谨的考究确实给我一个打开了一个全新的视角。
本书的题材主要是针对中国战争历史中的细节问题，同时有截取了大多数国人历史盲区的南北朝进行讨论。
无论是题材或是时间节点都非常令人感到新颖。
同时本身作者的导师，张国刚先生的序言也是对本身最好的总结，这里我就不班门弄斧，还是直接截取其说法吧。
本书有三个视角
兵种（骑兵，步兵）机器装备以及相关战术的演进，作者会从先秦到两汉追溯其起源
通过这一时期南北之间发生的若干战例。分析战略问题以及战争中各种复杂的因素（地理环境，军事技术，统军素质等）的影响
讨论战争本身和与个行为主体（政权）的关系，包括备战，财政，战争对政权运作的影响问题。
中国历史古迹浩如烟海，军事和战争的著作也十分的丰富，《新唐书兵志》更开启了正史中记载军事制度的传统。但是。即使是对于战争历史记载特别关注的《资治通鉴》，对于古代战争中兵种的运用，战术的细节展开，往往也是语焉不详。而这本书试图弥补期权是，功不可没，其中不乏真知灼见。
作者访谈播客这里推荐播客 中国古代真实的战争艺术，它请到了本书的作者李硕进行访谈，虽然讨论的 ...
