using `ast-grep` for codemod

[hyesungoh]

• related @es-toolkit/codemod(using ast grep version) #2

after merged #9 (because reliable test case are there)

We can consider using ast-grep for better performance and readable code (I think 🤔

• https://ast-grep.github.io/

benchmarks

I deployed poc packages

ast-grep based is hyesungoh-poc-ast-grep
jscodeshift based is hyesungoh-test-codemod

ast-grep based at jest-dom

jscodeshift based at jest-dom

ast-grep based at react/fixtures

jscodeshift based at react/fixtures

conclusion

I believe that in most cases, the ast-grep-based system performs better.

coinclusion with downloads time

The difference in unpacked size between the two packages is only 3.42KB,

so I don’t think the result would change even when considering download time. 🤔

difference of code

// jscodeshift
function transformLodashFunctionImports(root: Collection, j: JSCodeshift): boolean {
  const lodashFunctionImports = root.find(j.ImportDeclaration).filter(path => {
    const source = path.node.source.value;
    return typeof source === 'string' && source.startsWith('lodash/');
  });

  if (lodashFunctionImports.length === 0) {
    return false;
  }

  lodashFunctionImports.replaceWith(path => {
    const { node } = path;
    const modulePath = node.source.value as string;
    const functionName = modulePath.replace('lodash/', '');

    if (node.specifiers && node.specifiers[0] && node.specifiers[0].local) {
      const localIdentifier = node.specifiers[0].local;

      return j.importDeclaration(
        [j.importDefaultSpecifier(localIdentifier)],
        j.literal(`es-toolkit/compat/${functionName}`)
      );
    }
    return node;
  });

  return true;
}

// ast-grep
function transformLodashFunctionImports(code: string): string {
  const sg = require("@ast-grep/napi");
  const ast = sg.parse(code, "typescript");

  // 패턴 매칭: import $NAME from 'lodash/$FUNC'
  const rule = {
    pattern: "import $NAME from 'lodash/$FUNC'",
  };

  return ast.replace(rule, "import $NAME from 'es-toolkit/compat/$FUNC'");
}

Since our project only requires simple codemods,
I prefer ast-grep for its readability and lower learning curve.

What are your thoughts? 🙏 🙏 🙏

[jiji-hoon96]

Hi! I was exploring es-toolkit and came across this issue, so I’d like to share some thoughts.

It seems that jscodeshift has strong advantages when it comes to handling complex logic. It allows for various types of analysissuch as conditional logic, scope analysis, and type inference which can be flexibly managed using APIs like find and filter on the AST root.

On the other hand, ast-grep appears to focus more on relatively simple pattern matching. Because of this, I’m curious how it would handle more complex transformations during migration such as function signature changes, nested transformations, or conditional import additions.

Also, the use of YAML files for test configuration is interesting, but I do wonder whether it can be flexibly integrated with testing frameworks. In contrast, jscodeshift seems to manage this part more straightforwardly.

That said, the performance difference is remarkable. With that level of performance improvement, it’s hard to argue against adopting ast-grep. If the considerations mentioned above can be addressed, I think ast-grep could be an excellent choice overall.

[hyesungoh]

Hi there! @jiji-hoon96

I think ast-grep(actually @ast-grep/napi) can handle what you said 🤔

because it provide javascript api by using napi-rs

https://ast-grep.github.io/guide/api-usage/js-api.html#javascript-api

---

You can check actual approach at below links

• https://github.com/toss/es-toolkit-codemod/pull/2/files#diff-a2a171449d862fe29692ce031981047d7ab755ae7f84c707aef80701b3ea0c80
• @es-toolkit/codemod(using ast grep version) #2

however, It it just my thought 🤔 Thanks for you opinion!

[jiji-hoon96]

Thank you for the information! I wasn't aware of this part.
I thought it only supported simple pattern matching, but it turns out that complex logic can also be handled through the JavaScript API.
I'll need to take a deeper look at the PR and issues