I'm not sure what you mean. Surplus is built on S.js, in which all data is lifted into reactive expressions. S.js already handles that for you but at the data model level, where it arguably should be, not at the UI model level.
I'm not sure what you mean. Surplus is built on S.js, in which all data is lifted into reactive expressions. S.js already handles that for you but at the data model level, where it arguably should be, not at the UI model level.
It only works as long as it is able to track changes, many client-server applications doesn't send you list of changes that you should apply to your data, they just send you data snapshots. With virtual dom library I'll just update my data and rerender everything that depends on this data, with direct data bindings good luck figuring out solution to such simple problem.
So you have to visit every data node, and then also visit every changed UI node. Where if you have deltas, you only visit changed data nodes and then changed UI nodes.
Re: data snapshots, it's easy to design your own service to use a delta protocol. But even when you can't, you can separate the code used to construct your reactive objects from the code that initializes them. This is just basic function abstraction, and it doesn't really add any work. From the example on S.js site:
const //
a = S.data(1), // a() | 1 3 3 5
b = S.data(2), // b() | 2 2 4 6
c = S(() => a() + b()), // c() | 3 5 7 11
d = S(() => c() * a()); // t0 // d() | 3 15 21 55
a(3); // t1 // +------------------------>
b(4); // t2 // t0 t1 t2 t3
S.freeze(() => { //
a(5); //
b(6); //
}); // t3 //
Now becomes (quick and dirty to convey the idea): const
a = S.data(1),
b = S.data(2),
c = S(() => a() + b()),
d = S(() => c() * a());
update(3, 4);
S.freeze(() => update(5,6));
function update(aval, bval) {
a(aval);
b(bval);
}
S.js will detect whether the value you're providing is actually different, and will only propagate what has changed. Roughly the same number of lines of code, just more reusable.Or maybe I can just ask you one more time to reimplement this[1] 70 lines of React code with Surplus, but you are probably will just ignore it :)
1. https://github.com/localvoid/uibench-react/blob/master/js/fc...
In any case, there's no inherent difference between basic values and ordered lists and data transforms. The latter two are just recursive application of operations on basic values.
It won't be so hard to solve use cases that I am talking about. Just create an index(HashMap), implement simple diffing algo that updates hashmap index and doesn't care about item positions, then from the ordered list generate a new list with values from the hashmap index, and then apply this inefficient diff algo that uses object identity to track objects[2].
1. https://github.com/ismail-codar/surplus-material/blob/3dce38...
2. https://github.com/adamhaile/S-array/blob/1046fca3032691d4ef...