Topics

Anahita Project

Anahita Project's Topics

Rastin Mehr

Rastin Mehr

August 14 2017

React/Redux Architecture in Anahita

I've been looking into ways for implementing a good React Redux architecture in Anahita which will respect the integrity of existing apps and extensions development. Normally in javascript apps everything is combined once and compressed as a final app.js bundle which gets executed in the browser. Once the bundle is created it is permanent until it is rebuilt again. So far 2 approaches come to mind:

Rebuilding the bundle every time: every app provide their own javascript components, stores, and reducers. Everything an app is installed or uninstalled, the bundle file is recreated. There are several issues with this architecture: 

  1. we need to install NodeJS on our servers as well as the standard LAMP or LEMP stack. 
  2. the bundle file may get too large if too many apps are installed
  3. ... I don't know what else could go wrong at this point
The pro is that apps can build custom user interfaces and workflows 

Anahita provides a javascript app that all apps must adhere too: this means Anahita provides a javascript single page app (SPA) and a specific set of UIs and Views that all apps are allowed to use. Apps will only provide additional RESTful API, but no javascript of their own. Native iOS and Android apps are like this. We use a specific set of UI views and interface elements and communicate with multiple APIs. I like the simplicity of this architecture and we won't need to install NodeJS on our servers. It will however take away freedom from apps.

Code Splitting: this is an approach that a number of larger projects are using. The idea is that using Webpack an entry point bundle file is created for Anahita and then it will lazy load additional javascript modules as needed. We probably won't need to have NodeJS on our servers for code splitting. It seems to solve the app portability issue. It can however add to the complexity of the apps.

I am currently researching different code splitting methods. If you have any ideas, please share!

#ReactJS #ReduxJS #CodeSplitting #Webpack

Rastin Mehr
Rastin Mehr
August 15 2017 Permalink
Perhaps we better start coding and see what patterns emerge. We'll find the solution on the way. This concept is so new, looks like that's what everybody is doing.

Powered by Anahita