چه چیزی در Angular 13 جدید است؟ ویژگی های جدید در Angular 13

Angular به تازگی نسخه 13 را منتشر کرده است و دارای انواع ویژگی ها و به روز رسانی های جدید است. در این مقاله، ما در مورد تمام ویژگی های جدید موجود در Angular 13 صحبت خواهیم کرد. در اینجا همه چیزهایی که باید در مورد Angular 13 و ویژگی های جدید آن بدانید، آورده شده است.

فهرست مطالب

• آنچه در Angular 13 جدید است – در یک نگاه
• آنچه در Angular 13 جدید است – با جزئیات
• نحوه آپدیت به Angular 13
• قالب های ما برای Angular 13

چه چیزی در Angular 13 جدید است؟

در اینجا برخی از بزرگترین تغییرات در Angular 13 آمده است که برای شما ساده شده است:

• به‌روزرسانی‌های رندر زاویه‌ای – View Engine با Angular Ivy Engine جایگزین شده است.
• قالب‌های خروجی قدیمی‌تر مانند ابرداده‌های خاص View Engine حذف شده‌اند. APF اکنون از فرمت های مدرن مانند ES2020 استفاده می کند.
• API کامپوننت ساده شده است.
• پشتیبانی از اینترنت اکسپلورر متوقف شده است
• پشتیبانی از TypeScript 4.4 اضافه شده است
• نسخه های Node.js قدیمی تر از v12.20 پشتیبانی نمی شوند
• پسوندهای واکنشی برای جاوا اسکریپت (rxjs) v7 پشتیبانی می شود
• Angular v13 از استفاده از حافظه پنهان ساخت مداوم پشتیبانی می کند که منجر به بهبود 68٪ در سرعت ساخت می شود.
• TestBed بهبود یافته است
• اجزای مبتنی بر MDC تمام استانداردهای دسترسی را برآورده می کنند
• نسخه 13 اکنون از فونت های Adobe پشتیبانی می کند

ویژگی های Angular v13 در جزئیات

به روز رسانی های رندر زاویه ای

View Engine از نسخه 13 از Angular حذف شده است. View Engine حذف شده است.

با موتور Angular Ivy که بهتر و قابل اعتمادتر است جایگزین شده است. گفته می شود که این خط لوله کامپایل و رندر نسل بعدی Angular است. این به روز رسانی Angular را کمی سبک تر کرده است.

با حذف View Engine، Angular همچنین می تواند اتکا به آن را کاهش دهد ngcc در آینده ی نزدیک. این منجر به کامپایل سریع‌تر در Angular 13 می‌شود، زیرا متادیتا و فایل‌های خلاصه گنجانده نشده‌اند.

تغییر در قالب بسته زاویه ای

قالب بسته زاویه ای ساده و مدرن شده است. V13 از Angular Package Format معرفی شده است که کدهای مخصوص View Engine را از بسته ها حذف می کند. APF همچنین اکنون از فرمت های مدرن JS مانند ES2020 استفاده می کند. این به طور موثر تضمین می کند که توسعه دهندگان کتابخانه می توانند انتظار خروجی بسته کمتر و اجرای سریعتر را داشته باشند. APF همچنین برای پشتیبانی از Node Package Export به روز شده است. این در نهایت می تواند به شما کمک کند تا به API های داخلی اعتماد نکنید.

به‌روزرسانی‌های Component API

Ivy Engine نحوه ایجاد پویا اجزا را تغییر می دهد. API کامپوننت ساده شده است. قبل از تغییرات، ایجاد پویا مولفه ها به کدهای دیگ بخار زیادی نیاز داشت. کد را می توان با API جدید به شدت کاهش داد.

پشتیبانی از IE حذف شده است.

این اطمینان حاصل می کند که برنامه ها از نظر حجمی و مسیرهای کد مخصوص IE، از نظر اندازه کوچکتر هستند و می توانند سریعتر بارگذاری شوند. Angular 13 به طور پیش فرض از استفاده از حافظه پنهان ساخت دائمی پشتیبانی می کند که سرعت را تا 68 درصد بهبود می بخشد.

این به Angular اجازه می‌دهد تا از ویژگی‌های مرورگر مدرن مانند متغیرهای CSS، انیمیشن‌های وب از طریق APIهای وب بومی و غیره پشتیبانی کند. برنامه‌های ساخته شده با نسخه 13 نیز کوچک‌تر و سریع‌تر خواهند بود زیرا پلی‌فیل‌ها و مسیرهای کد مخصوص IE را می‌توان حذف کرد. نیازی به بارگذاری دیفرانسیل نیست. توسعه دهندگان و کاربران بهترین تجربه را دارند.

