Redux são como contêineres de estado no SwiftUI. Recomendações

Na semana passada, conversamos sobre contêineres de estado semelhantes ao Redux no SwiftUI . O Redux fornece uma única fonte de valores verdadeiros que evita um grande número de erros em potencial que podem ocorrer em diferentes estados do aplicativo. Nesta semana, falaremos sobre métodos comprovados para criar aplicativos baseados em Redux que manterão nossa base de códigos simples e sem erros.

Normalização

O conceito de Redux tem um objeto de armazenamento que contém o estado de todo o aplicativo e isso serve como uma única fonte de valores verdadeiros para o nosso aplicativo. Isso nos permite sincronizar a interface do usuário com o estado do aplicativo. Mas para conseguir isso, primeiro, é necessário normalizar o estado. Considere o seguinte exemplo de código.

struct AppState { var allTasks: [Task] var favorited: [Task] } 

Existe uma estrutura do AppState que armazena uma lista de tarefas simples e selecionadas. Parece simples, mas tem uma grande falha. Suponha que exista uma tela de edição de tarefas na qual você possa alterar a tarefa selecionada. Sempre que o usuário clica no botão "Salvar", precisamos encontrar e atualizar uma tarefa específica na lista de todas as tarefas (todas as tarefas) e na lista de tarefas favoritas (selecionadas). Isso pode levar a erros e problemas de desempenho se a lista de tarefas for muito grande.

Vamos melhorar um pouco o desempenho do aplicativo normalizando a estrutura do estado. Antes de tudo, devemos armazenar nossas tarefas no Dicionário , onde o identificador da tarefa é a chave e a tarefa em si é o valor. Um dicionário pode obter um valor-chave por um tempo constante (O (1)) , mas não preserva a ordem. Nesse caso, você pode criar uma matriz com identificadores para preservar a ordem. Agora vamos ver o estado alterado após a normalização.

 struct AppState { var tasks: [Int: Task] var allTasks: [Int] var favorited: [Int] } 

Conforme indicado no exemplo acima, as tarefas são armazenadas no Dicionário, onde o ID do identificador da tarefa é a chave e a própria tarefa é o valor. Matrizes de identificadores são armazenadas para todas as tarefas e tarefas selecionadas. Alcançamos um estado de estabilidade que sincroniza a interface do usuário e os dados.

Estado de composição

É muito natural armazenar o estado do seu aplicativo em uma única estrutura, mas pode explodir assim que você adicionar mais e mais campos à estrutura do estado. Podemos usar o estado composicional para resolver esse problema. Vejamos um exemplo.

 struct AppState { var calendar: CalendarState var trends: TrendsState var settings: SettingState } 

No exemplo de código acima, dividimos nosso estado em três partes separadas e as combinamos em um AppState.

Redutor de composição

Outro componente importante de um contêiner de estado semelhante ao Redux é o próprio Redutor . Pode ser extraído e combinado, como foi o caso da estrutura de estados. Isso nos permitirá cumprir o princípio da responsabilidade única e manter objetos como redutores de tamanhos pequenos.

 enum AppAction { case calendar(action: CalendarAction) case trends(action: TrendsAction) } let trendsReducer: Reducer<TrendsState, TrendsAction> = Reducer { state, action in // Implement your state changes here } let calendarReducer: Reducer<CalendarState, CalendarAction> = Reducer { state, action in // Implement your state changes here } let appReducer: Reducer<AppState, AppAction> = Reducer { state, action in switch action { case let .calendar(action): calendarReducer.reduce(&state.calendar, action) case let .trends(action): trendsReducer.reduce(&state.trends, action) } } 

Conclusão

Hoje falamos sobre duas estratégias importantes que devemos usar ao desenvolver aplicativos usando contêineres de estado semelhantes ao Redux no SwiftUI. Normalização e integração tornam o aplicativo criado mais simples e mais compreensível. Espero que você goste deste artigo.

Obrigado pela leitura e até a próxima semana!