Ideas for Angular App Architecture

  • PWA
    • Making our app a Progressive Web App would enhance our control over caching and optimistic updates.
  • Service Worker
    • This will allow us to do periodic background syncs and send push notifications to users.
    • @angular/service-worker package from the core team would help with this.
  • SSR
    • Server-side rendering, especially for the landing pages would greatly enhance the initial load time.
    • Angular Universal will help us accomplish this.
  • AOT Build
    • Having Ahead of Time build using Angular CLI would speed up rendering as the templates would be precompiled.
    • This along with tree shaking would also make our bundles smaller as we wouldn’t need to download the compiler like we do for JIT today.
  • Code Splitting
    • Creating separate bundles for key routes would allow granular control over the resources we send to the client.
    • For instance we’ll not send feature bundle to users who’re not entitled to use it.
  • Router Store
    • Like we use ngRx store for Redux, we can also levarage @ngrx/router-store to manage app routes.
  • Schematics
    • We can leverage CLI Schematics to scaffold consistent templates across all artifacts.
    • @ngrx/schematics also integrates with the CLI and can help us generate Redux artifacts.
  • Angular CDK
    • The Angular Component Dev Kit package would help us manage our component layouts, overlays, accessibility etc. features.
  • Angular Elements
    • This is new in Angular 6 and can be leveraged for exposing our components as the Web Components standard.
  • Storybook
    • We can use the Storybook library to showcase our UI components library.
    • It’ll allows us to view the different states of each component, and interactively develop and test components.
  • NgRx Data
    • This is a new library that we can leverage along with ngrx entity
    • It will help us replace our currently handwritten reducers and selectors and reduce boilerplate.

 

Advertisements