https://github.com/nicolaeiotu/dbindjs
Data Binding for Javascript
https://github.com/nicolaeiotu/dbindjs
bind binding data data-binding databind dbind dbindjs javascript
Last synced: 5 months ago
JSON representation
Data Binding for Javascript
- Host: GitHub
- URL: https://github.com/nicolaeiotu/dbindjs
- Owner: NicolaeIotu
- License: agpl-3.0
- Created: 2017-10-25T01:54:34.000Z (over 8 years ago)
- Default Branch: main
- Last Pushed: 2024-12-06T10:58:39.000Z (over 1 year ago)
- Last Synced: 2025-03-20T18:05:29.378Z (over 1 year ago)
- Topics: bind, binding, data, data-binding, databind, dbind, dbindjs, javascript
- Language: JavaScript
- Homepage:
- Size: 696 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# dbindjs
**dbindjs** is data binding for Javascript.
`import { dbind } from 'dbindjs'`
* [Run in Browser](#run-in-browser)
* [Examples](#examples)
* [Basic dbindjs](#basic-dbindjs)
* [Neural networks with dbindjs](#neural-networks-with-dbindjs)
* [Others](#others)
## Run in Browser
Probably the easiest way to make **dbindjs** run in browser is to upload the file *dist/dbindjs.js* to the scripts' location of your webserver and use a standard import as follows:
```html
...
import { dbind } from './scripts/dbindjs.js'
// ...
```
## Examples
A couple of examples are provided here below. For more see
examples folder on GitHub and
docs folder on GitHub.
### Basic dbindjs
```
import { dbind } from 'dbindjs'
dbind({
// Property, Basic
// when the value of this property changes, the bindings depending on it automatically update
a: 1,
// Property, Basic
b: 1,
// Binding, Basic
// defines a binding relation (which may include internal bindings) within the pool,
// and uses results outside of the pool
c: function () {
// use references to basic properties of the binding pool
const dep = this.d()
const inrc = this.a / this.b / dep
console.log(inrc)
// use result somewhere else outside of the binding pool
// ...
},
// Binding, Internal
// defines a binding relation which is used by other bindings in the binding pool
d: function () {
const inrd = this.a + this.b + this.f
console.log(inrd)
// output for other bindings
return inrd
},
// Binding, Complex
// defines a binding relation (which may include internal bindings) within the pool,
// uses results outside of the pool
// and can be used by other bindings in the binding pool
e: function () {
// use references to basic properties of the binding pool
const dep = this.d()
const inre = this.a + this.b + this.f + dep
console.log(inre)
// use result somewhere else outside of the binding pool
// ...
// output for other bindings
return inre
},
// Binding, Basic
f: 2
// ...
// ...
})
// trigger the bindings by changing the values of some dependencies
dbind({ a: 23, f: 45 })
```
### Neural networks with dbindjs
This example simulates a **fully** connected neural network of `maxNeurons` 'neurons'
(100000). The number of 'neurons' can be increased or decreased to match testing
machine capabilities. When using the default value (100000 'neurons'), the example
should run pretty fast on a standard personal computer.
Changes to any components of this network trigger propagation to all 'neurons'.
All sorts of actions can be triggered. This example prints a result if 'neuron'
data meets a certain condition.
```
import { dbind } from 'dbindjs'
const maxNeurons = 100000
const miniBrain = {}
for (let i = 0; i < maxNeurons; i++) {
miniBrain['n' + i] = {
synapseFiringTrigger: 0,
neuronData: {
a: Math.random() * 100,
b: Math.random() * 100000
},
// important! remember fat arrow functions loose 'this',
// so don't use them with dbindjs binding functions
act: function () {
if (this.neuronData.a > this.neuronData.b) {
console.log('n' + i + ': ', this.neuronData)
}
// alter data in order to create randomness for the next calls
// this.neuronData.a = Math.random() * 100
// this.neuronData.b = Math.random() * 100000
}
}
}
const desc = {
action1: function () {
for (const prop in this) {
if (miniBrain.hasOwnProperty(prop) && miniBrain[prop].hasOwnProperty('act')) {
miniBrain[prop].act()
}
}
}
}
for (var prop in miniBrain) {
desc[prop] = miniBrain[prop].synapseFiringTrigger
}
dbind(desc)
// pick a random neuron
const neuronId = 'n' + Math.round(Math.random() * maxNeurons)
const probe = {}
probe[neuronId] = dbind.propstore[neuronId].value++
dbind(probe)
```
## Others
**dbindjs** incorporates a couple of advantages over existing Javascript data binding libraries:
* data binding only
* merged updates
* separation through namespaces
* advanced fine-tuning
* consistent protection
* pause/resume features
* introduces the concept of 'binding pool'
Further developments arriving soon.
**dbindjs** is © Copyright 2017-2024 Nicolae Iotu, nicolae.g.iotu@gmail.com