I've been tinkering with a TypeScript/JSX library that might interest some of you: jsx-htmx.
HTMX has been gaining traction lately for its simplicity and performance benefits in handling dynamic HTML content. However, as someone who values type safety and enjoys working with TypeScript, I found the existing options for integrating HTMX with TSX files to conflict with what I wanted to achieve.
So, I decided to roll up my sleeves and create jsx-htmx. With just a single line (`/* @jsxImportSource jsx-htmx */`) added to your TSX file, you can seamlessly blend HTMX into your TypeScript projects while maintaining type safety. I've also included types to ensure your components align with the HTMX API, providing an extra layer of confidence in your codebase. ```tsx const Badge: SimpleCustomComponent = (props) => { return <div class="component">{props.children}</div>; }; ```
I've been using jsx-htmx in a couple of production sites, and so far, the performance has been solid, with render times consistently in the low milliseconds range.
I'm eager to hear your thoughts and suggestions on how to improve jsx-htmx. Are there any specific features you'd like to see added? Any ideas for enhancing type safety or optimizing performance?
Looking forward to your feedback!
Cheers, M