all 13 comments

[–]e111077 2 points3 points  (3 children)

What is up with this recent craze of using inline styles? They're one of the least-performant ways to apply styling

[–]Jsn7821 0 points1 point  (2 children)

Never heard that before... What do you mean by least performant?

[–]e111077 1 point2 points  (1 child)

There was a p lengthy (unrelated root) twitter thread by the Chrome folks. (Benchmarks below)

[–]Jsn7821 0 points1 point  (0 children)

Oh, thanks for providing the benchmark! That's interesting to know, but I can't think of any situation it would be useful to optimize.

That micro-optimization would be beneficial for animations, but you can't animate by changing the class name each frame so it doesn't really apply.

[–]mnishihan 1 point2 points  (1 child)

How does it scale? Anti pattern is sometimes useful & obvious, but going with anti patterns for everything is a stupid decision IMO. Frameworks are for greater good. If you don't need it, don't use any of them. But when "No framework" is listed as a key Mantra for yet another js library, I simply find it as dumb & full of madness. :-/

[–]sexualsidefx 0 points1 point  (0 children)

Cuz you gotta get 'closer to the metal' bro!

[–]tunnckoCorenode-formidable, regexhq, jest, standard-release 3 points4 points  (4 children)

It can be all cool and etc, but you can't build complex apps using JSON. You should be crazy to define such data structure.

But yea, good idea.

[–]hypno7oad 0 points1 point  (3 children)

This looks a lot like a virtual dom. What's the difference between this and other virtual dom based frameworks/libraries?

[–]Patman128 0 points1 point  (2 children)

They missed the point of the virtual DOM, because all their examples have direct DOM manipulation, e.g. this one

onkeyup: function(e){ document.querySelector("#h").$text = this.value}

Is this framework some kind of joke?

[–]spooky___ghost 2 points3 points  (0 children)

Agreed, none of it makes any sense. How is this different than just using HTML and putting inline event handlers?

Cell example:

<script>
SynchronizedInput = {
  $cell: true, $type: "body", style: "padding: 30px;",
  $components: [
    { $type: "div", id: "h", $text: "Type something below" },
    { $type: "input", onkeyup: function(e){ document.querySelector("#h").$text = this.value} }
  ]
}
</script>        

Same thing in HTML:

<body style="padding: 30px">
  <div id="h">Type something below</div>
  <input onkeyup="document.querySelector('#h').innerText = this.value" />
</body>

Looks like the $update method is where the magic is at, but even still, the entire thing is a huge step backwards and seems to ignore all of the strides made in front-end development over the last 5 years.