تغییرات در چارچوب

RxJS 7.4 اکنون در Angular 13 به طور پیش فرض است. برنامه های موجود باید به صورت دستی به 7.4 به روز شوند. علاوه بر این، پشتیبانی از TypeScript 4.4 نیز از 5 اکتبر اضافه شده است. نسخه های قدیمی تر از 4.4.2 دیگر پشتیبانی نمی شوند. می‌توانید با جستجوی «typescript» برای مشاهده نسخه، این مورد را در package.json بررسی کنید.

بهبودهای CLI زاویه ای:

یک حافظه پنهان ساخت دائمی به‌صورت پیش‌فرض، اکنون ساخت‌ها را با Angular 13 بهبود می‌بخشد. اکنون Angular از استفاده از حافظه پنهان ساخت دائمی به‌طور پیش‌فرض برای پروژه‌های نسخه 13 جدید پشتیبانی می‌کند که منجر به بهبود 68 درصدی در سرعت ساخت می‌شود. برای کسب اطلاعات بیشتر در مورد نحوه فعال کردن این ویژگی، بررسی کنید مستندات.

تغییرات در تست های زاویه ای

TestBed بهبود یافته است. اکنون می‌توانید نتایج سریع‌تری را انتظار داشته باشید که به اندازه حافظه فشرده، مستقل‌تر و بهینه‌تر نیستند.

استانداردهای دسترسی

اجزای مبتنی بر MDC اکنون تمام استانداردهای دسترسی را برآورده می کنند، به ویژه در زمینه هایی مانند کنتراست، اهداف لمسی و موارد دیگر.

سایر تغییرات در Angular v13

درست همانطور که پشتیبانی آنها از فونت های درونی گوگل در Angular v11 معرفی شد، Angular v13 اکنون از فونت های Adobe پشتیبانی می کند. این برای بهبود First Contentful Paint، که یکی از فاکتورهای مهم Core Web Vitals Google است، یک شرط رتبه بندی جزئی است که در سال 2021 معرفی شد، عالی است.

به لطف اسناد به روز شده در angular.io، توسعه دهندگان می توانند بینش بیشتری در مورد API محلی سازی دریافت کنند. دنبال کردن آن ساده تر شده است، ما به شما توصیه می کنیم آن را بررسی کنید.

همچنین می توانید اعتبار سنجی ها را به صورت پویا فعال یا غیرفعال کنید. اعتباردهنده های داخلی را می توان با تنظیم مقدار روی null غیرفعال کرد. وقتی فرم های پویا می سازید این عالی است.

همچنین می توانید پس از لغو ناوبری، تاریخچه را بازیابی کنید. این ویژگی جدید انجمن به پرچم روتر canceledNavigationResolution اجازه می‌دهد تا مقدار محاسبه‌شده تاریخچه مرورگر را در صورت تنظیم برای محاسبه بازیابی کند.

سایر مشارکت های جزئی جامعه نیز اضافه شده است. SwUpdate API اکنون ارگونومیک تر است. پیکربندی سرویس زبان می‌تواند اعمال خودکار تغییر اختیاری را در نماد پوچ‌پذیر فعال کند. برای فهرست کامل مشارکت‌های جامعه، اسناد کامل را بررسی کنید.

چگونه به Angular 13 آپدیت کنیم؟

با اجرای ng update در پروژه خود می توانید Angular 13 را دریافت کنید. Angular یک راهنمای به‌روزرسانی دارد که می‌توانید از آن برای دریافت دستورالعمل‌های دقیق در مورد به‌روزرسانی به angular نیز استفاده کنید.

قالب های ما برای Angular 13

در حال حاضر، ما قالب هایی نداریم که با Angular 13 ساخته شده باشند، اما در صورت داشتن این کار، این مقاله را به روز خواهیم کرد. ما در ماه‌های آینده چند قالب آماده خواهیم داشت، پس اگر علاقه‌مند هستید دوباره بررسی کنید. در همین حال، این الگوهای رایگان Angular (قدیمی‌تر از نسخه 13) را بررسی کنید.

نتیجه:

امیدواریم این مقاله مفید بوده باشد. ما سعی کرده‌ایم ویژگی‌ها را ساده‌تر درک کنیم. برای جزئیات بیشتر، همیشه می توانید تغییرات کامل Angular را بررسی کنید اینجا. برای راهنمای به روز رسانی دقیق، می توانید بررسی کنید https://update.angular.io/

فعلا همین است، تا دفعه بعد، کدنویسی مبارک!