آموزش تکنیک‌های بهینه‌سازی پرفورمنس در انگولار (Angular) - آخرین آپدیت

سرفصل ها و درس ها

مقدمه Introduction

• بهینه‌سازی عملکرد انگولار Optimize Angular performance

1. عملکرد و انگولار 1. Performance and Angular

• چرا پرفورمنس اهمیت دارد Why performance matters

• فرآیند بیلد (Build) در انگولار The Angular build process

• نحوه عملکرد اپلیکیشن‌های وب مدرن How modern web applications work

2. ابزارهای ارزیابی پرفورمنس 2. Tools for Performance Assessment

• مروری بر ابزارهای سنجش عملکرد Performance tools recap

• بررسی کدها (Linting) برای شناسایی خطاهای رایج Linting your code for common mistakes

• ابزار Lighthouse: دریافت بازخورد و اقدامات اصلاحی Lighthouse: Get feedback and action items to improve

• پروفایلر ابزارهای توسعه انگولار (Angular DevTools) The Angular dev tools profiler

• تحلیل وابستگی‌ها (Dependency Analysis) Dependency analysis

• پروفایلر ابزارهای توسعه کروم (Chrome DevTools) The Chrome dev tools profiler

• بودجه‌بندی بیلد (Build Budgets) Build budgets

3. بهبود عملکرد از طریق حذف کدهای زائد 3. Improving Performance by Removing Code

• استفاده از Standalone Components به جای NgModules Standalone components instead of NgModules

• بررسی دقیق وابستگی‌ها Be critical about dependencies

• حذف وابستگی‌ها و ایمپورت‌های بلااستفاده Removing unused dependencies and imports

• فراتر از کد: تصاویر، CSS، فونت‌ها و سایر دارایی‌ها It's not just code: Images, CSS, fonts, and other assets

• دایرکتیو NgOptimizedImage The NgOptimizedImage directive

4. بهبود عملکرد با استفاده از Lazy Loading 4. Improving Performance with Lazy-Loading

• نحوه عملکرد Lazy Loading How lazy-loading works

• لود تنبل با استفاده از Standalone Components Lazy-loading with standalone components

• پیکربندی و گزینه‌های بلوک @defer @defer block configuration and options

• معرفی بلوک @defer The @defer block: Introduction

• لود تنبل با استفاده از ماژول‌ها Lazy-loading with modules

5. تکنیک‌های اختصاصی انگولار برای بهینه‌سازی 5. Angular-Specific Techniques for Performance

• کش کردن داده‌ها با Angular Service Worker Caching data with Angular service-worker

• استفاده از Signals برای بهبود Change Detection Using Signals to improve change detection

• کامپوننت‌های Container و Presentation Container and presentation components

• نحوه عملکرد Change Detection در انگولار How Angular change detection works

• کش کردن داده‌ها با استفاده از سرویس‌ها Caching data with services

6. رندرینگ سمت سرور (SSR) 6. Server-Side Rendering

• رندرینگ سمت سرور در عمل Server-side rendering in action

• سنجش بهبودها با SSR و SSG Measuring improvements with SSR and SSG

• تولید سایت استاتیک (SSG) Static-site generation (SSG)

• رندرینگ سمت سرور (SSR) چیست؟ What is server-side rendering (SSR)?

• مزایا و معایب SSR و SSG Pros and cons of SSR and SSG

جمع‌بندی Conclusion

• گام‌های بعدی در مسیر یادگیری انگولار Next steps in your Angular journey