Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Which is the best option for linting: Pre-commi...

Avatar for Yoshitaka Terazawa Yoshitaka Terazawa
August 22, 2025
210

Which is the best option for linting: Pre-commit or CI?

This is a deck comparing the pros and cons of running lint either with pre-commit or in CI.

Avatar for Yoshitaka Terazawa

Yoshitaka Terazawa

August 22, 2025
Tweet

Transcript

  1. About me - Yoshitaka Terazawa / locol - Software Engineer

    - @Money Forward, inc - A running member of React Japan User Group and React Tokyo X/Qiita/Zenn/GitHub: @locol23 Bluesky: locol23.bsky.social X:
  2. Agenda - The purpose of linting - How to do

    it - pre-commit vs CI - Conclusion
  3. The purpose of linting - Reduce the number of code

    reviews by following the team’s coding principles for pull requests. - Learn the latest syntax - ECMAScript is published every year - From ES2025 - Promise.try - import json from "./awesome.json" with { type: "json" } - new Set([1, 2]).union( new Set([1, 3])) // {1, 2, 3} - Learn JavaScript and React best practices. - ❌ Incorrect: const array = new Array(12) - ✅ Correct: const array = Array.from({ length: 12 })
  4. The purpose of linting - Reduce the number of code

    reviews by following the team’s coding principles for pull requests. - Learn the latest syntax - ECMAScript is published every year - From ES2025 - Promise.try - import json from "./awesome.json" with { type: "json" } - new Set([1, 2]).union( new Set([1, 3])) // {1, 2, 3} - Learn JavaScript and React best practices. - ❌ Incorrect: const array = new Array(12) - ✅ Correct: const array = Array.from({ length: 12 }) Reason: When using the Array constructor with one argument, it's not clear whether the argument is meant to be the length of the array or the only element.
  5. How to do it - We can use pre-commit or

    CI - pre-commit tools - husky + lint-staged - Lefthook - etc - CI tools - GitHub Actions - CircleCI - etc
  6. pre-commit vs CI - pre-commit - Pros - Rules are

    easy to update and modify - Because the rules only apply to the changed code. - Can get the fast feedback - Cons - Can sometimes be slow on the local machine - Sometimes new and old rule versions get mixed, causing inconsistencies - CI - Pros - Ensures all code follows the same rules - Linting can’t be skipped manually - Cons - Can sometimes be slow during CI runs - Rules are not as easy to update and modify - Because we need to apply rules to all code
  7. pre-commit vs CI - pre-commit - Pros - Rules are

    easy to update and modify - Because the rules only apply to the changed code. - Can get the fast feedback - Cons - Can sometimes be slow on the local machine - Sometimes new and old rule versions get mixed, causing inconsistencies - CI - Pros - Ensures all code follows the same rules - Linting can’t be skipped manually - Cons - Can sometimes be slow during CI runs - Rules are not as easy to update and modify - Because we need to apply rules to all code If you encounter this issue, please try Lefthook, Biome, Oxlint and so on. They’re fast because they’re written in Go or Rust.
  8. pre-commit vs CI - pre-commit - Pros - Rules are

    easy to update and modify - Because the rules only apply to the changed code. - Can get the fast feedback - Cons - Can sometimes be slow on the local machine - Sometimes new and old rule versions get mixed, causing inconsistencies - CI - Pros - Ensures all code follows the same rules - Linting can’t be skipped manually - Cons - Can sometimes be slow during CI runs - Rules are not as easy to update and modify - Because we need to apply rules to all code Please remember the purpose of linting. It might feel strange, but we can achieve our goal with it.
  9. pre-commit vs CI - pre-commit - Pros - Rules are

    easy to update and modify - Because the rules only apply to the changed code. - Can get the fast feedback - Cons - Can sometimes be slow on the local machine - Sometimes new and old rule versions get mixed, causing inconsistencies - CI - Pros - Ensures all code follows the same rules - Linting can’t be skipped manually - Cons - Can sometimes be slow during CI runs - Rules are not as easy to update and modify - Because we need to apply rules to all code If some libraries are updated or you decide to change the rules, you might see over 100 warnings or errors. That means you’ll need to update all the code, which can take a long time.
  10. pre-commit vs CI - pre-commit - Pros - Rules are

    easy to update and modify - Because the rules only apply to the changed code. - Can get the fast feedback - Cons - Can sometimes be slow on the local machine - Sometimes new and old rule versions get mixed, causing inconsistencies - CI - Pros - Ensures all code follows the same rules - Linting can’t be skipped manually - Cons - Can sometimes be slow during CI runs - Rules are not as easy to update and modify - Because we need to apply rules to all code Skipping linting means missing the opportunity to learn new syntax and best practices, so there’s no reason to do it. Also, if team members have agreed to the team’s rules, they generally don’t skip it, although the situation might be different in open source projects.
  11. Conclusion - Both pre-commit and CI have their pros and

    cons - I think it would be nice to chose the pre-commit - But it depends on the situation. So please discuss in the team