realar - npm Package Compare versions

Comparing version 0.4.20 to 0.4.21

package.json

		{
		"name": "realar",
		"version": "0.4.20",
		"version": "0.4.21",
		"description": "React state manager",
		@@ -88,3 +88,3 @@ "repository": {
		},
		"gitHead": "958eb52b7f338aa7a0ce79b7e8bbabd498e5dd0d"
		"gitHead": "d4be49dc08dc7d5d0abe1f0d080c7086a86f4a0a"
		}

README.md

		@@ -5,3 +5,3 @@ # Realar

		Multiparadigmal state manager for React based on [reactive mathematic](https://github.com/betula/reactive-box).
		Multiparadigm state manager for React based on [reactive mathematic](https://github.com/betula/reactive-box).

		@@ -50,4 +50,55 @@ [Light](https://bundlephobia.com/result?p=realar), [Fast](https://github.com/betula/reactive-box-performance), and Pretty looked :kissing_heart:

		You can use as many from Realar as you want. For small websites or theme switchers, two functions are enough:ok_hand: Step by step on the applications scale stairs you can take more and more. From sharing state to all application parts, to modulable architecture with apps composition.
		You can use as many from Realar as you want. For small websites or theme switchers, two functions are enough:ok_hand: Step by step on applications scale stairs you can take more and more. From sharing state to all application parts, to modulable architecture with apps composition.

		### Abstraction

		The abstraction of the core is an implementation of functional reactive programming on javascript and binding that with React.

		It uses usual mathematic to describe dependencies and commutation between reactive values.

		In contradistinction to _stream pattern_, operator functions not needed. The reactive “sum” operator used a simple “+” operator (for example).

		```javascript
		const [getA, setA] = box(0)
		const [getB, setB] = box(0)

		const sum = () => getA() + getB()

		on(sum, console.log)
		```

		That code has a graph of dependencies inside. “sum” - reactive expression depends from “A” and “B”, and will react if “A” or “B” changed. It is perfectly demonstrated with “on” function (that subscribes to reactive expression) and “console.log” (developer console output).

		On each change of “A” or “B” a new value of that sum will appear in the developer console output.

		And for tasty easy binding reactive expressions and values with React components.

		```javascript
		const App = () => {
		const val = useValue(sum);
		return (
		<p>{val}</p>
		);
		}
		```

		That component will be updated every time when new sum value is coming.

		The difference from exists an implementation of functional reactive programming (mobx) in Realar dependency collector provides the possibility to write in selectors and nested writable reactions.

		Realar provides big possibility abstractions for reactive flow. We already know about reactive value container, reactive expressions, and subscribe mechanism. But also have synchronization between data, cycled reactions, cached selectors, and transactions.

		Below I will talk about high level abstractions provided from Realar out of the box.

		- __Shared instances decomposition__. The pattern for decomposing applications logic to separate independent or one direction dependent modules. Each module can have its own set of reactive values. (ssr, comfort “mock” mechanism for simple unit testing)


		- __Actions__ are a necessary part of reactive communication, well knows for most javascript developers. Possibility for subscribing to action, call action, and wait for the next action value everywhere on the code base.


		- __React components context level scopes__. Declaration one scope and use as many reactive value containers as you want no need to define a new React context for each changeable value.


		- __Decorators for clasess lovers__. And babel plugin for automatic wrap all arrow functions defined in the global scope with JSX inside to observe wrapper for the total implementation of transparent functional reactive programming (TFRP) in javascript with React.

		### Classes usage
		@@ -147,2 +198,34 @@

		action

		The action allows you to trigger an event and delivers the functionality to subscribe to it anywhere in your application code.

		```javascript
		const add = action();

		const [get, set] = box(1);
		on(add, num => set(get() + num));

		add(15);
		console.log(get()); // 16
		```
		[Edit on RunKit](https://runkit.com/betula/6013af7649e8720019c9cf2a)

		An action is convenient to use as a promise.

		```javascript
		const fire = action();

		const listen = async () => {
		for (;;) {
		await fire; // await as a usual promise
		console.log('Fire');
		}
		}

		listen();
		setInterval(fire, 500);
		```
		[Edit on RunKit](https://runkit.com/betula/601e3b0056b62d001bfa391b)

		box
		@@ -180,3 +263,3 @@

		We can subscribe to change any reactive expression using `on` function.
		We can subscribe to change any reactive expression using `on` function _(which also works with action)_.

		@@ -231,3 +314,3 @@ ```javascript

		_Documentation not ready yet for `action`, `sel`, `shared`, `effect`, `initial`, `mock`, `unmock`, `free`, `useLocal`, `useValue`, `useShared`, `useScoped`, `Scope`, `observe`, `transaction`, `cache`, `prop` functions. It's coming soon._
		_Documentation not ready yet for `sel`, `shared`, `effect`, `initial`, `mock`, `unmock`, `free`, `useLocal`, `useValue`, `useShared`, `useScoped`, `Scope`, `observe`, `transaction`, `cache`, `prop` functions. It's coming soon._

		@@ -234,0 +317,0 @@ ### Demos

realar - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics