این پست در اصل در تاریخ منتشر شده است وب سایت من: https://dsebastien.net
در این مقاله، من (تقریبا) همه چیزهای قابل توجه در این نسخه جدید را مرور می کنم. من همچنین آنچه را که در اطراف Angular تغییر کرده است، برجسته میکنم، درست مانند مقالات قبلیام در مورد زاویه ای 11 و زاویه ای 10.
اگر فقط به دنبال نمای چشم پرنده هستید، آن را بررسی کنید اطلاعیه انتشار رسمی. در اینجا، من عمیقتر به یادداشتهای انتشار میپردازم.
به لیگ پیچک بپیوندید…
تیم Angular روی آن کار کرده است پیچک (پایپ لاین جمعآوری و رندر جدید) از سال 2018. سرانجام با Angular 8 منتشر شد. از Angular 9، Ivy پیشفرض برای پروژههای جدید بوده است و اکوسیستم به آرامی به آن مهاجرت میکند. با Angular 12، موتور View قدیمی اکنون رسماً منسوخ شده است. در نسخه اصلی بعدی حذف خواهد شد. همچنین، ایجاد برنامه های جدید با استفاده از View Engine امکان پذیر نخواهد بود. در نهایت، Ivy اکنون پیش فرض پروژه های جدید کتابخانه است.
در این مرحله، نویسندگان کتابخانه همچنان میتوانند به لطف آن به View Engine اعتماد کنند ngcc
(کامپایلر سازگاری Angular)، اما واقعا وقت آن رسیده است که ارزیابی کنند که آیا می توانند کتابخانه های خود را به Ivy مهاجرت کنند یا خیر. چند هفته پیش، مینکو گچف منتشر کرده است یک مقاله تا آن را به تفصیل توضیح دهد. همچنین، موارد مرتبط را بررسی کنید RFC.
در صورتی که شما نمی دانید ، ngcc
فرآیند کوچکی است که پس از ایجاد یک پروژه Angular یا نصب وابستگی ها اجرا می شود. وقتی پیام هایی مانند Compiling ... : es2015 as esm2015
، این است ngcc
کار خود را انجام می دهد چی ngcc
انجام میدهد کتابخانههایی را کامپایل میکند که به View Engine متکی هستند تا آیوی بتواند آنها را مصرف کند.
احتمالاً شما هم مثل من متوجه این موضوع شده اید ngcc
زمان زیادی برای اجرا نیاز دارد و تأثیر بسیار منفی بر تجربه توسعه دهندگان دارد. به همین دلیل است که برای اکوسیستم Angular بسیار مهم است که در اسرع وقت به Ivy مهاجرت کند. دوم، تا زمانی که اکثر اکوسیستم به حرکت در نیایند، تیم Angular باید View Engine را در اطراف خود نگه دارد، که به دلایل مختلفی مشکل ساز است. آخرین اما نه کماهمیت، کتابخانههایی که به View Engine متکی هستند نمیتوانند به کتابخانههای Ivy وابسته باشند.
نویسندگان کتابخانه احتمالاً نمی توانند خیلی سریع به Ivy مهاجرت کنند، اما باید به وضوح کاربرانی را که تمایلی به ارتقاء ندارند تحت فشار قرار دهند. به هر حال، مسیر پیش رو این است که همه چیز را در اسرع وقت به آیوی منتقل کنید
یک مقاله عالی در مورد آیوی وجود دارد در آنجا.
بای نقاله
در ماه آوریل، تیم Angular برنامههای خود را برای پایان دادن به پشتیبانی از پروتز در پایان 2022.
از Angular 12، نقاله به طور پیش فرض در پروژه های جدید گنجانده نمی شود. در عوض، Angular CLI گزینه هایی را برای استفاده از راه حل های دیگر ارائه می دهد درخت سرو, WebdriverIO، یا کافه تست. این بدان معنی است که ng e2e
فرمان باید در آینده نیز پشتیبانی شود.
همانطور که در توضیح اعلامیه، در سال 2013 زمانی که نقاله ساخته شد، وب درایور نبود یک استانداردو نوشتن تستهای پایان به انتها (e2e) سخت بود و حفظ آن کابوس بود. نقاله یک راه حل ابتکاری با بسته بندی به ارمغان آورد سلنیوم-وب درایور، و راهی برای کنترل جریان اجرا ارائه کرد.
البته از آن زمان تا کنون خیلی چیزها شکل گرفته است. ما الان داریم WebDriver
API ، async
و await
(حتی سطح بالا await
، واو). همچنین، اکوسیستم نیز تکامل یافته است. راه حل هایی مانند درخت سرو, نمایشنامهنویس, توله سگ محبوبیت زیادی (به شایستگی) به دست آورده اند. برای مثال ابزارهایی مانند Cypress تجربه توسعه دهندگان بسیار بهتری نسبت به نقاله ارائه می دهند، از استانداردهای مدرن استفاده می کنند و حتی از تست بین مرورگرها (در میان سایر قابلیت های قدرتمند) پشتیبانی می کنند. یکی دیگر از مزایای ابزارهای آزمایشی فعلی e2e این است که چارچوب-آگنوستیک هستند که بسیار ارزشمند است.
به طور خلاصه، حفظ نقاله برای تیم Angular چندان منطقی نیست. تکامل نقاله اکنون به تلاش بیش از حد نیاز خواهد داشت و تغییرات زیادی را ایجاد می کند. می توانید جزئیات بیشتری را در RFC بیابید، خواندن آن جالب است.
جدول زمانی برای تیمها/پروژههایی که زمان و انرژی زیادی صرف نوشتن تستهای e2e با نقاله کردهاند، مهم است. تیم Angular هنوز مشغول ارزیابی بازخورد جمعآوریشده از طریق RFC است، بنابراین احتمالاً در اواخر سال جاری بیشتر میدانیم.
به هر حال؛ Cypress را امتحان کنید اگر قبلاً امتحان نکرده اید، ناامید نخواهید شد! به هر حال، من همیشه به همه توصیه می کنم که شروع به استفاده کنند Nrwl NX، یک راه حل فوق العاده که شامل پشتیبانی از Angular، React، Next.js، Cypress و موارد دیگر می شود.
ادغام باطل
Angular 12 شامل پشتیبانی برای استفاده از عملگر ادغام باطل در قالب های Angular و این عالی است! آن اپراتور در TypeScript پشتیبانی شده است از نسخه 3.7.
اگر در مورد این اپراتور چیزی نشنیده اید، اجازه دهید یک توضیح سریع به شما بدهم. ایده این است که بتوانیم یک مقدار بازگشتی را در صورت وجود چیزی تعریف کنیم null
or undefined
. در اینجا یک مثال است:
If foo
is null
or undefined
، و سپس x
تنظیم خواهد شد true
(یعنی مقدار بازگشتی)، و میتوانیم آن را روی هر چیزی که دوست داریم تنظیم کنیم.
بدون این عالی ??
اپراتور، به جای آن باید این را بنویسیم:
let x = foo !== null && foo !== undefined ? foo : true;
اکنون که Angular نیز از آن پشتیبانی می کند، در نهایت می توانیم عباراتی مانند:
{{ age ?? calculateAge() }}
به جای جایگزین قدیمی و پرمخاطب تر. شسته و رفته!
می توانید در مورد این تغییر بیشتر بدانید اینجا کلیک نمایید.
شما می توانید اطلاعات بیشتر در مورد ادغام تهی در کتاب راهنمای TypeScript و همچنین در مورد DND.
پشتیبانی از TypeScript 4.2
Angular 12 پشتیبانی از TypeScript 4.2، به این معنی که اکنون می توانیم از a استفاده کنیم تن ویژگی های جدید زبان فوق العاده. همچنین پشتیبانی از TypeScript 4.0 و 4.1 حذف شده است.
در اینجا خلاصه ای سریع از آنچه TS 4.2 شامل می شود آورده شده است:
Smart Type Alias Preservation: انواع مورد انتظار توسط ویرایشگرهای کد به جای انواع خام همانطور که قبلا اتفاق افتاده بود نمایش داده می شوند. شما می توانید در مورد آن بیشتر بدانید اینجا کلیک نمایید.
عناصر پیشرو / استراحت میانی در انواع تاپل: اکنون میتوانیم عناصر استراحت را در هر جای یک تاپل (با چند اخطار) اضافه کنیم. این برای آن دسته از ما که هر از گاهی به تاپل ها تکیه می کنیم بسیار جالب است. در مورد آن بیشتر بدانید اینجا کلیک نمایید.
درک ساختار پروژه شما: TS 4.2 شامل یک پرچم جدید نام --explainFiles
، که به TypeScript دستور می دهد تا اطلاعاتی در مورد اینکه چرا یک فایل در برنامه شما گنجانده شده است را خروجی دهد. این برای عیب یابی بسیار مفید است.
بهبودهایی برای بررسی عملکرد فراخوان نشده: TypeScript اکنون می تواند موارد بیشتری را که در آن توابع فراخوانی نمی شوند شناسایی کند. به عنوان مثال هنگام نوشتن foo
بجای foo()
. جزئیات و نمونه های بیشتر را می توان یافت اینجا کلیک نمایید.
متغیرهای تخریب شده اکنون می توانند به صراحت به عنوان استفاده نشده علامت گذاری شوند: let [_first, second] = getValues();
، که عالی است؛ دیگر خطا وجود ندارد noUnusedLocals
فعال شده است!
در واقع موارد بسیار بیشتری وجود دارد، مانند بررسی های سختگیرانه تر in
اپراتور و چند تغییر اساسی که ممکن است بر شما تأثیر بگذارد. پس حتما بررسی کنید یادداشت های انتشار.
پشتیبانی از Webpack 5
Angular 11 ما را آورد پشتیبانی آزمایشی از Webpack 5. با Angular 12، پشتیبانی Webpack 5 اکنون آماده تولید است. w00t!
اگر نگاه نکرده اید وب پک 5، شما شگفت زده خواهید شد. Webpack 5 در اکتبر 2020 منتشر شد، بنابراین تا کنون کاملاً پایدار است. Webpack در حال حاضر در 5.37 نسخه (چند روز پیش منتشر شد).
در اینجا توضیح کوتاهی در مورد اینکه چه چیزی با Webpack 5 تغییر کرده است، و اینکه چرا من از این موضوع بسیار خوشحالم وجود دارد.
اول از همه، همانطور که می دانید، Webpack است کلید بخشی از پازل Angular CLI است و نقش مهمی در اندازه باندل، عملکرد ساخت و غیره دارد.
دوم، Webpack 5 یک نسخه اصلی به دلایلی است. این شامل تعدادی تغییرات اساسی است، که توضیح می دهد که چرا مدتی طول کشید تا Angular و چندین ابزار/کتابخانه در اکوسیستم به روز شوند.
در یادداشت های انتشار، تیم Webpack نشان داد که Webpack 5 بر روی موارد زیر تمرکز دارد:
- بهبود عملکرد ساخت با ادامه ذخیره
- بهبود حافظه پنهان طولانی مدت با الگوریتم ها و پیش فرض های بهتر
- بهبود اندازه بسته نرم افزاری با تکان دادن درخت و تولید کد بهتر
- بهبود سازگاری با بستر وب
- تمیز کردن سازه های داخلی
- در حال حاضر تغییرات شکستن (هاها) را معرفی می کنیم که به آنها اجازه می دهد تا زمانی که ممکن است در نسخه 5 بمانند
جالب ترین ویژگی Webpack 5 آن است پشتیبانی از فدراسیون ماژول، که پایه های لازم برای تسهیل را فراهم می کند ایجاد حاشیه های کوچک. این کمی خارج از محدوده این مقاله است، اما در یک لحظه، فدراسیون ماژولها این امکان را برای ساختهای مختلف ایجاد میکند که مانند یک گراف ماژول متصل بزرگ رفتار کنند و به ما اجازه میدهد ماژولها را از ساختهای راه دور وارد و استفاده کنیم. وارسی اسناد رسمی بیشتر بدانید.
در میان تغییرات عمده، Webpack 5 همه چیزهایی را که قبلا منسوخ شده بود حذف کرده است (به عنوان مثال، NoEmitOnErrorsPlugin
, ModuleConcatenationPlugin
, NamedModulesPlugin
)، همچنین IgnorePlugin
و BannerPlugin
.
همچنین، پلیفیلهای Node.js که قبلاً به صورت خودکار تزریق میشدند حذف شدهاند. و این یکی از بزرگترین تغییرات در آن نسخه است. این پلیفیلها در ابتدا به Webpack اجازه دادند که از ماژولهای ساخته شده برای Node.js در مرورگر استفاده کنیم. جالب بود، اما یک نقطه ضعف عمده داشت: بسته های بزرگتر. علاوه بر این، این پلیفیلها کمتر و کمتر مفید بودند، زیرا جایگزینهای کتابخانههای سازگار با مرورگر یا توزیعهای خاص با پشتیبانی مرورگر وجود داشت. از وبپک 5، از آنجایی که این پلیفیلها دیگر به صورت خودکار اضافه نمیشوند، ممکن است با شگفتیهایی مواجه شویم. به عنوان مثال در مواردی که ما از ماژول های ساخته شده برای Node.js در مرورگر استفاده می کنیم بدون اینکه متوجه باشیم که قبلاً به لطف Webpack کار می کرد. شما می توانید در مورد آن اطلاعات بیشتری کسب کنید اینجا کلیک نمایید.
Webpack 5 پشتیبانی بهتری را برای کش طولانی مدت معرفی کرده است. در حالت تولید، اکنون به طور پیش فرض شامل الگوریتم های جدیدی می شود:
chunkIds: "deterministic"
moduleIds: "deterministic"
mangleExports: "deterministic"
همانطور که مقدار نشان می دهد، این الگوریتم ها شناسه های قطعی را به تکه ها و ماژول ها و نام های قطعی را به صادرات اختصاص می دهند.
Webpack 5 قادر به انجام تکان دادن درخت تو در تو، با ردیابی دسترسی به ویژگی های تو در تو صادرات است (به ماتریس خوش آمدید)، که باید لرزش درخت را بیشتر بهبود بخشد. همچنین، اکنون می تواند تجزیه و تحلیل وابستگی بین صادرات و واردات یک ماژول. بهبودهایی نیز وجود دارد تکان دادن درخت CommonJS. و یک تن وجود دارد بهینه سازی های بیشتر.
Webpack 5 همچنین شامل تعدادی تغییرات برای بهبود تجربه توسعه دهنده است. به عنوان مثال، یک وجود دارد الگوریتم chunk id جدید با نام که به طور پیش فرض در حالت توسعه فعال است. این الگوریتم جدید به تکه ها اسامی قابل خواندن برای انسان می دهد. این target
دارایی نیز بسیار بوده است بهبود یافته.
صادقانه بگویم، من اینجا فضای کافی برای پوشش دادن همه چیز جدید با Webpack 5 ندارم، آنجا's تنها راه هم بسیار. بنابراین من در اینجا توقف می کنم
اگر فقط از Webpack به طور غیرمستقیم از طریق Angular CLI استفاده می کنید، بیشتر این باید برای شما "شفاف" باشد. اما اگر از a استفاده می کنید ساخت وب پک سفارشی در پروژه خود، پس احتمالاً باید نگاهی به آن بیندازید راهنمای مهاجرت.
در نهایت، اگر کنجکاو هستید که در آینده با Webpack چه اتفاقی میافتد، آن را بررسی کنید نقشه راه برای سال 2021 و البته آخرین یادداشت های انتشار.
پشتیبانی IE11 منسوخ شده است
هر چقدر هم که غم انگیز به نظر برسد (با کی شوخی می کنم؟ 😂)، Angular 12 پشتیبانی از IE11 را منسوخ می کند. اینترنت اکسپلورر برای اکثر ما مرده است، اما متأسفانه، بسیاری از سازمان ها هنوز از آن در تولید استفاده می کنند. بنابراین پشتیبانی از IE 11 توسط Angular 13 حذف خواهد شد، به این معنی که آن سازمان ها واقعاً باید شروع به دور شدن از اینترنت اکسپلورر کنند (که به هر حال چیز خوبی است). دیگر بهانه ای نیست!
هنگامی که پشتیبانی اینترنت اکسپلورر از بین رفت، Angular کوچکتر، سریعتر و در نتیجه برای همه ما بهتر خواهد بود. همچنین، هنگامی که بار حفظ سازگاری به عقب با مرورگرهای قدیمی از بین رفت (IE11 آخرین آنهاست!)، آنگاه Angular میتواند از APIهای مدرن استفاده کند (به عنوان مثال، متغیرهای CSS, ناظر تقاطع, شبکه CSS, پروکسی, انیمیشن های وبو بیش).
من واقعا نمی توانم منتظر بمانم تا پشتیبانی اینترنت اکسپلورر از بین برود!
به طور پیش فرض سختگیرانه
بله بله بله 🤩 . از Angular 12، the حالت سخت Angular به طور پیش فرض در CLI فعال است. و این فوق العاده است.
همانطور که می دانید، من از طرفداران شدید حالت سخت تایپ اسکریپت و همچنین حالت سخت انگولار هستم. اگر می خواهید بیشتر بدانید، پس بررسی کنید مقاله ای که سال گذشته نوشتم و مینکو گچف مقاله توضیح دهنده تغییر.
ساخت تولید به صورت پیش فرض
تا به حال، در حال اجرا ng build
فرمان یک ساخت توسعه ایجاد کرد. از Angular 12، ng build
اکنون به طور پیش فرض به یک ساخت تولید می رسد.
امیدواریم به برخی از تیم ها کمک کند تا از اشتباه ساختن و استقرار ساخت های توسعه در محیط های تولید اجتناب کنند. هر چند، من می ترسم که تیم هایی که این اشتباه را انجام می دهند، همچنان مسائل دیگری برای مقابله با آنها داشته باشند
پشتیبانی Sass برای سبک های درون خطی
Angular از مدتها قبل از Sass پشتیبانی میکند، اما تاکنون، ما فقط میتوانیم از Sass در شیوهنامههای خارجی استفاده کنیم. با Angular 12، اکنون می توان از Sass همراه با سبک های مؤلفه درون خطی استفاده کرد (یعنی در styles
ویژگی).
این باید با تنظیم جدید فعال شود inlineStyleLanguage
دارایی به true
in angular.json
.
پشتیبانی از باد دم
TAILWIND اکنون به طور رسمی توسط Angular پشتیبانی می شود. در واقع، پشتیبانی در Angular CLI در نسخه 11.2 معرفی شد.
باد دم است مشغول تسلط بر دنیا، به خصوص اکنون که دارای یک کامپایلر rad JITو داشتن پشتیبانی داخلی برای آن در Angular فوق العاده است.
قبلاً، اضافه کردن Tailwind به یک پروژه Angular مورد نیاز بود سفارشی سازی ساخت Webpack. دیگر نه! اکنون، افزودن Tailwind به سادگی نصب بسته و ایجاد آن است tailwind.config.js
پرونده با استفاده از npx tailwindcss init
و مطمئن شوید که فعال کنید حالت JIT Tailwind.
بهبودهای Http
Angular 12 تعدادی بهبود در مورد پشتیبانی HTTP خود را معرفی می کند.
فراداده برای درخواست ها و رهگیرها
اول، HttpClient
اکنون می توان برای ذخیره و بازیابی ابرداده سفارشی برای درخواست ها استفاده کرد. این به ویژه برای رهگیرهای HTTP مفید است. این قابلیت از طریق جدید قابل استفاده است HttpContext
.
پیش از این، فراهم کردن زمینه برای رهگیرها پیچیده بود، اما اکنون بسیار ساده تر خواهد بود. در حال حاضر، روش های مختلف HTTP ارائه شده توسط HttpClient
شامل یک جدید context: HttpContext
گزینه ای که می توانیم از آن برای عبور در نقشه استفاده کنیم.
نتانل بازال مقاله ای در این مورد نوشته است، بنابراین اگر می خواهید بیشتر بدانید آن را بررسی کنید.
appendAll در HttpParams
La HttpParams
کلاس اکنون یک کلاس جدید دارد appendAll
روشی که می تواند برای اضافه کردن آسان مجموعه ای از پارامترها به طور همزمان استفاده شود:
appendAll(params: {[param: string]: string|string[]}): HttpParams
اکنون می توان پارامترها را به عنوان اعداد و بولی ارسال کرد
قبلاً، اعداد و بولی ها نمی توانستند مستقیماً به عنوان پارامترهای HTTP استفاده شوند. ما باید آن ها را به رشته ها تبدیل می کردیم. دیگر نه!
کد HttpStatus
Angular لیست خود را از نامهای قابل خواندن توسط انسان برای کدهای وضعیت HTTP، در قالب یک const enum معرفی کرده است.
قبلاً اگر میخواستیم اسامی قابل خواندن برای انسان داشته باشیم، باید راهحل خود را معرفی میکردیم. به لطف این ویژگی جدید، اکنون می توانیم به جای آن از آن استفاده کنیم HttpStatusCode
.
مثلا:
if (response.status === HttpStatusCode.Ok) { ...
}
برای کسانی که از TypeScript در back-end و front-end استفاده می کنند، این بسیار مفید نیست (چون احتمالاً همه ما قبلاً انتزاع خودمان را داریم)، اما اگر پروژه شما فقط از TypeScript/Angular در قسمت جلویی استفاده می کند، پس از آن استفاده می شود. یک پیشرفت خوب
XhrFactory
La XhrFactory
کلاس به بسته دیگری منتقل شده است. در حال حاضر توسط angular/common
بجای angular/common/http
.
توجه داشته باشید که یک مهاجرت در ارتقاء گنجانده شده است، بنابراین حتی اگر اجرا کنید متوجه نخواهید شد ng update
روتر تغییر می کند
روتر Angular در Angular 12 کمی تغییر کرده است.
اول، routerLinkActiveOptions
بخشنامه تقویت شده است. اکنون میتوان مشخص کرد که برای افزودن یک کلاس CSS به یک پیوند، به تطابق دقیقی برای بخشهای مختلف URL نیاز داریم یا نه.
قبلاً، ما فقط میتوانستیم به یک تطابق دقیق (یا نه) برای کل URL نیاز داشته باشیم:
<a routerLink="/products/foo" routerLinkActive="highlight-product" [routerLinkActiveOptions]="{ exact: true }"
> foo
</a>
اکنون میتوانیم در عوض قوانین تطبیق دقیقی برای مسیرها، پارامترهای پرس و جو، پارامترهای ماتریس و قطعات ارائه کنیم.
<a routerLink="/products/foo" routerLinkActive="highlight-product" [routerLinkActiveOptions]="{ paths: 'exact', queryParams: 'subset', matrixParams: 'ignored', fragment: 'ignored' }"
> foo
</a>
مقادیر پشتیبانی شده هستند exact
, ignored
و subset
، که می تواند برای استفاده شود queryParams
و matrixParams
. برای مسیرها، می توانید هر دو را عبور دهید exact
or subset
و exact
or ignored
برای fragment
.
توجه داشته باشید که isActive
روش روتر نیز این گزینه های جدید را می پذیرد.
قطعه باطل شدنی است
تا اکنون، ActivatedRouteSnapshot.fragment
باطل نشد این با Angular 12 تغییر کرده است. اما خیلی نگران نباشید. ng update
شما را تحت پوشش قرار داده است
تشکیل می دهد
کنترل بیشتر بر رویدادهای منتشر شده
La emitEvent
گزینه به روش های مختلف اضافه شده است FormGroup
و FormArray
. به لطف این تغییر، اکنون می توان کنترل کرد که آیا رویدادها باید در موارد بیشتری منتشر شوند یا خیر.
به عنوان مثال، قبلاً زمانی که یک کنترل با استفاده از removeControl
روش FormGroup
، سپس یک رویداد همیشه منتشر می شد. با این تغییر، اکنون می توانیم از چنین مشکلاتی جلوگیری کنیم.
La emitEvent
گزینه به روش های زیر اضافه شده است FormGroup
:
addControl
removeControl
setControl
و به روش های زیر از FormArray
:
push
insert
removeAt
setControl
clear
تایید کننده های حداقل و حداکثر از فرم های الگو محور پشتیبانی می کنند
La min
و max
اعتبار سنجی Angular اکنون می تواند با فرم های مبتنی بر الگو استفاده شود:
<input [(ngModel)]="foo.bar" [min]="min" [max]="42" />
توجه داشته باشید که این یک تغییر قطعی است، زیرا قبلاً نادیده گرفته می شد.
i18n
سیستم i18n انگولار با این نسخه تغییر کرده است.
همانطور که در پست وبلاگ اعلامیه اشاره شد، در حال حاضر تعدادی از قالبهای شناسه پیام قدیمی استفاده میشوند. این موارد شکننده هستند و به دلیل فضای خالی، قالبهای قالببندی و عبارات ICU ممکن است مشکلات ظاهر شوند.
Angular 12 یک قالب شناسه پیام متعارف جدید را معرفی می کند (یعنی یک قالب برای کنترل همه آنها). این قالب انعطاف پذیرتر و شهودی تر است.
این قالب باعث کاهش اعتبار غیرضروری ترجمه و هزینه ترجمه مجدد مرتبط با آن در برنامههایی میشود که مثلاً به دلیل تغییر فضای خالی، ترجمهها مطابقت ندارند.
از نسخه ۱۱، پروژههای جدید بهطور خودکار برای استفاده از شناسههای پیام جدید پیکربندی میشوند و اکنون ابزارهایی برای انتقال پروژههای موجود با ترجمههای موجود وجود دارد. اگر نگران هستید، می توانید از آن استفاده کنید localize-migrate
ابزاری برای انتقال شناسه پیام شما:
ng extract-i18n --format=legacy-migrate
npx localize-migrate --files=*.xlf --map-file=messages.json
شما می توانید اطلاعات بیشتری پیدا کنید اینجا کلیک نمایید.
بهبود عملکرد
با این نسخه، تعدادی بهبود عملکرد وجود دارد. واضح ترین مورد همراه با ارتقاء به Webpack 5 است، اما موارد بیشتری نیز وجود دارد:
تعدادی از روش های استفاده نشده حذف شده اند DomAdapter
. جالب است زیرا روشهای آن تکانپذیر نیستند و در تمام برنامههای Angular گنجانده شده است، همانطور که در توضیح داده شده است. روابط عمومی مربوطه.
Angular اکنون کد کمتری برای دسترسی ایمن به اموال تولید می کند. به عنوان مثال برای عبارات قالب مانند a?.b
و ادغام تهی تازه پشتیبانی شده: a ?? b
.
کامپایلر Angular اکنون از کامپایل افزایشی حتی در حضور فایل های منبع هدایت شده پشتیبانی می کند. قبلاً، زمانی که TypeScript فایلهای منبع را حذف میکرد، نمیتوان از کارهای کامپایل قبلی استفاده مجدد کرد. شما می توانید در مورد آن بیشتر بخوانید اینجا کلیک نمایید.
کامپایلر Angular اکنون مسیر سیستم فایل فایل های منبع را ذخیره می کند. قبلا بارها تماس گرفته بود fs.resolve()
، که زمان بر است.
La getDirectives
عملکرد بهبود یافته است. همراه با آن تغییر، ng
فضای نام نیز برای گنجاندن فضای جدید گسترش یافته است getDirectiveMetadata
ابزار
و وجود دارد مقداری بیشتر.
ng بهبودهای API
La ng
اشکال زدایی API که می توانیم از ابزارهای توسعه دهنده مرورگر استفاده کنیم با Angular 12 بهبود یافته است.
یک تابع جدید به نام وجود دارد getDirectiveMetadata
، که می تواند برای بازیابی اطلاعات مربوط به اجزا و دستورالعمل ها استفاده شود. فکر نمیکنم اغلب به آن نیاز داشته باشیم، اما به احتمال زیاد پیشرفتهای ابزار توسعهدهنده آینده به این متکی خواهد بود. می توانید بیشتر بدانید در اینجا.
یک تابع پروفایلر جدید به نام esetProfiler
نیز پیاده سازی شده است و در حالت تولید نیز موجود است. آن تابع جدید را می توان در چند سناریو فراخوانی کرد. به عنوان مثال، میتوان از آن برای ردیابی مدت زمان ایجاد الگو، بهروزرسانیهای قالب، پردازش قلابهای چرخه حیات و غیره استفاده کرد. باز هم، این API توسط ابزارهای توسعهدهنده آینده مورد استفاده قرار میگیرد و اطلاعات روشنتری در مورد نحوه عملکرد برنامههای ما در اختیار ما قرار میدهد. زمان اجرا
این هنوز در این مرحله آزمایشی است، اما من حدس میزنم که بعداً بیشتر در مورد آن خواهیم شنید. من کنجکاو هستم که ببینم آیا ابزارهایی مانند Sentry از جمع آوری این نوع اطلاعات پشتیبانی می کنند تا داشبوردهای عملکرد مفیدی را در اختیار ما قرار دهند.
چند روز پس از انتشار Angular 12، تیم Angular تا به حال اعلام کرد در دسترس بودن ابزارهای جدید Angular Dev برای Google Chrome. می توانید آن ها را دانلود کنید اینجا کلیک نمایید.
با استفاده از آن افزونه جدید مرورگر، می توانید به راحتی برنامه های Angular خود را در طول توسعه بررسی کنید. پشتیبانی می کند:
- تجسم ساختار برنامه (یعنی بازرسی درخت جزء)
- کاوش و ویرایش اجزا
- نمایه سازی اجراها
با استفاده از نمایهساز تعبیهشده، میتوانیم رویدادهای تشخیص تغییرات را ضبط کنیم و پیشنمایش آنها را در صورت وقوع مشاهده کنیم. برای هر چرخه تشخیص تغییر، میتوانیم ببینیم چقدر طول میکشد، کدام مؤلفهها بیشترین زمان را میبردند، آیا آن چرخه باعث افت فریم شده است یا خیر.
Angular قبلاً Dev Tools نیمه رسمی داشت فال پروژه (که اساس ابزارهای جدید هستند!)، اما آنها با Ivy سازگار نبودند. بنابراین این یک خبر عالی برای جامعه Angular است!
و بیشتر…
وجود دارد یک تن بیشتر تغییرات جزئی در این نسخه در اینجا یک بررسی اجمالی است.
APP_INITIALIZER اکنون از Observables پشتیبانی می کند
تا به حال، امکان استفاده از Observables با وجود نداشت APP_INITIALIZER
. از Angular 12، اکنون میتوانیم این کار را انجام دهیم، که به کد پاکتر اجازه میدهد!
اگر هنوز از این ویژگی Angular اطلاعی نداشتید، APP_INITIALIZER
is یک نشانه که میتوانیم برای تعریف توابعی که باید در طول مقداردهی اولیه برنامه اجرا شوند، استفاده کنیم. اگر آن تابع ناهمزمان باشد، a را برمی گرداند Promise
و یا Observable
(جدید :p)، سپس Angular قبل از شروع برنامه منتظر می ماند تا کامل شود.
این تغییر بسیار خوشایند است، زیرا به این معنی است که ما میتوانیم حتی کدهای بیشتری را با استفاده از RxJS بنویسیم، بهجای اینکه مجبور باشیم به «برگردیم» Promise
API
می توانید در این باره بیشتر بخوانید اینجا کلیک نمایید.
کنترل زمان اجرا بر روی انیمیشن ها
قبلاً تنها راه غیرفعال کردن انیمیشن ها ارائه آن بود NoopAnimationsModule
. از Angular 12، اکنون امکان غیرفعال کردن انیمیشن ها بر اساس اطلاعات زمان اجرا با استفاده از آن وجود دارد BrowserAnimationModule.withConfig
روش، و عبور از آن disableAnimations
خاصیت بولی
روش جدید historyGo در سرویس مکان
La LocationService
از Angular در حال حاضر شامل یک historyGo
روشی که می تواند برای پیمایش به سمت یک صفحه خاص در تاریخچه جلسه استفاده شود که با موقعیت نسبی آن نسبت به صفحه فعلی مشخص می شود. این روش با بومی مطابقت دارد window.history.go
روش. MDN را بررسی کنید برای چند نمونه
بهبود خدمات زبان
سرویس زبان، که تمام بینش های مفید در مورد کد Angular را در اختیار IDE ها قرار می دهد نیز با این نسخه بهبود یافته است.
با Angular 12، سرویس زبان به طور پیشفرض فعال میشود (قبلاً از ما میخواست شرکت کنیم).
از Angular 12، همچنین تشخیص خواهد داد که آیا بررسی دقیق نوع قالب فعال نیست و به شما توصیه می کند که آن ها را فعال کنید.
سرویس زبان اکنون شامل قابلیتهای ردیابی عملکرد نیز میشود که میتوان از آن برای ردیابی اجراها استفاده کرد. این را می توان در VSCode فعال کرد، همانطور که در اینجا توضیح داده شده است (هر چند این سطح نسبتاً پایینی است).
اگر هنوز از خدمات زبان اطلاعی ندارید، بررسی کنید اسناد رسمی، یا پست وبلاگ خوب نوشته شده توسط جوخه نینجا، یا این معرفی ویدیویی.
قوانین lint را مستقیماً از قالب های HTML غیرفعال کنید
کامپایلر قالب Angular اکنون نظرات HTML را پیگیری می کند.
قبلاً غیرفعال کردن قوانین linter از الگوهای HTML امکان پذیر نبود زیرا کامپایلر قالب Angular نظرات را نادیده می گرفت. راه حل این بود که آن قوانین را برای کل الگو از کنترل کننده مؤلفه غیرفعال کنید. به لطف این تغییر، اکنون انجام این کار با دقت بیشتری از الگو امکان پذیر خواهد بود:
<!-- eslint-disable-next-line @angular-eslint/template/no-any -->
<span>{{ $any(foo).bar }}</span>
بله برای کد پاک کننده!
DatePipe اکنون از استاندارد ICU Stand Alone در روز هفته پشتیبانی می کند
قبلاً ممکن نبود برای قالب بندی تاریخ به حالت Stand Alone روز هفته با استفاده از DatePipe.
به لطف این تغییر، قالببندی تاریخ فنلاندی اکنون پشتیبانی میشود، و من مطمئن هستم که این خبر خوبی برای بخشی از جامعه Angular است.
پشتیبانی از ForwardRef در زمینه های ارائه شده در دکوراتورهای تزریقی
اکنون امکان استفاده وجود دارد forwardRef
در داخل providedIn
زمینه از @Injectable
دکوراتور
قلاب transformResource جدید در رابط ResourceHost
A transformResource
روش به آن اضافه شده است ResourceHost
رابط. به لطف این، اکنون این امکان برای ابزارها وجود دارد که کارهایی مانند ارائه پشتیبانی از پیش پردازنده برای سبک های درون خطی را انجام دهند. این همان چیزی است که پشتیبانی جدید از SASS را با سبک های درون خطی امکان پذیر می کند.
شما می توانید در مورد آن بیشتر بدانید اینجا کلیک نمایید و اینجا کلیک نمایید.
امکان ایجاد پیاده سازی های خروجی روتر سفارشی
تا به حال، ایجاد خروجی های روتر سفارشی امکان پذیر بود، اما نیاز به پرش از طریق برخی حلقه ها (به عنوان مثال، ثبت خروجی های سفارشی با ChildrenOutletContexts
).
Angular 12 یک را فراهم می کند پشتیبانی تمیزتر برای پریزهای روتر سفارشی.
رفع اشکال
طبق معمول، رفع اشکال gazillion در این نسخه گنجانده شده است.
در اینجا یک کپی از یادداشت های انتشار آمده است:
- تصاوير متحرك: اطمینان از ترتیب فضای نام انتقال ثابت (#19854) (01cc995)
- تصاوير متحرك: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (e918250)
- تصاوير متحرك: پاکسازی عناصر DOM هنگامی که نمای ریشه حذف می شود (#41059) (c49b280)
- تصاوير متحرك: اجازه دادن به انیمیشن ها روی عناصر در سایه DOM (#40134) (dad42c8) بسته می شود #25672
- تصاوير متحرك: پاکسازی عناصر DOM هنگامی که نمای ریشه حذف می شود (#41001) (a31da48)
- بازل: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (8503246)
- بازل: به روز رسانی ابزار ساخت برای آخرین تغییرات در rules_nodejs (#40710) (696f7 bc)
- بازل: به روز رسانی تست یکپارچه سازی برای استفاده rules_nodejs@3.1.0 (#40710) (34of89a)
- بازل: ارسالهای نوع بهروزرسانی برای استفاده از JSON.parse (#40710) (2c90391)
- بنچپرس: ارسالهای نوع بهروزرسانی برای استفاده از JSON.parse (#40710) (e721a5d)
- مشترک: اضافه کردن ContentType راست برای مقادیر بولی با بدنه درخواست HttpClient(#38924) (#41885) (922a602)
- مشترک: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (f2b6fd8)
- مشترک: پیمایش پورت دید عناصر را در داخل سایه DOM نمییابد (#41644) (c0f5ba3) بسته می شود #41470
- مشترک: به طور موقت صادرات مجدد و منسوخ شدن
XhrFactory
(#41393) (7dfa446) - مشترک: هنگامی که نمای ریشه حذف می شود شنوندگان را تغییر مکان پاکسازی می کند (#40867) (38524c4) بسته می شود #31546
- مشترک: اجازه دادن به عدد یا بولی به عنوان پارامترهای http (#40663) (91cdc11) بسته می شود #23856
- مشترک: اجتناب از جهش شی متن در NgTemplateOutlet (#40360) (d3705b3) بسته می شود #24515
- کامپایلر: حفظ قوانین صفحه @ در سبک های کپسوله شده (#41915) (3e365ba) بسته می شود #26269
- کامپایلر: نوار انتخابگرهای محدوده از
@font-face
قوانین (#41815) (2a11cda) بسته می شود #41751 - کامپایلر: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (8126)
- کامپایلر: الگوهای درون خطی غیر تحت اللفظی به اشتباه در کامپایل جزئی پردازش شده اند (#41583) (ab257b3)
- کامپایلر: عدم ایجاد دستورالعمل های به روز رسانی برای ng-template در داخل فضاهای نام جایگزین (#41669) (2bcbbda) بسته می شود #41308
- کامپایلر: اجتناب از تجزیه EmptyExpr با یک فاصله به عقب (#41581) (e1a2930)
- کامپایلر: کنترل خصوصیات سفارشی CSS حساس به حروف بزرگ (#41380) (e112e32) بسته می شود #41364
- کامپایلر: شامل اجزای استفاده شده در طول تدوین JIT اعلامیه جزئی (#41353) (ff9470b) بسته می شود #41104 #41318
- کامپایلر: پشتیبانی از چند
:host-context()
انتخابگرها (#40494) (07b7af3) بسته می شود #19199 - کامپایلر: ارسالهای نوع بهروزرسانی برای استفاده از JSON.parse (#40710) (f728490)
- compiler-cli: استفاده از ” برای آدرس نقشه منبع الگوهای غیر مستقیم (#41973) (7a4d980) بسته می شود #40854
- compiler-cli: پیوند دهنده را به عنوان یک افزونه Babel در معرض نمایش قرار دهید (#41918) (8fdac8f)
- compiler-cli: ترجیح دادن صادرات غیر وابسته در انتشارات مرجع (#41866) (75bb931) بسته می شود #41443 #41277
- compiler-cli: به پیوند دهنده اجازه می دهد تا بولین های کوچک شده را پردازش کند (#41747) (1fb6724) بسته می شود #41655
- compiler-cli: اعلانهای جزئی فهرستشده رشته مطابقت (#41747) (f885750) بسته می شود #41655
- compiler-cli: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (5b463f4)
- compiler-cli: انواع تحت اللفظی تکمیل خودکار در قالب ها. (#41456) (#41645) (8b2b5ef)
- compiler-cli: اگر کامپوننت سبک درون خطی ندارد، با prepocessing خطا نکنید (#41602) (a5fe8b9)
- compiler-cli: اطمینان حاصل کنید که کامپایلر ردیابی می کند
ts.Program
درست است (#41291) (deacc74) - compiler-cli: جلوگیری از حذف واردات پیش فرض در کامپایل مجدد تدریجی (#41557) (7f16515) بسته می شود #41377
- compiler-cli: تصمیم
rootDirs
به مطلق (#41359) (3e0fda9) بسته می شود #36290 - compiler-cli: اضافه کردن
useInlining
گزینه ای برای تایپ check config (#41043) (09aefd2) بسته می شود #40963 - compiler-cli:
readConfiguration
گزینه های موجود باید گزینه های موجود در tsconfig را لغو کنند (#40694) (b7c4d07) - compiler-cli: گسترش
angularCompilerOptions
در tsconfig از گره (#40694) (5eb1954) بسته می شود #36715 - compiler-cli: به روز رسانی تست های یکپارچه سازی ngcc برای آخرین تغییرات در rules_nodejs (#40710) (d7f5755)
- compiler-cli: ارسالهای نوع بهروزرسانی برای استفاده از JSON.parse (#40710) (b75d7cb)
- هسته: اجزا و ماژول های کامپایل شده پویا را حفظ نکنید (#42003) (1449c5c) بسته می شود #19997
- هسته: فراخوانی پروفایلر در اطراف قلاب های چرخه حیات ngOnDestroy (#41969) (e9ddc57)
- هسته: AsyncPipe اکنون با RxJS 7 سازگار است (#41590) (9759bca)
- هسته: مدیریت چندین ویژگی i18n با پیوندهای عبارت (#41882) (73c6c64) بسته می شود #41869
- هسته: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (f9c1f08)
- هسته: شناسایی سازنده های سنتز شده ای که با استفاده از TS 4.2 پایین تراز شده اند (#41305) (274dc15) بسته می شود #41298
- هسته: گزینه
emitDistinctChangesOnlyDefaultValue
درست است (#41121) (7096246) - هسته: حذف ثابت EMPTY_OBJ تکراری (#41066) (BF158E7)
- هسته: حذف ثابت EMPTY_ARRAY تکراری (#40991) (e12d9de)
- هسته: اجازه می دهد زمینه EmbeddedViewRef به روز شود (#40360) (a3e1719) بسته می شود #24515
- هسته: DefaultIterableDiffer را ایجاد کنید تا ترتیب تکرارها را حفظ کنید (#23941) (a826926) بسته می شود #23815
- هسته: گزینه های ادغام NgZone باید onStable را به درستی فعال کنند (#40540) (22f9e45)
- عناصر: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (4f5d094)
- عناصر: ارسالهای نوع بهروزرسانی برای استفاده از JSON.parse (#40710) (efd4149)
- تشکیل می دهد: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (dc975ba)
- HTTP: تکمیل درخواست در مهلت زمانی (#39807) (61a0b6d) بسته می شود #26453
- HTTP: صدور خطا در رویداد لغو XMLHttpRequest (#40767) (3897265) بسته می شود #22324
- خدمات زبان: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (9b6198c)
- خدمات زبان: استفاده از نسخه های اسکریپت برای کامپایل های افزایشی (#41475) (78236 bf)
- خدمات زبان: فقط تکمیل های ویژگی Angular را در قالب ها ارائه دهید (#41278) (0226a11)
- خدمات زبان: افزودن گزینه پلاگین برای اجبار به قالب های سخت (#41062) (e9e7c33)
- خدمات زبان: استفاده از یک نقطه ورودی برای Ivy و View Engine (#40967) (e986a97)
- بومی سازی: خطای آرامش به اخطار برای هدف گم شده (#41944) (35ceed2) بسته می شود #21690
- بومی سازی: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (658ed1f)
- بومی سازی: ارسالهای نوع بهروزرسانی برای استفاده از JSON.parse (#40710) (4b469c9)
- ngcc: شناسایی سازنده های سنتز شده ای که با استفاده از TS 4.2 پایین تراز شده اند (#41305) (8d3da56) بسته می شود #41298
- پلتفرم-مرورگر: در صورت استفاده از کپسوله سازی سایه DOM از نشت حافظه گره های سبک جلوگیری کنید (#42005) (d555555) بسته می شود #36655
- پلتفرم-مرورگر: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (ea05cfd)
- پلتفرم-مرورگر: پیکربندی
XhrFactory
به استفاده ازBrowserXhr
(#41313) (e0028e5) بسته می شود #41311 - پلتفرم-مرورگر: ارسالهای نوع بهروزرسانی برای استفاده از JSON.parse (#40710) (7ecfd2d)
- پلتفرم-مرورگر-دینامیک: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (bc45029)
- پلتفرم-سرور: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (4b9d4fa)
- روتر: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (روز 0067)
- روتر: فقط زمانی مسیر ذخیره شده را بازیابی کنید که استراتژی استفاده مجدد نشان دهد که باید دوباره وصل شود (#30263) (a4ff071) بسته می شود #23162
- روتر: منطبقات مسیر خالی را به صورت بازگشتی ادغام کنید (#41584) (1179dc8) بسته می شود #41481
- روتر: قطعه می تواند تهی باشد (#37336) (b555160) بسته می شود #23894 #34197
- روتر: ارسالهای نوع بهروزرسانی برای استفاده از JSON.parse (#40710) (350 داده شده است)
- کارگر خدمات: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (6b823d7)
- کارگر خدمات: ارسالهای نوع بهروزرسانی برای استفاده از JSON.parse (#40710) (4f7ff96)
- ارتقاء: حفظ $interval.flush هنگام استفاده از ngMocks (#30229) (87dc851)
- ارتقاء: به روز رسانی محدوده پشتیبانی شده از نسخه های گره تا فقط شامل نسخه های LTS (#41822) (10c4523)
اتفاقاً متوجه این موضوع شدید؟ AsyncPipe
بوده است تکه تکه شده توسط Ben Lesh با هر دو RxJS 6 و 7 سازگار است؟ چقدر باحاله؟
شکستن تغییرات
طبق معمول، تعدادی تغییرات اساسی با این نسخه وجود دارد.
As یادداشت رسمی انتشار کاملا واضح هستند، من فقط آنها را در اینجا کپی/پیست می کنم:
- بستههای UMD Minified دیگر در بستههای NPM توزیع شده گنجانده نمیشوند.
- تصاوير متحرك: اکنون با حذف نمای ریشه، عناصر DOM به درستی حذف می شوند. اگر از SSR استفاده میکنید و از HTML برنامه برای رندر کردن استفاده میکنید، باید مطمئن شوید که HTML را در یک متغیر ذخیره کردهاید، قبل از اینکه برنامه را از بین ببرید. همچنین ممکن است تستها بهطور تصادفی بر رفتار قدیمی با تلاش برای یافتن عنصری که در آزمایش قبلی حذف نشده است، تکیه کنند. در این صورت، تستهای ناموفق باید بهروزرسانی شوند تا اطمینان حاصل شود که کد راهاندازی مناسبی دارند که عناصری را که به آنها تکیه میکنند مقداردهی اولیه میکند.
- مشترک: روش های
PlatformLocation
کلاس، یعنیonPopState
وonHashChange
، قبلاً برمی گشتvoid
. اکنون آن متدها توابعی را برمیگردانند که میتوانند برای حذف کنترلکننده رویداد فراخوانی شوند - مشترک: روش های
HttpParams
کلاس در حال حاضر قبولstring | number | boolean
بجایstring
برای مقدار یک پارامتر اگر این کلاس را در برنامه خود گسترش دادید، باید امضاهای متدهای خود را برای منعکس کردن این تغییرات به روز کنید - compiler-cli: کتابخانه های پیوندی دیگر شناسه پیام قدیمی i18n را تولید نمی کنند. هر برنامه پایین دستی که برای این پیام ها ترجمه ارائه می کند، باید شناسه پیام خود را با استفاده از
localize-migrate
ابزار خط فرمان - هسته: Angular دیگر از node v10 پشتیبانی نمیکند، بنابراین اگر همچنان از آن برای محیط توسعه خود استفاده میکنید، واقعاً زمان ارتقا فرا رسیده است!
- هسته: قبلا
ng.getDirectives
در صورتی که یک گره DOM داده شده دارای بافت زاویه ای مرتبط با آن نباشد (مثلاً اگر تابعی برای یک عنصر DOM خارج از یک برنامه Angular فراخوانی شده باشد)، یک خطا ایجاد می کند. این رفتار با سایر ابزارهای اشکال زدایی که تحت آن بودند، ناسازگار بودng
فضای نام، که این وضعیت را بدون ایجاد استثنا مدیریت کرد. در حال حاضر تماس باng.getDirectives
تابع برای چنین گره های DOM منجر به یک آرایه خالی برگردانده شده از آن هسته تابع می شود: تغییر پیش فرضemitDistinctChangesOnlyDefaultValue
که رفتار پیشفرض را تغییر میدهد و ممکن است باعث شود برخی از برنامههایی که به رفتار نادرست متکی هستند از کار بیفتند
emitDistinctChangesOnly
پرچم نیز منسوخ شده است و در نسخه اصلی بعدی حذف خواهد شد
اجرای قبلی تغییرات را ایجاد می کند QueryList.changes.subscribe
هر وقت QueryList
دوباره محاسبه شد این منجر به تعداد زیاد اعلانهای تغییر مصنوعی شد، زیرا امکان محاسبه مجدد وجود دارد QueryList
به همین لیست منجر می شود. وقتی که QueryList
محاسبه مجدد یک جزئیات پیادهسازی است، و نباید این چیزی باشد که تعیین میکند رویداد تغییر چند بار باید اجرا شود.
متأسفانه، اصلاح رفتار به طور کامل باعث شد بسیاری از برنامه های موجود با شکست مواجه شوند. به همین دلیل انگولار این تعمیر را یک تعمیر شکستگی می داند و یک پرچم در معرفی کرده است @ContentChildren
و @ViewChildren
، که رفتار را کنترل می کند.
export class QueryCompWithStrictChangeEmitParent { @ContentChildren('foo', { // This option is the new default with this change. emitDistinctChangesOnly: true, }) foos!: QueryList<any>;
}
برای سازگاری به عقب قبل از نسخه 12emitDistinctChangesOnlyDefaultValue
تنظیم شد false
. این تغییر
پیش فرض را به true
.
- هسته: نوع از
APP_INITIALIZER
توکن تغییر کرده است تا با دقت بیشتری انواع مقادیر بازگشتی را که توسط Angular مدیریت می شود، منعکس کند. قبلاً، هر تماس اولیه ساز برای بازگشت تایپ می شدany
، این الان استPromise<unknown> | Observable<unknown> | void
. در صورت بعید که برنامه شما ازInjector.get
orTestBed.inject
API برای تزریقAPP_INITIALIZER
رمز، ممکن است لازم باشد کد را بهروزرسانی کنید تا نوع سختگیرانهتر را در نظر بگیرید.
علاوه بر این، TypeScript ممکن است خطای TS2742 را گزارش کند در صورتی که APP_INITIALIZER
توکن در عبارتی استفاده می شود که نوع استنباط شده آن باید در فایل .d.ts منتشر شود. برای حل این مشکل، یک حاشیه نویسی نوع صریح مورد نیاز است که معمولاً چنین است Provider
or Provider[]
.
-
هسته: حداقل پشتیبانی می شود
zone.js
نسخه است0.11.4
. بنابراین به این معنی است که اگر از نسخه قدیمیتری استفاده میکنید، زمان آن است که zone.js را در پروژه خود ارتقا دهید! -
تشکیل می دهد: La
emitEvent
گزینه به موارد زیر اضافه شدFormArray
وFormGroup
مواد و روش ها: -
FormGroup.addControl
-
FormGroup.removeControl
-
FormGroup.setControl
-
FormArray.push
-
FormArray.insert
-
FormArray.removeAt
-
FormArray.setControl
-
FormArray.clear
اگر برنامه شما دارای کلاس های سفارشی است که گسترش می یابد FormArray
or FormGroup
کلاس ها و نادیده گرفتن
روشهای ذکر شده در بالا، ممکن است لازم باشد پیادهسازی خود را برای استفاده از گزینههای جدید بهروزرسانی کنید
حساب کنید و مطمئن شوید که لغوها از منظر انواع سازگار هستند.
- تشکیل می دهد: سابقا
min
وmax
ویژگی های تعریف شده بر روی<input type="number">
توسط ماژول Forms نادیده گرفته شد. در حال حاضر وجود این ویژگی ها خواهد بود
منطق اعتبارسنجی حداقل/حداکثر (در صورتformControl
,formControlName
orngModel
دستورالعمل ها نیز در یک ورودی داده شده وجود دارد) و
وضعیت کنترل فرم مربوطه منعکس کننده آن است. - پلتفرم-مرورگر:
XhrFactory
منتقل شده است@angular/common/http
به@angular/common
.
قبل از
import { XhrFactory } from '@angular/common/http';
پس از
import { XhrFactory } from '@angular/common';
- روتر: بررسیهای تهی دقیق، احتمال باطل بودن قطعه را گزارش میکنند.
مسیر مهاجرت: چک تهی را اضافه کنید. - روتر: نوع از
RouterLinkActive.routerLinkActiveOptions
ورودی بود
گسترش یافته تا امکان کنترل دقیق تر را فراهم کند. کدی که قبلا خوانده شده است
این ویژگی ممکن است برای در نظر گرفتن نوع جدید نیاز به به روز رسانی داشته باشد.
نقشه راه به روز شده
با توجه به Angular فعلی نقشه راه، تیم اکنون مشغول پیشرفت های زیر است:
- بهبود تجربه توسعه دهندگان در حین اشکال زدایی و پروفایل. این باید به ما کمک کند تا ساختار مؤلفه را درک کنیم (من تصور می کنم مانند React Dev Tools برای React اجازه می دهد) و تشخیص تغییر
- بهبود زمان تست و اشکال زدایی با حذف خودکار: این امر باید جداسازی بین تست ها و زمان های تست را بهبود بخشد. را تخت تست همچنین تغییر خواهد کرد تا پس از اجرای هر آزمایش، محیط تست به طور خودکار پاکسازی و از بین برود
- استفاده از ES2017+ به عنوان خروجی پیشفرض: آنها موانع را شناسایی کرده و آنها را حذف میکنند تا زبان خروجی پیشفرض ارتقا یابد.
- ادغام MDC Web در Angular Material
- بهبود دسترسی به اجزای Angular Material
- انتشار راهنماهایی در مورد مفاهیم پیشرفته مانند تشخیص تغییر، پروفایل عملکرد، تعامل با Zone.js و غیره
- به روز رسانی استراتژی تست e2e (cfr بالا)
- در حال آماده سازی ارتقاء به RxJS v7+. همانطور که می دانید، RxJS 7 بوده است به تازگی منتشر شده است. امیدوارم به زودی بتوانیم آن را ارتقا دهیم
در آینده، تیم Angular قصد دارد:
- به معماری micro frontend نگاهی بیندازید: آنها ممکن است ابزاری را برای ما معرفی کنند تا به راحتی با استفاده از Angular، micro frontend ایجاد کنیم
- تجربه توسعهدهنده را با تایپ دقیق برای فرمهای Angular بهبود بخشید (ما به شدت به این نیاز داریم)
- Zone.js را اختیاری کنید، که باید چارچوب را سادهسازی کند، اشکالزدایی را بهبود بخشد، اندازه بستهها را کاهش دهد و حتی امکان استفاده از نحو بومی async/wait را فراهم کند.
- بهبود عملکرد ساخت با ادغام کامپایلر Angular (
ngc
) به عنوان یک افزونه کامپایلر TypeScript - اجازه اضافه کردن دستورات به عناصر میزبان. خیلی وقته که جامعه هم این درخواست رو داره!
- NgModules را اختیاری کنید تا منحنی یادگیری آسان شود
- ابزار سادهتری برای پیادهسازی تقسیم کد در سطح مؤلفه در اختیار ما قرار دهید
متریال زاویه ای و CDK زاویه ای
مهاجرت ساس
از لحاظ داخلی، هر دو Angular Material و CDK به آن مهاجرت کردهاند سیستم جدید ماژول Sass.
اگر برنامه شما از یکی از این موارد استفاده می کند، باید مطمئن شوید که جایگزین کرده اید node-sass
by sass
: https://www.npmjs.com/package/sass. این node-sass
بسته دیگر نگهداری نمی شود!
با این انتقال، API موضوعی Sass بهبود یافته است و اکنون به ما امکان می دهد از مزایای Sass استفاده کنیم. @use
ابزار
اکنون یک نقطه ورودی واحد برای آن وجود دارد @angular/material
و @angular/cdk
.
در نهایت، API ها نیز برای وضوح تغییر کرده اند. بسیاری از توابع، میکسین ها و متغیرها در طول مسیر تغییر نام داده اند.
می توانید اطلاعات بیشتر در مورد این تغییرات را در راهنمای قالب جدید بیابید: https://github.com/angular/components/blob/master/guides/theming.md. علاوه بر این، توجه داشته باشید که راهنماهای https://material.angular.io برای نمایش API جدید بازنویسی شده اند و شامل توضیحاتی نیز هستند.
فرآیند ارتقا به طور خودکار کد را به API جدید Sass منتقل می کند. می توانید نمونه های قبل و بعد را پیدا کنید اینجا کلیک نمایید.
تغییرات CDK زاویه ای
نسخه 12 شامل تعدادی از تغییرات به Angular CDK.
در اینجا، من فقط ویژگیهای جدید را فهرست میکنم، اما اگر جزئیاتی در مورد رفع اشکالها و بهبود عملکرد میخواهید، میتوانید یادداشتهای انتشار را بررسی کنید:
- بکشید: رویداد حذف شده اکنون شامل یک است
dropPoint
ویژگی، تعیین نقطه دقیقی که ماوس در آن اشاره کرده است، زمانی که آیتم رها شده است. اطلاعات بیشتر اینجا کلیک نمایید - بکشید: ظرف پیش نمایش اکنون می توان سفارشی کرد
- جدول: بخشنامه جدید اجازه می دهد تا تکرارکننده مشاهده بازیافت را فعال کنید، که ردیف های دور ریخته شده را در حافظه پنهان ذخیره می کند و هنگامی که مجموعه داده تغییر می کند از آنها مجددا استفاده می کند. این می تواند به بهبود عملکرد کمک کند (کاهش تاخیر)
- جدول: اضافه افست عناصر چسبنده به
StickyUpdate
رابط - چیزی که برای پله بکار می رود: زمانی که کاربر سعی می کند از یک مرحله دور شود، یک
interacted
رویداد در حال حاضر خواهد بود ساطع شده - چیزی که برای پله بکار می رود: جهت گیری اکنون می تواند باشد تغییر
- دسترسی:
FocusOptions
هدف اکنون می توان گذشت به روش های مختلف تله تمرکز - تست: محیط جدید مهار WebDriver. من هنوز به این یکی نپرداخته ام بنابراین نمی توانم بیشتر به شما بگویم. وارسی روابط عمومی
تغییرات مواد زاویه ای
تعدادی نیز وجود دارد تغییرات برای Angular Material. دوباره، یادداشت های انتشار را برای لیست کامل رفع اشکال بررسی کنید.
ویژگی های جدید:
- جمع کننده خرما: دیگر بستگی ندارد در گفتگو
- چیزی که برای پله بکار می رود: اکنون جهت گیری را می توان به صورت پویا تغییر داد (تغییر مشابه را در CDK مشاهده کنید)
- چیزی که برای پله بکار می رود: اجازه دهید محتوا باشد با تنبلی ارائه شده است
- فهرست: اجازه به روز رسانی موقعیت منو را می دهد به صورت برنامه ای
- خطای تشک: اکنون استفاده می کند
aria-live="polite"
بجایrole="alert"
. جزئیات بیشتر اینجا کلیک نمایید - زبانهها: اضافه کردن روش به به صورت برنامهای فوکوس را روی یک برگه خاص تنظیم کنید
- فهرست: اکنون آرایه ای را با گزینه های تغییر یافته از قسمت برمی گرداند
selectAll
وdeselectAll
مواد و روش ها. وارسی روابط عمومی برای جزئیات بیشتر - ضامن اسلاید: اجازه دهید به صورت جهانی یک رنگ پیش فرض را پیکربندی کنید از طریق یک ارائه دهنده
- راهنمای ابزار: اکنون موقعیت موثر tooltip را از طریق یک کلاس روی کامپوننت نشان می دهد
- رادیو, جعبه و لغزنده: رنگ پسزمینه آن مولفهها را وارد کنید چاپ شیوه نامه
همچنین تعدادی تغییر در نسخه آزمایشی وجود دارد: https://github.com/angular/components/blob/master/CHANGELOG.md#material-experimental.
یونیورسال زاویه ای
Angular Universal 12 نیز هست تازه از فر.
با این نسخه، یونیورسال در حال حاضر به صورت پیش فرض CSS حیاتی درون خطی، که خیلی باحاله
یونیورسال در حال حاضر شامل یک جدید است proxyConfig
گزینه ای برای ارائه تنظیمات پروکسی سفارشی به ssr-dev-server
سازنده.
در این نسخه، یک موتور SSR جدید (تجربی) به نام وجود دارد شبدر (من را به یاد یک ابزار با کیفیت در اکوسیستم جاوا می اندازد). این موتور جدید امیدوار کننده به نظر می رسد. هدف آن ساده کردن همه چیز است، ما را از شر آن خلاص می کند Window is undefined
خطا، رفع نیاز به ساخت های متعدد برای SSR/prerender، تولید پوسته های برنامه بدون ساخت اضافی و موارد دیگر. احتمالاً بعداً در مورد آن بیشتر خواهیم شنید. اگر کنجکاو هستید، بررسی کنید روابط عمومی.
این نسخه شامل a سازنده که می تواند برای تولید صفحات استاتیک (یعنی پیش رندر) با استفاده از رویکرد جدید Universal Clover استفاده شود.
در نهایت این نسخه نیز شامل پشتیبانی TLS برای سرور توسعه دهنده
نقشه های گوگل
همانطور که می دانید Angular شامل کامپوننت هایی برای نقشه های گوگل و یوتیوب است. نسخه 12 چند پیشرفت را برای مؤلفه Google Maps به ارمغان می آورد:
- اکنون شامل یک
icon
ورودی برای سفارشی کردن آسان نشانگر - اکنون یک را منتشر می کند
clusterClick
رویداد زمانی که یک خوشه کلیک شده است - شامل یک لفاف در اطراف Google Maps Geocoder API و صادرات
MapDirectionsResponse
، که قبلاً افشا نشده بود - پشتیبانی را برای ارائه نقشه های حرارتی
- اضافه
MapDirectionsRenderer
، امکان نمایش مسیرها روی نقشه را فراهم می کند وMapDirectionsService
، که می پیچدgoogle.maps.DirectionsService
برای محاسبه مسیرهای بین دو نقطه. - جدید
options
ورودی بر روی خوشه نشانگر، مشابه سایر بخشنامه ها.
به روز رسانی
طبق معمول، راهنمای ارتقاء کامل در دسترس است، و ng update
به شما کمک خواهد کرد: https://update.angular.io/?l=3&v=11.0-12.0
اگر از شما استفاده می کنید Nrwl NX (شما واقعاً باید)، توجه داشته باشید که Nx 12.3 قبلاً از Angular 12 پشتیبانی می کند! در مورد آن بیشتر بدانید اینجا کلیک نمایید. به عنوان یک مزیت اضافی، Nx همچنین به شما کمک می کند تا از TSLint به ESLint مهاجرت کنید (و وقتش رسیده است!)
نتیجه
در این مقاله، من ویژگی های جدید Angular 12 را بررسی کرده ام.
طبق معمول، این انتشار است قهرمانانه (دیگه چی میتونه باشه؟! 😎).
آیوی رو به جلو حرکت می کند، و امیدواریم که "به زودی" کمتر از این موضوع آزار خواهیم داد ngcc
، با مهاجرت اکوسیستم. تعدادی از تغییرات فوق العاده با این نسخه وجود دارد، بنابراین آن را بررسی کنید و همین الان ارتقا دهید.
برای امروز همین است!
PS: اگر می خواهید چیزهای جالب دیگری در مورد محصول / نرم افزار / توسعه وب بیاموزید، پس مفاهیم توسعه دهنده سری، (https://mailchi.mp/fb661753d54a/developassion-newsletter) [اشتراک در خبرنامه من]، و بیا تو توییتر سلام کن!
- محتوای مبتنی بر SEO و توزیع روابط عمومی. امروز تقویت شوید.
- پلاتوبلاک چین. Web3 Metaverse Intelligence. دانش تقویت شده دسترسی به اینجا.
- منبع: https://www.codementor.io/dsebastien/angular-12-in-depth-1j62geeq5n
- 1
- 11
- 2018
- 2020
- 2022
- 7
- 9
- a
- قادر
- درباره ما
- در مورد IT
- بالاتر
- مطلق
- پذیرفتن
- قبول می کند
- دسترسی
- دسترسی
- حساب
- به درستی
- واقعا
- اضافه
- اضافه
- پیشرفته
- مزیت - فایده - سود - منفعت
- پس از
- اهداف
- هوشیار
- الگوریتم
- الگوریتم
- معرفی
- اجازه دادن
- اجازه می دهد تا
- تنها
- قبلا
- جایگزین
- جایگزین
- هر چند
- همیشه
- در میان
- و
- گوشه دار
- تصاوير متحرك
- اعلام کرد
- خبر
- دیگر
- هر جا
- API
- رابط های برنامه کاربردی
- نرم افزار
- ظاهر شدن
- کاربرد
- برنامه های کاربردی
- روش
- آوریل
- معماری
- دور و بر
- صف
- مقاله
- مقالات
- مرتبط است
- خواص
- نویسندگان
- اتوماتیک
- بطور خودکار
- دسترس پذیری
- در دسترس
- هرج و مرج
- به عقب
- بازگشت پایان
- زمینه
- بار
- مستقر
- اساس
- زیرا
- قبل از
- بودن
- سود
- بهتر
- میان
- بزرگ
- بزرگترین
- بیت
- بلاگ
- نام تجاری
- نام تجاری جدید
- شکستن
- به ارمغان می آورد
- آورده
- مرورگر
- مرورگرهای
- اشکال
- ساختن
- سازنده
- بنا
- می سازد
- ساخته شده در
- بسته
- بار
- نام
- فراخوانی
- قابلیت های
- مورد
- موارد
- علت
- ایجاد می شود
- تغییر دادن
- تبادل
- بررسی
- چک
- کروم
- وضوح
- کلاس
- کلاس ها
- واضح
- به وضوح
- بستن
- خوشه
- رمز
- جمع آوری
- رنگ
- آینده
- نظرات
- انجمن
- سازگاری
- سازگار
- کامل
- بغرنج
- جزء
- اجزاء
- مفاهیم
- علاقمند
- نتیجه
- متصل
- در نظر می گیرد
- استوار
- ثابت
- مصرف
- ظرف
- محتوا
- زمینه
- ادامه دادن
- کنترل
- کنترل کننده
- گروه شاهد
- سرد
- هسته
- مطابقت دارد
- هزینه
- میتوانست
- دوره
- پوشش
- پوشش داده شده
- ایجاد
- ایجاد شده
- ایجاد
- ایجاد
- بحرانی
- مرورگر متقاطع
- بسیار سخت
- CSS
- کنجکاو
- جاری
- در حال حاضر
- سفارشی
- خواص سفارشی
- سفارشی
- تاریخ
- روز
- روز
- مرده
- مقدار
- عمیق تر
- به طور پیش فرض
- بستگی دارد
- استقرار
- عمق
- جزئیات
- جزئیات
- کشف
- تعیین می کند
- تعیین
- برنامه نویس
- توسعه دهنده
- پروژه
- DID
- مختلف
- DIG
- دستورات
- مستقیما
- توزیع شده
- توزیع
- عمل
- DOM
- پایین
- دانلود
- نزولی
- کاهش یافته است
- قطره
- نسخه های تکراری
- در طی
- هر
- آسان تر
- به آسانی
- اکوسیستم
- موثر
- تلاش
- هر دو
- عناصر
- جاسازی شده
- قادر ساختن
- را قادر می سازد
- بسته بندی شده
- پشت سر هم
- انرژی
- موتور
- افزایش
- کافی
- اطمینان حاصل شود
- ورود
- محیط
- محیط
- خطا
- خطاهای
- به خصوص
- و غیره
- اتر (ETH)
- ارزیابی
- حتی
- واقعه
- حوادث
- هر کس
- همه چیز
- تکامل
- در حال تحول
- مثال
- مثال ها
- عالی
- استثنا
- اجرا کردن
- اعدام
- موجود
- منبسط
- انتظار می رود
- تجربه
- توضیح دهید
- توضیح داده شده
- توضیح دادن
- توضیح می دهد
- توضیح
- کشف
- جستجوگر
- صادرات
- قرار گرفتن در معرض
- اصطلاحات
- گسترش
- گسترش
- خارجی
- اضافی
- تسهیل کردن
- FAIL
- منصفانه
- سقوط
- پنکه
- FAST
- سریعتر
- ترس
- ویژگی
- امکانات
- فدراسیون
- باز خورد
- کمی از
- رشته
- زمینه
- پرونده
- فایل ها
- سرانجام
- پیدا کردن
- پیدا کردن
- آتش
- رفع
- جریان
- تمرکز
- تمرکز
- پیروی
- استحکام
- فرم
- قالب
- اشکال
- به جلو
- یافت
- مبانی
- کسر
- FRAME
- چارچوب
- از جانب
- ظاهر
- کامل
- تابع
- توابع
- بیشتر
- آینده
- تولید می کنند
- تولید می کند
- مولد
- دریافت کنید
- GitHub
- دادن
- داده
- می دهد
- دادن
- Go
- رفتن
- خوب
- گوگل
- گوگل کروم
- نقشه های گوگل
- گراف
- بزرگ
- راهنمایی
- راهنما
- دسته
- سخت
- داشتن
- شنیده
- کمک
- اینجا کلیک نمایید
- hi
- زیاد
- نماد
- تاریخ
- قلاب
- خوشبختانه
- میزبان
- چگونه
- HTML
- HTTPS
- بزرگ
- قابل خواندن انسان است
- من می خواهم
- اندیشه
- شناسایی
- شناسایی
- تأثیر
- انجام
- پیاده سازی
- اجرا
- واردات
- مهم
- واردات
- بهبود
- بهبود یافته
- بهبود
- ارتقاء
- in
- شامل
- مشمول
- شامل
- نادرست
- نشان می دهد
- به طور غیر مستقیم
- اطلاعات
- اطلاعات
- در ابتدا
- ابتکاری
- ورودی
- بینش
- نصب
- نصب کردن
- نمونه
- در عوض
- دستورالعمل
- ادغام
- ادغام
- ادغام
- فعل و انفعالات
- جالب
- رابط
- داخلی
- اینترنت
- معرفی
- معرفی
- معرفی می کند
- معرفی
- حسی
- سرمایه گذاری
- انزوا
- مسائل
- IT
- جاوه
- JIT
- کار
- پیوستن
- json
- نگاه داشتن
- نوع
- دانستن
- زبان
- بزرگتر
- نام
- تاخیر
- آخرین
- اتحادیه
- نشت
- یاد گرفتن
- یادگیری
- میراث
- سطح
- قدرت نفوذ
- کتابخانه ها
- کتابخانه
- لاین
- ارتباط دادن
- مرتبط
- فهرست
- محل
- طولانی
- مدت زمان طولانی
- دراز مدت
- دیگر
- نگاه کنيد
- نگاه
- به دنبال
- خیلی
- کم
- ساخته
- حفظ
- حفظ
- عمده
- اکثریت
- ساخت
- باعث می شود
- ساخت
- بسیاری
- نقشه
- نقشه ها
- مسابقه
- مطابق
- ماده
- ماتریس
- حداکثر
- به معنی
- حافظه
- فهرست
- ادغام کردن
- پیام
- پیام
- متاداده
- روش
- روش
- مایکروسافت
- قدرت
- مهاجرت
- مهاجرت
- حد اقل
- خردسال
- گم
- اشتباه
- حالت
- مدرن
- واحد
- ماژول ها
- بیش
- اکثر
- حرکت
- متحرک
- موزیلا
- چندگانه
- تحت عنوان
- از جمله
- نام
- بومی
- هدایت
- لازم
- نیاز
- نیازهای
- منفی
- خالص
- جدید
- ویژگی های جدید
- اخبار
- عضویت در خبرنامه
- بعد
- Next.js
- گره
- Node.js و
- گره
- یادداشت
- قابل توجه
- اطلاعیه ها
- عدد
- تعداد
- هدف
- واضح
- رخ داده است
- اکتبر
- رسمی
- رسما
- قدیمی
- ONE
- اپراتور
- گزینه
- گزینه
- سفارش
- سازمان های
- در اصل
- دیگر
- رسانه
- خارج از
- مروری
- خود
- بسته
- بسته
- پارامتر
- پارامترهای
- ویژه
- بخش
- گذشت
- عبور
- مسیر
- انجام دادن
- کارایی
- اجرای
- انجام
- چشم انداز
- قطعه
- خط لوله
- محل
- برنامه
- افلاطون
- هوش داده افلاطون
- PlatoData
- پلاگین
- نقطه
- محبوبیت
- موقعیت
- ممکن
- پست
- بالقوه
- قوی
- دقیقا
- ترجیح می دهند
- حضور
- در حال حاضر
- زیبا
- جلوگیری از
- پیش نمایش
- قبلی
- قبلا
- قبلا
- شاید
- مشکلات
- روند
- در حال پردازش
- تولید
- پروفایل
- برنامه
- پروژه
- پروژه ها
- امید بخش
- مناسب
- املاک
- ویژگی
- ارائه
- ارائه
- فراهم می کند
- پروکسی
- منتشر شده
- فشار
- پازل
- کیفیت
- سریع
- بالا بردن
- محدوده
- خام
- RE
- واکنش نشان می دهند
- خواندن
- تحقق
- دلیل
- دلایل
- توصیه
- رکورد
- كاهش دادن
- بازتاب
- ثبت نام
- مربوط
- آزاد
- منتشر شد
- دور
- برداشتن
- حذف شده
- تفسیر
- به طور مکرر
- جایگزین
- گزارش
- درخواست
- درخواست
- نیاز
- ضروری
- انعطاف پذیر
- پاسخ
- REST
- نتیجه
- نتایج
- برگشت
- عودت
- بازده
- خلاص شدن از شر
- جاده ها
- نقش
- ریشه
- مسیر
- روتر
- قانون
- قوانین
- دویدن
- در حال اجرا
- امن
- همان
- ساس
- ذخیره
- سناریوها
- حوزه
- دوم
- به نظر می رسد
- حس
- سلسله
- سرویس
- جلسه
- تنظیم
- محیط
- برپایی
- سایه
- کوتاه
- باید
- نمایشگاه
- امضا
- مشابه
- ساده
- ساده کردن
- پس از
- تنها
- وضعیت
- اندازه
- اندازه
- به آرامی
- کوچک
- کوچکتر
- So
- تا حالا
- راه حل
- مزایا
- برخی از
- چیزی
- صدا
- منبع
- فضا
- خاص
- پایدار
- ایستادن
- استاندارد
- استانداردهای
- شروع
- راه افتادن
- وضعیت
- ماندن
- گام
- هنوز
- توقف
- opbevare
- ذخیره شده
- داستان
- استراتژی
- سخت
- محکم تر
- ساختار
- سبک
- مشترک
- چنین
- فوق العاده
- پشتیبانی
- پشتیبانی
- پشتیبانی از
- شگفتی
- گزینه
- سیستم
- TAILWIND
- دم بادcss
- گرفتن
- طول می کشد
- مصرف
- هدف
- تیم
- تیم ها
- قالب
- قالب
- آزمون
- تست
- تست
- La
- منبع
- شان
- چیز
- اشیاء
- در این سال
- از طریق
- زمان
- زمان بر
- جدول زمانی
- بار
- به
- با هم
- رمز
- تن
- لحن
- هم
- ابزار
- ابزار
- سطح عالی
- طرف
- رد
- ردیابی
- مسیر
- پیگردی
- دگرگون کردن
- انتقال
- ترجمه
- شفاف
- ماشه
- درست
- انواع
- حروفچینی
- به طور معمول
- زیر
- فهمیدن
- جهانی
- استفاده نشده
- نزدیک
- بروزرسانی
- به روز شده
- به روز رسانی
- به روز رسانی
- ارتقاء
- URL
- us
- استفاده
- استفاده کنید
- کاربر
- کاربران
- آب و برق
- سودمندی
- اعتبار سنجی
- اعتبار سنجی
- ارزشمند
- ارزش
- ارزشها
- مختلف
- Ve
- نسخه
- چشم انداز
- W3
- صبر کنيد
- خواسته
- هشدار
- وب
- صفحه وب
- هفته
- هفته
- خوش آمد
- چی
- چه
- که
- در حین
- WHO
- اراده
- در داخل
- بدون
- برنده شد
- شگفت انگیز
- مهاجرت کاری
- مشغول به کار
- کارگر
- خواهد بود
- نوشتن
- نوشته
- کتبی
- X
- سال
- شما
- یوتیوب
- زفیرنت