7 comments

[ 3.5 ms ] story [ 25.3 ms ] thread
I made something almost exactly like this: https://simulacra.js.org/

This actually uses object getters/setters, has full support for arrays, and nested arrays of objects. There is no API beyond the initial binding, everything beyond that is just mutations on an object.

Nice! I will definitely consider this option for my next projects! Also, I am starting to think that this sort of binding could be implemented natively by browsers, which could make many applications faster.
So what happens in Simulacra if I start moving DOM nodes around?

Does the binding break?

Interesting idea! Just wondering if there are any benefits to going down this road other than saving the 21K of bandwidth necessary for Gzipped/minified Vue.js?
I hope to save on performance & memory by cutting the render step and binding immediately to dom elements (But I could be wrong, I will need benchmarks before the switch).
This is great as learning material.

Have you benchmarked your approach?

Consecutive clicks on the number increment/decrement buttons don't work.

Google Chrome Version 62.0.3202.75 (Official Build) (64-bit)