code-red

Experimental toolkit for writing x-to-JavaScript compilers. It is used in Svelte.

API

The code-red package exposes three core functions — b, x and print.

b and x take a template literal and return an ESTree program body, or a single node:

1import { b, x } from 'code-red';
2
3const expression = x`i + j`;
4
5assert.equal(expression.type, 'AssignmentExpression');
6assert.equal(expression.operator, '+');
7assert.equal(expression.left.name, 'i');
8assert.equal(expression.right.name, 'j');
9
10const body = b`
11	const i = 1;
12	const j = 2;
13	const k = i + j;
14`;
15
16assert.equal(body.length, 3);
17assert.equal(body[0].type, 'VariableDeclaration');

Expressions in template literals correspond to replacement nodes — so you could express the above like so:

1const i = x`i`;
2const j = x`j`;
3const expression = x`${i} + ${j}`;
4
5const body = b`
6	const ${i} = 1;
7	const ${j} = 2;
8	const k = ${expression};
9`;

The print function takes a node and turns it into a {code, map} object:

1const add = x`
2	function add(${i}, ${j}) {
3		return ${expression};
4	}
5`;
6
7print(add).code;
8/*
9function add(i, j) {
10	return i + j;
11}
12*/
13
14i.name = 'foo';
15j.name = 'bar';
16
17print(add).code;
18/*
19function add(foo, bar) {
20	return foo + bar;
21}
22*/

Prefixes

@-prefixed names (replaceable globals)

So that you can use globals in your code. In Svelte, we use this to insert utility functions.

1// input
2import { x } from 'code-red';
3x`@foo(bar)`
4
5// output
6FOO(bar)

#-prefixed names (automatically deconflicted names)

So that you can insert variables in your code without worrying if they clash with existing variable names.

bar used in user code and in inserted code gets a $1 suffix:

1// input
2import { x } from 'code-red';
3x`
4function foo(#bar) {
5	return #bar * bar;
6}`;
7
8// output
9function foo(bar$1) {
10	return bar$1 * bar;
11}

Without conflicts, no $1 suffix:

1// input
2import { b } from 'code-red';
3b`const foo = #bar => #bar * 2`;
4
5// output
6const foo = bar => bar * 2;

Optimiser

TODO add an optimiser that e.g. collapses consecutive identical if blocks

Compiler

TODO add a code-red/compiler module that replaces template literals with the nodes they evaluate to, so that there's nothing to parse at runtime.

Sourcemaps

TODO support source mappings for inserted nodes with location information.

License

MIT