SirSerje

I apologize for the misunderstanding earlier. Let’s focus on diagnosing why your custom state management solution is running slower than NGXS, despite appearing to have a simpler implementation. We’ll explore potential bottlenecks in your code, compare them with NGXS’s optimizations, and provide actionable recommendations to enhance performance.

1. Potential Performance Bottlenecks in Your Custom Store

a. Usage of Immer’s produce Function

•	Issue: While Immer simplifies immutable state updates, it introduces overhead by creating proxies and performing structural sharing. This can become a performance bottleneck, especially with frequent or large state updates.
•	Impact: Each call to set involves produce, which can slow down state mutations, particularly in applications with complex or large state trees.

b. Local Storage Operations on Every State Update

SirSerje

### ALIASES



# If you come from bash you might have to change your $PATH.
# export PATH=$HOME/bin:/usr/local/bin:$PATH

# Path to your oh-my-zsh installation.
export ZSH="$HOME/.oh-my-zsh"

SirSerje

const add = (a,b) => a+b;

function memo (fn) {
  let args = [];

  function result(a,b) {
    let hasMemo = args.reduce((acc, i) => {
      if(i.a === a && i.b === b) {
        return i;
      }

SirSerje

class Counter {
  constructor(i = 0) {
    // this.counter = 999
    this._count = i
  }

  addOne() {
    this._count++
  }

SirSerje

console.clear() //just clear console

//any instantinated dog should bark somehow
interface IBark {
  bark: (param: any) => string
}

// abstract for class means, class should be extended, not instantinated
abstract class AbstractDog implements IBark {
  private weight: number = 15;

SirSerje

Array.prototype.odd = function () {
    return this.filter(i => i%2 === 1)
}

console.log([1,2,3,4,5,6].odd())

SirSerje

{
  "compilerOptions": {
    "sourceMap": true,
    "noImplicitAny": false,
    "module": "commonjs",
    "target": "es5",
    "jsx": "react",
    "allowJs": true,
    "allowSyntheticDefaultImports": true,
    "experimentalDecorators": true,

SirSerje

import mongoose from 'mongoose';
import dotenv from 'dotenv';
import { Readable } from 'stream'

let bucket;

const envConfig = dotenv.config();
if (envConfig.error) {
  console.log('.env file does not loaded');
  throw envConfig.error;

SirSerje

import React from 'react';
import './App.css';
import './index.css'

function App() {
  return (
    <div className="App">
      <Parent/>
    </div>
  );

SirSerje

const AddWelcome = (GreetingComponent) => {
  class TheNewComponent extends Component {
    render() {
      return (
        <div>
          <GreetingComponent {…this.props}/>
          <p>Welcome to React!</p>
        </div>);
      }
    }