Build Step: Transform Tagged Template Literals into Simple Code #14658
Description
Post #14623, we'll have a lot of code using the html`<div />` Tagged Template Literal.
But, the output of TTLs is very large:
// input
function test() {
const div = html`
<div>
<p>Some text</p>
</div>`;
}
// output
var $0=["\n <div>\n <p>Some text</p>\n </div>"];
$0.raw=["\n <div>\n <p>Some text</p>\n </div>"];
function test(){
const div = html($0)
}Notice the duplication between the var $0 and $0.raw. For the html static template helper, we never use raw (it's actually forbidden in the linter), we only use the cooked value (the first array).
So, we can do a simple build transform (for the html helper only):
// input
function test() {
const div = html`
<div>
<p>Some text</p>
</div>`;
}
// output
function test() {
const div = html(['\n <div>\n <p>Some text</p>\n </div>']);
}