نسخه 13 انگولار، در 4 نوامبر 2021 معرفی شد. این نسخه از فریم ورک انگولار، در حال حاضر در حال شکل گیری می باشد و دو نسخه بتا از آن در تاریخ 4 آگوست و 11 آگوست منتشر شده است که شما می توانید از طریق گیت هاب به آنها دسترسی داشته باشید. این نسخه چندین بروز رسانی ضروری را ارائه کرده است که می تواند برای توسعه Angular مفید باشد. میتوان گفت که با در نظر گرفتن همه نسخه های قبلی انگولار که تا به حال ریلیز شده است، نسخه 13 انگولار یکی از ساده‌ترین و برنامه‌ریزی شده‌ترین به‌روزرسانی‌ها برای یک چارچوب وب مبتنی بر تایپ اسکریپت (TypeScript) است. با آپدیت ورژن های قدیمی انگولار در برنامه های خود به ورژن جدید، پرفورمنس بسیار بهتر خواهد شد و حجم بیلد نهایی، کاهش چشمگیری پیدا خواهد کرد.
برخی از تغییراتی که در ورژن 13 انگولار لحاظ شده است شامل موارد زیر است:
پشتیبانی از تایپ اسکریپت 4.4
انگولار نسخه 13، از تایپ اسکریپت 4.4 به طور کامل پشتیبانی میکند. با این امکان، میتوانیم از بسیاری از ویژگیهای منحصر به فرد این زبان استفاده کنیم. در نسخه جدید انگولار، از تایپ اسکریپت نسخه های قدیمی تر از 4.4.2 دیگر پشتیبانی نمی شود.
قابلیت تست پیشرفته تر
تیم انگولار، تغییرات قابل توجهی در TestBed ایجاد کرده است. با امکان جدید انگولار، DOM بعد از هر تست به طور کامل پاک میشود. در نتیجه توسعه دهندگان می توانند تست های بهینه تر، با وابستگی کمتر به یکدیگر، حافظه کم تر و همچنین سرعت بیشتر را پیش بینی کنند. این ویژگی به صورت پیش‌فرض در این ورژن انگولار قرار داده شده است و در عین حال قابل تنظیم است و به این صورت است که می توان آن را متد TestBed.initTestEnvironment پیکربندی کرد:
beforeEach(() => {
TestBed.resetTestEnvironment();
TestBed.initTestEnvironment(
BrowserDynamicTestingModule,
platformBrowserDynamicTesting(),
{
teardown: { destroyAfterEach: true }
});
});
همچنین میتوانید هر ماژول را به صورت جداگانه با استفاده از متد TestBed.configureTestingModule آپدیت کنید.
beforeEach(() => {
TestBed.resetTestEnvironment();
...
TestBed.configureTestingModule({
declarations: [TestComp],
teardown: { destroyAfterEach: true }
});
});
پشتیبانی کامل از Lvy
از این به بعد View Engine که کامپایلر قدیمی انگولار بود و در ورژن 12 آن منسوخ شده بود، در این نسخه به طور کامل حذف شد. در این نسخه به دلیل اینکه هیچ متا دیتایی مختص View Engine یا فرمت های خروجی قدیمی تر وجود ندارد، پیچیدگی پایگاه داده در کد و همچنین هزینه های نگهداری به شکل چشمگیری کاهش می یابد. این به روز رسانی Angular را کمی سبک تر کرده است.
این فریم ورک، همه ابزارهای داخلی را به Lvy تبدیل کرده است تا این تغییر بتواند به طور یکپارچه عمل کند. Lvy هر جزء را به طور جداگانه اسمبل میکند و در نتیجه باعث تسریع زمان توسعه خواهد شد و همچنین دیگر نیازی به استفاده از ngcc (Angular Compatibility Compiler) برای کتابخانه های ایجاد شده با استفاده از آخرین نسخه APF نیست.
ای پی آی های ارگونومیک
انگولار ورژن 13، زمان بارگذاری را با استفاده از API های تقسیم کد ارگونومیک کاهش داده است. نسخه جدید esbuild نیز باعث بهبود عملکرد شده است. esbuild یک باندلر جاوا اسکریپت بسیار سریع است که برای بهینه سازی اسکریپت های سراسری با terser کار می کند. همچنین با پشتیبانی از source map CSS ، امکان بهینه سازی CSS سراسری را نیز فراهم می کند. علاوه بر این، این باندلر JS از زبان های فریمورک دیگری مانند Vue، Svelte و Elm پشتیبانی می کند.
بهبود Angular CLI و استفاده از امکان جدید Cache build
با لانچ شدن انگولار 13، این فریم ورک به صورت پیش فرض، کش را ایجاد میکند که منجر به بهبود 68٪ در سرعت بیلد می شود و همه نتایج را روی دیسک میسازد. همچنین امکان فعال و غیر فعال کردن تنظیمات کش وجود دارد. علاوه بر این، برای کامپایلر CLI، تجزیه و تحلیل مورد نیاز برای ایجاد افزونه های اضافی در فایل هایی که رفتار این فریم ورک را دارا نیستند حذف شده است. در این ساختار، کامپایلر تلاش می کند تا از داده هایی که در کامپایل های قبلی استفاده شده اند بیشترین استفاده را ببرد. این کار باعث می شود تا از بیلد مجدد توسط سیستم جلوگیری شود و در نتیجه پرفورمنس بیلد به میزان قابل توجهی بهبود پیدا خواهد کرد. در صورتیکه پروژه خود را به این ورژن upgrade کردید، میتوانید برای فعالسازی این امکان، مقدار زیر را در angular.json
تنظیم نمایید:
{
"$schema": "...",
"cli": {
"cache": {
"enabled": true,
"path": ".cache",
"environment": "all"
}
}
}
برای اطلاعات بیشتر، میتوانید از اینجا مطالعه کنید.
تغییرات در فرمت پکیج انگولار(APF)
با استفاده از Angular Package Format (APF) فرمت و ساختار پکیج های فریم ورک انگولار را مشخص می کند که در واقع یک رویکرد عالی برای پکیج کردن هر کتابخانه third-party در اکوسیستم توسعه وب است. (برای مطلب بیشتر در مورد APF اینجا را مطالعه کنید.)
انگولار 13 نسخه جدیدی از APF را معرفی کرده است که شامل تغییرات قابل توجهی میباشد:
· باندل UMD دیگر تولید نخواهد شد.
· کتابخانه‌هایی که با آخرین نسخه APF ساخته شده‌اند، به دلیل استانداردسازی در قالب‌های JS مدرن‌تر مانند ES2020، دیگر نیازی به استفاده از ngcc (اطلاعات بیشتر را از اینجا بخوانید) ندارند.
· بروز رسانی در بخش پشتیبانی از Node Package Exports (اطلاعات بیشتر را از اینجا بخوانید) که به توسعه دهندگان کمک می کند تا ناخواسته به API های داخلی که ممکن است تغییر کنند تکیه نکنند.
تغییرات در فریم ورک و به روز رسانی های وابستگی
برخی تغییرات و به روز رسانی های مهم شامل موارد زیر میباشد:
· عدم پشتیبانی از IE11
· نسخه های Node.js قدیمی تر از ورژن 12.20 پشتیبانی نمی شوند.
· پسوندهای واکنشی برای جاوا اسکریپت ورژن 7(rxjs) پشتیبانی می شود.
· نسخه 13 اکنون از فونت های Adobe پشتیبانی می کند.
جهت مطالعه بیشتر روی سایر تغییرات میتوانید اینجا را ببینید.
جمع بندی:
نسخه جدید فریم ورک انگولار با ویژگی های هیجان انگیزی همراه بود. اگر نیازهای شما به اینترنت اکسپلورر 11 وابسته نیست، این شانس را دارید که با اجرای ng update در پروژه خود، راحت تر به Angular 13 به روز رسانی کنید. تیم Angular سعی می کند هر شش ماه یک نسخه جدید به روز کند. اکنون که به‌روزرسانی‌ها و برخی ویژگیهای قابل توجه Angular 13 را می‌دانید، باید آن را امتحان کنید. اگر هنوز از نسخه 12 قدیمی Angular استفاده می کنید، زمان آن رسیده است که آن را به نسخه 13 ارتقا دهید تا برنامه های شگفت انگیزی ایجاد کنید که از استانداردهای توسعه وب مدرن پشتیبانی می کنند.
میتوانید کد نسخه جدید را در GitHub و وبلاگی که جزئیات کامل انتشار را اعلام میکند، در اینجا پیدا کنید.
منابع:
https://angular.io/guide/update-to-latest-version
https://betterprogramming.pub/angular-13-features-ef528a9ae16f
https://www.mindinventory.com/blog/whats-new-in-angular-13
https://blog.angular.io/angular-v13-is-now-available-cce66f7bc296
