JSX to string could be acheived as a transpiler plugin

[odinhb]

In these modern times when we commonly transpile our frontend javascript (which we have to do anyway to go from jsx -> h()) we might as well produce template strings or string concatenation code from the JSX/TSX source code instead of calling into a "JSX reviver" like stringjsx at runtime.

The only thing that needs to be shipped at runtime from the stringjsx package would be the sanitization logic.

To illustrate, the transpiler would (in the most basic case) take this:

const userProvidedText = 'i am very smart';
const myHtml = <div>
  <span class="comment-header">Comment</span>
  <p>{userProvidedText}</p>
</div>

and turn it into this:

import { sanitize } from 'stringjsx';

const userProvidedText = 'i am very smart';
let myHtml = '';
myHtml += '<div>';
myHtml += '<span';
myHtml += ' class="comment-header">';
// ... etc snip
myHtml += '<p>' + sanitize(userProvidedText) + '</p>';
myHtml += '</div>';