CODEWITHSUNDEEP
javascriptxmlfacebookreactjs
SMLMRKHLMS
SMLMRKHLMS

Reputation: 283

How does Facebook's React JSX transformer work?

How is it even possible that React allows you to write JSX (XML) within javascript without it throwing any errors? I have been trying to wrap my head around it, and I am not quite sure how the underlying code accomplishes this.

Upvotes: 12

Views: 1005

Answers (1)

Cristik
Cristik

Reputation: 32786

Simple, it looks for <script type="text/jsx"> tags, parses them, generates the corresponding javascript code, and eval's it.

This is why the jsx inline transformer should be used only when developing, as having to parse the jsx code decreases the performance of your web page. When deploying, you should convert all jsx code into js one before deploy.

Upvotes: 10

Related Questions