DEV Community

Cover image for Deno: Ogone's JSX output
Rudy Alula
Rudy Alula

Posted on

Deno: Ogone's JSX output

Intro

Hey! I'm Rudy Alula, and I work as Front-end Developer for Stanley Robotics, which is solding the first outdoor robot parking vallet in automobile industry.

with this article, you're about to understand how <div><img src="..."/></div> is rendered by Ogone on your browser.

Actually Deno don't have a native DOMParser or std one, so Ogone implements a custom DOMParser, this allows some custom stuffs and let Ogone out of React's JSX supremacy.

this <div><img src="..."/></div> will simply output like this:

(function(ctx, pos = [], i = 0, l = 0, ap = (p,n) => {p.append(n);}, h = (...a) => document.createElement(...a), at = (n,a,b) => n.setAttribute(a,b)){
  let p = pos; 
  const nt = h('template'), n1 = h('div'), n2 = h('img');
  at(n2, 'src', '...');
  ap(nt,n1); ap(n1, n2);
  return nt;
});

Top comments (0)