前言 本文主要是笔者学习the-super-tiny-compiler的笔记整理，有感兴趣的同学可以直接访问github上该项目地址the-super-tiny-compiler，这里先做下简单的项目

前言 上周在群里突然被 @ 要我查看生产上出现的问题，由于这个项目比较老 (React15)，既没有埋点也没有接入错误监控，于是会得到如下的这样一个提示信息（以下错误是本地模拟的实际生产效果）： 当你

深入理解base64、VLQ及base64-VLQ 三个编码方式的编码原理，并手动实现代码。深入理解source-map中mapping 属性生成的原理。

什么是静态提升 静态提升是Vue3编译优化中的其中一个优化点。所谓的静态提升，就是指在编译器编译的过程中，将一些静态的节点或属性提升到渲染函数之外。

做好事不留名的sourcemap 当我们在开发代码的时候，遇到错误的时候可以在控制台定位到具体的问题，就像这样： 问题在于，由于打包动作会将我们的原始代码进行编译、压缩，最后在产物中早已没有我们的原始

AST 初识 什么是 AST Abstract Syntax Tree，抽象语法树，是源代码结构的一种抽象表示，它以树状的形式表现编程语言的语法结构，树上的每个节点都表示源代码中的一种结构。 Babe

本文将对AST结构、Babel工作原理等方面作介绍，结合目前Babel & AST常见的应用场景做分析，帮助同学们了解Babel & AST在实际开发过程中的用途。

打开前端项目中的 package.json，会发现众多工具已经占据了我们开发日常的各个角落，它们的存在于我们的开发而言是不可或缺的。有没有想过这些工具的功能是如何实现的呢？没错，抽象语法树 (Abst

普遍的观点认为，前端就是打好 HTML、CSS、JS 三大基础，深刻理解语义化标签，了解 N 种不同的布局方式，掌握语言的语法、特性、内置 API。再学习一些主流的前端框架，使用社区成熟的脚手架，即可快速搭建一个前端项目。胜任前端工作非常容易。再往深处学习，你会发现前端这个领域…