You can call React hooks inside conditionals now. TSRX, a TypeScript language extension from Dominic Gannaway, lifts those branches into separate components at compile time, satisfying the rules of hooks without manual refactoring. It's one of several framework-specific problems the compiler solves automatically.
The tool co-locates markup, styles, and logic in single files. It compiles to React, Solid, or Ripple while staying fully backward compatible with TypeScript. Released under MIT and currently in alpha, it ships with a language server plus Prettier and ESLint plugins so teams can adopt it without abandoning existing workflows.
The design is deliberate about AI agents. Research from Liu et al. (TACL 2024) shows that language models attend unevenly to long contexts, performing best when relevant information sits close together. By keeping derived values next to the markup they feed, and collapsing the ternaries and map chains that normally clutter components into readable blocks, TSRX gives code generation tools a cleaner surface to work with, much like how AI agents helped **unblock the Syntaqlite project.
Solid developers get eager props destructuring that compiles to lazy getters, preserving reactivity. These compile-time fixes address real pain points that slow down both human developers and AI agents trying to generate correct framework code.
Whether TSRX gains traction depends on whether teams want another abstraction layer on top of TypeScript. But the reasoning is sound. UI code is increasingly written and transformed by machines. Making that code more explicit and predictable helps anyone working in the loop, whether they run on coffee or compute. However, the article **AI Writes the Code. Humans Can't Review It Fast Enough** highlights why this process creates a significant bottleneck.