11 Angular in production

 

This chapter covers

  • How to properly build Angular for production environments
  • Ways to architect your application for best practices
  • Inspecting your final bundle to determine how dependencies impact your app
  • Deployment options and a sample Dockerfile

So, you’ve built your application—now what? That’s a loaded question, but we’ll try to unpack it in this chapter. You could do or focus on a lot of things, but not everything is necessary in all projects. There are many general web development things you can do, such as enabling gzip on your server, and there are things specific to Angular, such as ensuring you run the build using Ahead-of-Time compilation.

The way we’ve been developing our application by running ng serve is perfectly acceptable for development but unacceptable for production. The dev server isn’t designed to handle real web traffic, can expose vulnerabilities, and can easily crash without warning. You’ll want to use a hardened web server for hosting your application.

You may be writing applications for customers, or for the enterprise. I have experience in both spaces to share. In an enterprise environment, for example, often there are different constraints or greater separation of responsibilities across different teams.

11.1 Building Angular for production

11.1.1 Production build

11.1.2 Optimizing for target browsers

11.1.3 Progressive Web Apps

11.1.4 Internationalization (i18n)

11.1.5 Using alternative build tooling

11.1.6 Server-side rendering or pre-rendering

11.1.7 Build pipelines

11.2 Angular architecture choices

11.2.1 Lazy load routes

11.2.2 Reduce external dependencies

11.2.3 Stay up-to-date

11.3 Deployment

Summary