Type systems give us guiderails to protect ourselves from the trees along the road. Types can help make refactoring painless. Types are a good thing, we have learned. “Alas, give us types in the browser!” we say.
However, despite the relative ease of adoption, I have a few tips that should help you capitalize on your investment.
1. Have a Plan
It’s easy to get excited about a new tech stack and just dive in head-first. While this works well for experimenting and learning, it is not sustainable. Without careful planning, it’s easy to spend a lot of time refactoring code that doesn’t actually need to be refactored.
Ultimately, the goal of migrating to TypeScript should be to add types to the places that you use the most, to make sure that you don’t mess up. For example, start by finding core modules that are used throughout the code (especially new code) and focus on them.
2. API First
Once you’ve figured out where to begin your refactor, start refactoring at the highest possible level. Find the highest level APIs for that module and simply add their types. Using interfaces, classes, types, etc., define the intended behavior of these functions along the boundary. By simply adding these top-level type signatures, any new code that is written to use these APIs can benefit from the types.
3. Start Small
Start by changing the file to a
tsx) extension and fixing the compiler errors in the simplest way possible–often, that’s just defining
any types for everything. Getting the compiler happy and committing to VCS as quickly as possible will help with merge conflicts, especially on a larger team.
Once the file is happily converted, you now have the flexibility to migrate the rest of the file as needed. The process of migrating a single file might take days or even weeks, so the ability to incrementally migrate a file is extremely advantageous.
Overall, the past few months of working with TypeScript have been a blast. Its ability to incrementally integrate into exiting codebases has proven to be a huge benefit for my project. I hope these guidelines will help you with your next project, as well!