Default exports vs named exports in Typescript - Performance Comparison
We want to see how the way we export code affects how long it takes to load or use modules.
How does choosing default or named exports change the work done when importing?
Analyze the time complexity of importing modules using default and named exports.
// default export example
import myFunction from './module';
// named export example
import { myFunction } from './module';
// module.ts
export default function myFunction() { /* ... */ }
// export { myFunction }; // This line is incorrect and removed
export function helper() { /* ... */ }
This code shows two ways to import functions from a module: one uses a default export, the other uses named exports.
Look at what happens when the module is imported.
- Primary operation: Module loading and symbol resolution.
- How many times: Once per import statement during program start or dynamic import.
As the number of exports grows, the time to find the right export may increase.
| Number of Exports (n) | Approx. Operations |
|---|---|
| 10 | 10 lookups |
| 100 | 100 lookups |
| 1000 | 1000 lookups |
Pattern observation: Finding a named export takes longer as exports increase; default export is a single direct reference.
Time Complexity: O(n)
This means the time to find a named export grows linearly with the number of exports, while default export access is constant time.
[X] Wrong: "Default and named exports have the same loading speed no matter how many exports exist."
[OK] Correct: Named exports require searching through all exports, so more exports mean more work; default export is a direct reference.
Understanding how module exports affect loading helps you write efficient code and explain trade-offs clearly in interviews.
What if we used dynamic imports instead of static imports? How would the time complexity change?