SolidJS•12mo ago

Best pattern when using createStore to store large amount of data for a large app?

As the title says, what is the best pattern, is there an example on github or something you could show? In react + mobx, I know this pretty nice pattern which looks really clean and been using. Is there something like this pattern or something better for createStore?

import { makeAutoObservable } from 'mobx';

class Users {
  users: Record<string, User> = {}
  constructor() {
    makeAutoObservable(this)
  }
  addUser(data: RawUser) {
    const newUser = new User(data)
    this.users[id] = newUser
  }
}

class User {
  id: string
  username: string
  firstName: string
  lastName: string
  constructor(data: RawUser) {
    this.id = data.id
    this.firstName = data.firstName
    this.lastName = data.lastName
    this.username = data.username
    makeAutoObservable(this)
  }
  get fullName() {
    return `${this.firstName} ${this.lastName}`
  }
  updateName(newUsername: string) {
    this.username = newUsername;
  } 
}

import { makeAutoObservable } from 'mobx';

class Users {
  users: Record<string, User> = {}
  constructor() {
    makeAutoObservable(this)
  }
  addUser(data: RawUser) {
    const newUser = new User(data)
    this.users[id] = newUser
  }
}

class User {
  id: string
  username: string
  firstName: string
  lastName: string
  constructor(data: RawUser) {
    this.id = data.id
    this.firstName = data.firstName
    this.lastName = data.lastName
    this.username = data.username
    makeAutoObservable(this)
  }
  get fullName() {
    return `${this.firstName} ${this.lastName}`
  }
  updateName(newUsername: string) {
    this.username = newUsername;
  } 
}

3 Replies

Alex Lohr•12mo ago

We don't have makeAutoObservable, but you could create signals for each property of your users and a store for Users.users. While you can use classes in Solid, using simple objects and arrays is usually more effective.

Brendonovich•12mo ago

You can return createMutable(this) from the constructor as an equivalent to makeAutoObservable(this) but I really wouldn't recommend it haha

CatNoirOP•12mo ago

yea, that was just an example, if anyone has some good patterns for solidjs, please do share 😅

Gaming

Programming

Best pattern when using createStore to store large amount of data for a large app?