gpt4 book ai didi

TS原理详细解读(6)--语法增量解析

转载 作者:撒哈拉 更新时间:2024-12-20 20:47:42 58 4
gpt4 key购买 nike

呃....4年前开了一个坑,准备写一套完整介绍TS 原理的文章。坑很大,要慢慢填,今天就来填一个把.

本节主要介绍语法增量解析.

什么是增量解析

增量解析的意思是,如果我们直接从源码解析成语法树,叫做全量解析.

语法树是由很多个节点对象组成的,比较吃内存.

当用户修改源码后(无论修改哪里,包括插入一个空格),我们都需要重新解析文件,生成新的语法树.

如果每次都全量解析,那意味着释放之前的所有节点,然后重新创建所有节点.

但实际上,用户每次只会修改一部分内容,而整个语法树的大部分节点都不会发生变化.

如果解析时,发现节点没有变化,就可以复用之前的节点对象,只重新创建变化的节点,这个过程叫增量解析.

增量解析是一种性能优化,它不是必须的.

实现增量解析的基本原理

假如我们修改了函数中某行代码的内容,从原则上说,这个函数之前的节点都是不变的.

函数之后的节点大概率不变,但也有小概率会变,比如我们插入了“}”,导致函数的范围发生变化,或者插入“`”,导致后面的内容都变成字符串的一部分了.

看上去好像很复杂,但 TS 采用了一个折中的做法,大幅降低了复杂度.

TS 是以语句为单位进行复用的,即每条语句或者完全复用,或者完全不复用,即使单条语句里面存在可复用的部分子节点。(这种说法其实并不准确,但为了方便理解,可以先这么认为) 。

核心逻辑为:

1. 当在 pos 位置解析一条语句前,TS 先检测该位置是否存在可复用的旧节点,如果不存在当然就无法增量解析,就转成常规解析.

2. 如果存在旧节点,则检查该旧节点所在区域是否发生变化,如果发生变化,则放弃复用,转为常规解析.

3. 如果没有发生变化,那这条语句就直接解析完毕,然后从这行语句的 end 位置继续解析下一条语句,重复前面的步骤.

  。

SyntaxCursor

代码位于 parser.ts 。

export interface SyntaxCursor {
     currentNode(position: number): Node;
}
SyntaxCursor 用于从原始的语法树中查找指定位置对应的可复用的旧节点。
    export function createSyntaxCursor(sourceFile: SourceFile): SyntaxCursor {
        let currentArray: NodeArray<Node> = sourceFile.statements;
        let currentArrayIndex = 0;

        Debug.assert(currentArrayIndex < currentArray.length);
        let current = currentArray[currentArrayIndex];
        let lastQueriedPosition = InvalidPosition.Value;

        return {
            currentNode(position: number) {
                // 函数内基于一个事实做了一个性能优化
          // 就是解析时,position 会逐步变大,因此查找的时候,不需要每次都重头查找,而是记住上一次查找的位置
          // 下次查找就从上次的位置继续查找,这样找起来更快
if (position !== lastQueriedPosition) { if (current && current.end === position && currentArrayIndex < (currentArray.length - 1)) { currentArrayIndex++; current = currentArray[currentArrayIndex]; } // 如果上次的位置和要查找的位置不匹配,就重头查找。 if (!current || current.pos !== position) { findHighestListElementThatStartsAtPosition(position); } } // 记住本次查找的位置,加速下次查找 lastQueriedPosition = position; Debug.assert(!current || current.pos === position); return current; }, }; // 标准的深度优先搜索算法,找到就近的节点 function findHighestListElementThatStartsAtPosition(position: number) { currentArray = undefined!; currentArrayIndex = InvalidPosition.Value; current = undefined!; forEachChild(sourceFile, visitNode, visitArray); return; function visitNode(node: Node) { if (position >= node.pos && position < node.end) { forEachChild(node, visitNode, visitArray); return true; } // position wasn't in this node, have to keep searching. return false; } function visitArray(array: NodeArray<Node>) { if (position >= array.pos && position < array.end) { for (let i = 0; i < array.length; i++) { const child = array[i]; if (child) { if (child.pos === position) { currentArray = array; currentArrayIndex = i; current = child; return true; } else { if (child.pos < position && position < child.end) { forEachChild(child, visitNode, visitArray); return true; } } } } } return false; } } }

解析列表

每个列表(包括语句块的语句列表)都是使用 parseList 解析的。每个元素都是通过 parseListElement 解析.

function parseList<T extends Node>(kind: ParsingContext, parseElement: () => T): NodeArray<T> {
        const saveParsingContext = parsingContext;
        parsingContext |= 1 << kind;
        const list = [];
        const listPos = getNodePos();

        while (!isListTerminator(kind)) {
            if (isListElement(kind, /*inErrorRecovery*/ false)) {
                list.push(parseListElement(kind, parseElement));

                continue;
            }

            if (abortParsingListOrMoveToNextToken(kind)) {
                break;
            }
        }

        parsingContext = saveParsingContext;
        return createNodeArray(list, listPos);
    }

parseListElement 中会先检测可复用的节点,如果存在,就复用并解析下一个元素,否则正常解析当前元素.

    function parseListElement<T extends Node | undefined>(parsingContext: ParsingContext, parseElement: () => T): T {
        const node = currentNode(parsingContext);
        if (node) {
            return consumeNode(node) as T;
        }

        return parseElement();
    }
currentNode 负责返回可复用的节点,除了基于 syntaxCursor 查找,还加了一些额外的限制,防止某些特殊情况会复用。
function currentNode(parsingContext: ParsingContext, pos?: number): Node | undefined {
       
        if (!syntaxCursor || !isReusableParsingContext(parsingContext) || parseErrorBeforeNextFinishedNode) {
            return undefined;
        }

        const node = syntaxCursor.currentNode(pos ?? scanner.getTokenFullStart());

        // 存在语法错误的节点不能复用,因为我们需要重新解析,重新报错。
        if (nodeIsMissing(node) || intersectsIncrementalChange(node) || containsParseError(node)) {
            return undefined;
        }

        const nodeContextFlags = node.flags & NodeFlags.ContextFlags;
        if (nodeContextFlags !== contextFlags) {
            return undefined;
        }

        // 有些节点不能复用,因为存在一定场景导致复用出错
        if (!canReuseNode(node, parsingContext)) {
            return undefined;
        }

        if (canHaveJSDoc(node) && node.jsDoc?.jsDocCache) {
         
            node.jsDoc.jsDocCache = undefined;
        }

        return node;
    }

当节点被复用后,使用 consumeNode 设置下次扫描的位置.

function consumeNode(node: Node) {
        scanner.resetTokenState(node.end);
        nextToken();
        return node;
    }

不能复用的场景

有些场景复用是有问题的,(很多场景都是社区通过 Issue 给 TS 报的 BUG,然后修复的).

比如泛型:

var a = b < c, d, e

从复用角度,这是一个列表,列表项分别为

  • a = b < c
  • d
  • e

理论在 e 后面插入任何字符,都不影响前面的节点,但存在一个特例,就是">" 。

var a = b<c,d,e>

当 <> 成对,它变成了泛型。这会导致需要重新解析整个语句.

TS 的做法并不是检测是否插入了“>”,而是因为存在整个特例,就完全不复用变量列表的任何节点,即使多数情况复用的安全的.

毕竟增量解析只是一种性能优化,没有也不是不能用.

完整的检测特殊情况的逻辑在 canReuseNode,因为比较琐碎,且逻辑都比较简单,这里就不贴了.

结论

经过增量解析后,部分节点会被重新使用.

从算法中可以得出,如果子节点被修改了,那父节点一定也会被修改。而源文件本身在每次增量解析时,都会被重新创建.

 

  。

最后此篇关于TS原理详细解读(6)--语法增量解析的文章就讲到这里了,如果你想了解更多关于TS原理详细解读(6)--语法增量解析的内容请搜索CFSDN的文章或继续浏览相关文章,希望大家以后支持我的博客! 。

58 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com