Origin of Ray

这周在极客时间上买了李兵老师的另一门课，关于Google V8原理简介的课程。很多知识点，包括V8的整体执行流程，变量是如何存储的，对象是如何快速检索属性的，函数是如何编译的，闭包是如何实现的，不同的调用方法是是如何影响堆栈的分布的等。

感觉内容很多，就继续原本的系列，这一次总结下我看完以后对V8执行JavaScript的流程的理解。

使用React也有两个月了，总结下这两个月在实战中以及自己买的课程中的关于React Hook的一些收获。

上一个博客大概讲了下babel-parser的工作流程，主要有两个内容，一个是Tokenizer把代码字符串拆分成Token数组，一个是parser把Token数组转换为AST树。

这一次就来仔细看看Tokenizer的逻辑。

上一篇文章分析 Babel 编译流程的时候，提到 Babel 会将 JS 代码转换成 AST（抽象语法树）。这种行为是一种通用的行为，无论什么编程语言都会将源代码解析成 AST，AST 不是 Babel 特有的，更不是 JS 特有的。

为什么要这么做呢？原始的 JS 文件是计算机是无法理解的，计算机也很难直接修改 JS 代码，但是转换成 AST 后，由于 AST 本质上是一组表示程序结构的对象，我们可以通过修改这个对象，间接的实现修改代码的目的。chrome V8 引擎也是这么做的，比起 Bable 更进一步的是，V8 引擎会编译 AST 生成字节码。

Parser的过程分为两步，第一步，词法分析，也就是编译原理中的有限状态机，将一段代码拆分为一个个Token，第二步，语法分析，将Token数组，转换为AST树。

这次我就看一下源码，简单分析一下这个过程。

最近接触了一点关于Babel的知识，产生了一些兴趣，于是就打算看一看Babel的原理，然后总结学习下，这东西太复杂了，就分多个博客来写吧，这篇博客主要讲两件事，第一，简单描述下Babel的工作流程，第二，简单介绍下Babel的项目结构，也就是微内核模式。

这周的工作中，有一个需求需要我去在前端生成一个决策树，于是去考察了很多开源的方案，下面这是我一开始调研的图表，大家可以看一下，根据自己的选择去挑自己合适的，最终我选的是G6。

其实G6的文档已经算是非常不错的了，那我写这篇博客的目的主要有两点：

• 根据自己的使用体验，重新组织成我习惯记忆的方式，方便以后自己查看。
• 总结一下使用过程中踩的几个小坑。

这里吐槽一句，G6对于TypeScript实在是太不友好了，所有的属性都是可选的，有时候写下来一堆问号

最近对如何开发一个VsCode的插件比较感兴趣，于是特意去读了一些插件的开发文档，主要看的是一个中文翻译的文档，不过这个文档并不全，基本属于重点功能的罗列，但是用来入门是挺好的，不过如果想要深入，还是要去看英文的文档。

大部分内容都比较简单，主要就是配置，就可以生效，我这次主要想总结的是如何开发一个全新的语言插件，也就是说，如果你想定义一门新类似JSX的语言，如果提供VsCode的支持，比如语法高亮，代码片段，标签自闭和，错误提示，自动补全等等。

这几个周算是把慕课上400大洋买的关于React最佳工程实践的课程听的七七八八了，剩下的主要就是两部分，一部分是一些交互的优化，还有一点点关于性能的优化，这两部分我感觉不是很急，可以在我的工作中去慢慢体会。

我目前在react方面的当务之急是，我只学了实践，但是很多东西我都不知道为什么要这样写，比如为什么要setState才能更新，hook是如何生效的，react fiber是什么等等，不了解这些，我感觉自己的react还浮在半空中，没有比较好的落地，所以下一步的计划就是去了解一下原理，至于是否要去阅读源码，下一步再说。

这篇博客的主要内容是读了一下几位国内外大佬的博客，先对react的fiber有个大概的了解

在接触Redux的内容时，不免接触了一些它的配套工具，一时之间被这些工具搞得有些混乱，不知道哪个是哪个，他们各自的作用与联系。这篇文章就来简单记录下我的查询结果。

首先说一下这几个工具，redux，redux-thunk，redux-toolkit，react-redux。

这周在工作中需要开发一个npm的package，是辅助其他已有的pacakge。整个仓库采用了monorepo的形式，记录一下整个过程中踩的坑和学到的新技术