Angular files are included in the
<body> tag because they contain the components and templates that make up the Angular application's user interface. These files are loaded dynamically by the browser and used to render the UI for the user.
When an Angular application is loaded in the browser, the HTML file that includes the Angular files is loaded first. The Angular files are then loaded and compiled by the browser, and the resulting components and templates are inserted into the HTML document. This process is necessary for the Angular application to work correctly, as the Angular components and templates must be loaded and compiled before they can be used to render the UI.
By convention, Angular files are typically included in the
<body> tag because this is where the application's UI is typically rendered. However, it's also possible to include Angular files in the
<head> tag if necessary, such as for performance optimization or for other technical reasons.
Additionally, including Angular files in the tag allows the browser to progressively render the page as the Angular files are loaded and compiled. This means that the user will see a user interface being rendered and displayed on the page even before the entire Angular application has finished loading.
Lastly, including the Angular files in the tag makes it easier to manage and organize the application's files and dependencies. Placing them within the tag emphasizes that they are part of the user interface and keeps them separate from other script files that may be included in the tag for other purposes.