Built-In Font Optimization: Improve Angular Performance & Core Web Vitals

### Which @angular/* package(s) are relevant/related to the feature request?

@angular/core and @angular/cli

### Problems :

- Using custom fonts from **Google Fonts** can significantly impact FCP, LCP and initial load performance in Angular applications.

- Downloading fonts from Google servers adds **extra HTTP requests** and **latency**, slowing down initial paint times.

- The **font swapping** has the potential to cause layout shifts and so impact Cumulative Layout Shift (CLS).

### Proposed Solution :

- Introduce a **built-in** **mechanism** in Angular to **automatically downloads fonts** specified by their Google Fonts names (or similar identifiers) during the build process and **self-host fonts** within the application, eliminating the need for external font services like Google Fonts.

- Utilize **preconnect**, **preload**, and **size-adjust** for optimal performance and seamless font rendering.

### Benefits :

- **Improved Performance:** Reduces reliance on external requests, minimizes layout shifts (thanks to the underlying CSS size-adjust) , and enables efficient caching.

- **Improved FCP and LCP:** Optimized fonts and proactive loading strategies contribute to significantly faster loading times and smoother user experiences.

- **Enhanced SEO:** Better Core Web Vitals can lead to higher search engine ranking and increased website traffic.

- **Enhanced Security:** Minimizes exposure to external vulnerabilities and provides more control over font sources.

- **Developer Experience:** Built-in font optimization in Angular improves developer experience.

### Alternatives considered

Anyone interested is welcome to comment on what the proposed syntax and feature set will be.

Inspired by next.js automatic font self-hosting library ( [next/font](https://nextjs.org/docs/app/api-reference/components/font) )

Commencez par examiner les zones de @angular/core et @angular/cli impliquées dans la gestion des polices lors du build, et comparez le comportement proposé avec Next.js next/font. Définissez les identifiants de polices pris en charge, le flux de téléchargement et de self-hosting lors du build, ainsi que le comportement de preconnect, preload et size-adjust avant l’implémentation. La tâche est considérée comme terminée lorsque la fonctionnalité fonctionne pour Google Fonts et améliore les objectifs indiqués en matière de chargement et de décalage de mise en page.

Rédigé par le modèle d'indexation à partir du texte de l'issue.