For better Understanding it is first important to understand what is JIT which used to be default Angular compilation mode till Angular 8. After JIT , we will se how AOT works and how its different from JIT :
In JIT compilation mode the TS code written by the developer is compiled to JS code during the build creation. Now, this compiled js code still contains some angular specific code ( for components, decorators, change detection, Dependency Injection etc.)which is compiled at the browser end again at runtime ,with the help of JIT compiler sent along with the build .
in JIT mode when Angular application is bootstrapped in the browser, the JIT compiler performs a lot of work to analyze the components in the application at runtime and generate code in memory. When the page is refreshed, all the work that has been done is thrown away, and the JIT compiler does the work all over again.
The TS code written by the developer is compiled to JS code, this js has already been compiled for angular as well. Now, this compiled js code is compiled by the browser again so that the html can be rendered. But, the catch here is that the features of angular have already been taken care of by AOT compiler and hence the browser don't have to worry much about component creation, change detection, Dependency Injection. So, we have :
There's no need to download the Angular compiler if the app is already compiled. The compiler is roughly half of Angular itself, so omitting it dramatically reduces the application payload.
Detect template errors earlier
The AOT compiler detects and reports template binding errors during the build step before users can see them.
You can also refer Angular's official documentation link for understanding AOT here