Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/rstgroup/eventrix
Open-source, Predictable, Scaling JavaScript library for state managing and centralizing application global state. State manage system for react apps.
https://github.com/rstgroup/eventrix
hooks javascript react react-native reactjs ssr state state-management
Last synced: 9 days ago
JSON representation
Open-source, Predictable, Scaling JavaScript library for state managing and centralizing application global state. State manage system for react apps.
- Host: GitHub
- URL: https://github.com/rstgroup/eventrix
- Owner: rstgroup
- License: mit
- Created: 2020-05-27T21:38:55.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2024-06-30T21:16:45.000Z (4 months ago)
- Last Synced: 2024-10-30T08:18:13.626Z (12 days ago)
- Topics: hooks, javascript, react, react-native, reactjs, ssr, state, state-management
- Language: TypeScript
- Homepage:
- Size: 247 KB
- Stars: 91
- Watchers: 7
- Forks: 3
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
- Code of conduct: docs/code_of_conduct.md
Awesome Lists containing this project
- awesome-state - eventrix
README
![Eventrix](assets/logo_br.svg)
STATE MANAGMENT FOR **REACT** AND **REACT NATIVE** APPS
[![Build Status](https://travis-ci.org/rstgroup/eventrix.svg?branch=master)](https://travis-ci.org/rstgroup/eventrix)
[![npm](https://img.shields.io/npm/l/eventrix.svg)](https://npmjs.org/package/eventrix)
[![npm](https://img.shields.io/npm/v/eventrix.svg)](https://npmjs.org/package/eventrix)### Support
- React
- React Native
- SSR (Next.js)### Installation
```bash
$ npm install eventrix --save
```### Documentation
[**Get started**](https://eventrix.gitbook.io/eventrix/getting-started)
|
[**API**](https://eventrix.gitbook.io/eventrix/hooks/useeventrixstate)
|
[**Migration from Redux**](https://eventrix.gitbook.io/eventrix/redux-greater-than-eventrix)
|
[**Demo**](https://eventrix.gitbook.io/eventrix/demo)### Home page
We have website dedicated to eventrix. Go to [**eventrix.io**](https://eventrix.io) and see what eventrix has to offer.
### Quickstart
eventrixStore.js
```js
import { Eventrix } from 'eventrix';
import receiversList from './receivers';const initialState = {
users: [],
};const eventrixStore = new Eventrix(initialState, receiversList);
export default eventrixStore;
```App.jsx
```jsx harmony
import { StrictMode } from "react";
import ReactDOM from "react-dom";
import { EventrixProvider } from 'eventrix';
import eventrixStore from './eventrixStore';const rootElement = document.getElementById("root");
ReactDOM.render(
,
rootElement
);
```UsersList.jsx
```jsx harmony
import React, { useCallback } from 'react';
import { useEventrixState, useEmit } from 'eventrix';const UsersList = () => {
const [users] = useEventrixState('users');
const emit = useEmit();
const fetchUsers = useCallback(() => {
emit('fetchUsers');
}, [emit]);
return (
{users.map(user =>{user.name} {user.surname})}
)
}
```receivers.js
```js
import axios from 'axios';
import { EventsReceiver } from 'eventrix';const fetchUsersReceiver = new EventsReceiver('fetchUsers', (eventName, eventData, stateManager) => {
return axios.get('https://myDomain.com/users').then((response) => {
const usersList = response.data;
stateManager.setState('users', usersList);
});
});const receiversList = [fetchUsersReceiver];
export default receiversList;
```### About
[Eventrix](https://eventrix.io/) is a scaling and predictable JS library for state managing and centralizing application global state.
Eventrix solves the problem of sharing information between elements of the application, as well as communication between them. This open source library is suitable for both very large and small applications. Eventrix enables flexible expansion of the global state as well as enables greater control over the data flow in the application.
If you need to manage a state that is shared between services and components in an app, Eventrix is the best solution available. Similar to a message broker for fronted with an addition allowing to manage the global states, it also enables these elements to communicate through events.
The biggest advantages to REDUX TOOLKIT are:
- CPU 50% EVENTRIX REDUCE CPU USAGE
- FPS 100% EVENTRIX BETTER THAN REDUX TOOLKIT
- JS Heap size 51% EVENTRIX BETTER THAN REDUX TOOLKIT
- Action in time x5 EVENTRIX BETTER THAN REDUX TOOLKITCheck it yourself using those tools:
- [Eventrix Performance Test App](http://eventrix-test.proserwit.pl/?q=100&s=20)
- [Redux Performance Test App](http://redux-test.proserwit.pl/?q=100&s=20)
- [Redux Performance Test App](http://redux-toolkit-test.proserwit.pl/?q=100&s=20)Video of how it works and a performance comparison:
[React REDUX vs Eventrix performance test](https://www.youtube.com/watch?v=Vq-CS6hoK7I)Greater control of data flow thanks to additional tools (devtools) and a small threshold of entry (small amount of code to write):
[Eventrix DevTools](https://github.com/rstgroup/eventrix-devtools)### Contribute
- use eslint rules
- write clean code
- unit tests (min 85% of your code should be tested)
- [code of conduct](https://github.com/rstgroup/eventrix/blob/master/docs/code_of_conduct.md)### License
eventrix package are [MIT licensed](https://github.com/rstgroup/eventrix/blob/master/LICENSE)
### Powered by
[RST Software Masters](https://rst.software) look on RST [Github](https://github.com/rstgroup)