Vanilla virtual dom in browser and on server side
It could come up as surprise for many but the concept of virtual dom has been available almost since the birth of web browsers. It still in many aspects way more power than any of current virtual dom implementations: streaming based parsing, multithreaded templating/data binding, complex query over virtual dom language, binary data storage and finally powerful AOP templating language.
The streaming data import and processing allows to save half of memory as there is no need to keep whole data as serialized string as in JSON case. The way around is to use web sockets for reading/writing to/from JS objects. It will benefit as the low-memory devices, and high-volume data.
While the simple template is natively supported by JS since ES6, it would be tough to use it for complex cases where one template could be used from another. In such complex cases the performance could become a bottleneck and multithreading could improve rendering performance in number of threads available on hardware. It is not impossible but would be quite challenge to utilize Service Workers for processing multiple templates based on JS virtual dom, mostly due to data sharing limitations.
The query language over virtual dom seems to be useless feature. But CSS selectors appeared to be quite popular for a reason. And CSS provides just a small subset in comparison with hierarchy-aware query language.
Any JS object is inherited from JS Object, a subject for garbage collection, accessed over series of hash references. Which is quite inefficient in comparison with binary data (static C-like structures). In my browser stress experiments the volume of JSON and binary data is about 100 times in favor of binary presentation before the browser crash.
AOP is special case as in JS world it is not much available and popular. But separating the aspects of functionality from core implementation has given ability to break a complexity limit of sophisticated JS modules( when the cost of each new feature increased dis-proportionally to added value ). IMO among programming concepts AOP is most powerful tool for managing complex projects. It fits perfectly into “evolutionary architecture” pattern.
And the winners are:
- XHR — native streaming parsing into XML binary dataset as virtual dom( yes, it is a DOM, but not HTML one, hence faster to operate ).
- XPath — powerful (quite above of CSS or JS capabilities) query language over XML .
- XSLT — templating language and multithreaded transformation engine. It is tunable to the level of binary compiled dll( yes, assembly-level performance on multithreading even utilizing CPU specifics).
It uses AOP as primary coding paradigm, has imports of other templates and module namespace insulation. Not easy to learn but does the magic once harnessed.
All those APIs are available in all modern browsers and in most back-end frameworks. And even if not, look the framework’s native dll support layer.
2018, Happy vanilla coding!
