随笔分类 - 架构细节
摘要：How vue-router solve the problem: function changeLocation( to: HistoryLocation, state: StateEntry, replace: boolean ): void { /** * if a base tag is p
阅读全文
摘要：Overriding a function lets you wrap a third-party method with your own logic while still invoking its original behavior. Example code: const unmountAp
阅读全文
摘要：通过前面的代码，其实我们已经完成了从模板AST到Javascript AST的转换 const ast = parse(template); transform(ast); 那接下来，我们只需要再根据Javascript AST生成具体的js代码就行了，比如再执行下面的函数： generate(as
阅读全文
摘要：我们现在已经有了模板AST，那么根据之前的顺序，我们现在需要把模板AST转化为JSAST。 要知道，模板AST是对模板的描述，那么JSAST就是对JS代码的描述。 也就是说，我们最终希望得到的代码是下面这样的： function render(){ return h('div',[ h('p','V
阅读全文
摘要：在转换AST节点的过程中，往往需要根据其子节点的情况来决定如何对当前节点进行转换，这就要求父节点的转换操作必须等待其所有子节点全部转换完毕之后再执行。 但是我们现在设计的转换流程并不支持这个能力，我们是从根节点开始，顺序往下执行的流程，如下图： 当一个节点被处理时，意味着它的子节点已经被处理完毕了，
阅读全文
摘要：For example, we have following code doing AST transform from templateAST to Javascript AST function traverseNode(ast) { const currentNode = ast; // If
阅读全文
摘要：monorepo工程基本格式 pnpm-workspace.yaml 指定工程管理目录 packages: - "packages/**" 这里配置之后，我们在安装第三方包的时候，就需要指定安装参数，如果是全局安装，就需要指定-w或者--workspace-root 安装全局第三方包 注意：为了ts
阅读全文
摘要：It can be a performance bottleneck if you frequently add/remove event listener bind to a DOM element. patchProps(el, key, prevValue, nextValue) { if (
阅读全文
摘要：可扩展性是指系统、程序或技术架构在功能、规模及性能需求增加时，能够容易地增加其性能、容量和功能的能力。 示例 假设我们有一个国际化网站，我们希望根据用户选择的语言动态显示不同的内容，比如在网站首页展示一个欢迎语，不考虑扩展性，可能的实现方式如下： <!--Vue实现示例--> <template>
阅读全文
摘要：因为有一些属性，在HTML标签上的名字和DOM Properties API中的名字是不一致的，比如最常用的，标签上的class属性，DOM Properties中是className 另外，并不是所有 HTML Attributes 都有与之对应的 DOM Properties，例如： <div
阅读全文
浙公网安备 33010602011771号