آشنایی با ویژگی های Angular 8

در این نوشته قراره به صورت خلاصه یک سری ویژگی هایی که به جدیدترین نسخه انگولار یعنی Angular8 اضافه شده بپردازیم و اونهارو بررسی کنیم .البته احتمال میره که در نسخه بعدی تغییرات خیلی بزرگتری داشته باشیم چون در این نسخه از این فریمورک تغییراتی در اون حد که شاید فکر میکردیم و انتظار داشتیم بزرگ نبود(هنوز همه تغییرات کامل نشدن) . در ادامه یک سری از این تغییرات و ویژگی ها رو بررسی میکنیم ؛ این ویدئو هم مختصرا در 9 دقیقه نگاهی به Angular 8.0 میندازه ، اگه علاقه مند بودید میتونید ویدئو روهم ببینید.

بهتره به عنوان اولین مورد اون ویژگی رو بررسی کنیم که اکثر علاقه مندان این فریمورک از ورژن 7 به بعد منتظر حضور اون در ورژن هشتم بودن و میشه گفت IVY اتفاق  خوشایند در نسخه هشتم فریمورک انگولار هست . البته که هنوز به صورت کامل ارائه نشده و به همین دلیل هم در اول این نوشته اشاره کردم احتمالا ورژن 9 میتونه اتفاق های خوب بیشتری رو به همراه داشته باشه .

Ivy کامپایلر جدید هست که در انگولار قراره مورد استفاده قرار بگیره . با استفاده از اون سرعت رندر بهتر شده و همچنین ظرفیت ایجاد کد حجم کمتری نسبت به قبل دارد .جالب اینجاست که این ویژگی با کد های قبلی شماهم سازگار هست و خیلی راحت میتونید از این قابلیت در کد های قدیمیتون هم استفاده کنید بدون اینکه نیاز باشه کار خاصی انجام بدید .

اگه بخوایم خیلی خلاصه وار هدف یا ویژگی های lvy رو بیان کنیم میشه به کمتر شدن حجم فایل های build شده ، افزایش سرعت کامپایل ، خطایابی در کد های template ها و … اشاره کرد. البته اینطور که تیم توسعه دهنده انگولار بیان کردند بهتر هست که از lvy در حال حاضر استفاده نکنیم و روش های قبلی برای رندر کدهامون رو به کار ببریم چون احتمالا به زودی تغییراتی در اون اعمال بشه .

ویژگی بعدی که میشه در انگولار هشت در موردش صحبت کرد کاهش حجم بسته angular هست . البته درصدی از این کاهش حجم به دلیل استفاده از ویژگی های جاوااسکریپت هست که در Angular8 هم مورد استفاده قرار گرفته که خب این فریمورک در مرورگر های جدید خیلی بهینه تر اجرا میشه .

سومین موردی که میشه بهش اشاره کرد Migration هست . در انگولار 8 locationUpgradeModule ایجاد شده که یک سرویس یکپارچه برای ما فراهم میکنه . این مورد باعث میشه کارایی برنامه زمانی که از ngUpgade استفاده میکنه در قسمت هایی که نیاز به روتینگ هست در angularjs بهبود پیدا کنه .

ویژگی دیگری که در انگولار8 میشه به اون اشاره کرد ابزار Bazel هست . این مورد هم سرعت build پروژه رو خیلی خوب افزایش میده .bazel  از قابلیت incremental استفاده میکنه و فقط تغییرات رو دوباره Build میکنه و اینطوری زمان رو بسیار کاهش میده . برای ایجاد یک پروژه جدید به همراه Bazel میتونید از خط کد زیر استفاده کنید :

البته شاید بد نباشه این مقاله رو هم یه نگاهی بندازید .

درضمن angular8 از Typescript3.4 به بالا پشتیبانی میکنه ، پس باید اول نسخه  تایپ اسکریپت خودتون رو هم به روزرسانی کنید .

ویژگی بعدی باعث میشه مرورگرهایی که استاندارد هایی مثل ES6 پشتیبانی میکنند فایل های build رو با حجم پایین تر داشته باشند . این ویژگی مفید   Differential Loading نام داره .یعنی ما میتونیم نسخه های build مختلفی رو برای مرورگر های متفاوت ایجاد کنیم .

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

همچنین در انگولار8 میتونید از قالب هایی که پسوند SVG هم دارند به جای قالب های HTML استفاده کنید بدون اینکه نیاز باشه کار خاص یا تنظیمات خاصی رو انجام بدید . در ورژن جدید این فریمورک ، قابلیتی برای ساخت API ها فراهم شده که از دستور های  ng run , Ng build,  ng test استفاده کنیم .

در نسخه قبلی انگولار برای اینکه یه ماژول رو تعریف کنیم باید از یک رشته که مسیر و نام ماژول رو داشت استفاده میکردیم اما در حال حاضر باید از دستور import استفاده کنیم که کارمون رو خیلی راحت تر و ساده تر کرده . همچنین از این به بعد انگولار از مدیریت کننده بسته های جدیدی به اسم PNPM پشتیبانی میکنه ، pnpm به صورت ترکیبی از npm و yarn استفاده میکنه .

در نسخه جدید این فریمورک ، angular cli امکان استفاده از builder به اسم Architect Api  آماده شده ، این builder ویژگی هایی مثل server ،  Test ، build و .. را خیلی بهتر و با کیفیت تر فراهم میکنه.

برای بروزرسانی پیشنهاد میکنم به آدرس  https://update.angular.io سر بزنید و طبق اون پیش برید ، الیته در ویدئو اول مقاله هم در مورد بروزرسانی صحبت میشه. شماهم اگه تجربه ای در این زمینه دارید یا مقاله خوبی رو در این مورد مطالعه کردید در کامنت ها باهامون به اشتراک بزارید .

www.c-sharpcorner.com

alligator.io

blog.ninja-squad.com