Interop 2022: به روز رسانی پایان سال

فقط برخی از ویژگی هایی را که در طول سال 2022 قابل استفاده هستند، کشف کنید.

Rachel Andrew

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

نمرات کلی در پایان سال نشان دهنده یک پیشرفت بزرگ در همه موتورها است.

در این پست با پیشرفت های انجام شده در سال 2022 آشنا شوید. علاوه بر این ویژگی های سرفصل، پیشرفت های کوچک تری نیز توسط همه موتورها انجام شده است. مشکلات کوچکی که می تواند باعث ناهماهنگی بین موتورها شود و شما را در حین توسعه از بین ببرد، رفع شده است. دیدن ویژگی‌های بزرگ موجود در مرورگر متقابل قطعاً هیجان‌انگیز است، اما گاهی اوقات این موارد کوچک هستند که بیشترین مشکلات را ایجاد می‌کنند و دیدن اینکه چقدر بهبود یافته است بسیار عالی است.

لایه های آبشاری

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

عنصر گفتگو

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

زیرشبکه

در آغاز سال 2022، تنها مرورگری که از مقدار subgrid برای grid-template-rows و grid-template-columns شبکه‌ای پشتیبانی می‌کرد، فایرفاکس بود. سافاری در سال 2022 پشتیبانی را دریافت کرد و این ویژگی در کروم در حال توسعه است. این مهلت پایان سال برای قابلیت همکاری را از دست خواهد داد، اما در راه است.

واحدهای نما

واحدهای Viewport تنها قابلیتی هستند که 100% از تست های موفقیت آمیز را در تمام موتورها به دست آورده اند. این شامل مفاهیم نمای درگاه کوچک و بزرگ است که با ظاهر شدن و ناپدید شدن عناصر رابط کاربری دستگاه، تغییر اندازه درگاه دید در تلفن همراه را به حساب می آورد. می‌توانید در پست واحدهای نمای بزرگ، کوچک و پویا درباره این واحدها اطلاعات بیشتری کسب کنید.

رنگ 4

این مجموعه کار رنگی CSS را قادر می‌سازد تا نه تنها رنگ‌ها را در محدوده‌های با کیفیت بالاتر (مثلاً نمایش p3، rec2020) مشخص کند، بلکه توابع رنگ جدیدی را نیز ارائه می‌کند که هر کدام ابزارهای منحصربه‌فردی برای کار با رنگ دارند. فضاهای رنگی جدید عبارتند از lch() , oklch() , lab() , oklab() , display-p3 , rec2020 , a98-rgb , prophoto-rgb , xyz , xyz-d50 , xzy-d65 : اینها را امروز در قناری امتحان کنید این پرچم فعال شد این تغییرات برای گرادیان ها نیز اعمال می شود و به نویسندگان اجازه می دهد تا مشخص کنند که گرادینت هایشان از کدام فضای رنگی استفاده می کند . همین پرچم همچنین پشتیبانی از color-mix() را فعال می‌کند و به شما امکان می‌دهد دو رنگ را با هم در فضای مورد نظر خود ترکیب کنید. تابع color-mix() نیز پشت پرچمی در سافاری و فایرفاکس قرار دارد. رنگ های بیشتر، رنگ های بهتر، شیب های بهتر و ابزار بهتر.

اینتروپ 2023

امیدوارم خوشحال باشید که بدانید ما قصد توقف در پایان سال 2022 را نداریم و Interop 2023 در حال حاضر مراحل اولیه برنامه ریزی را پشت سر گذاشته است. در سال جدید می‌توانیم ویژگی‌های انتخاب شده را اعلام کنیم و منتظر یک سال دیگر هستیم تا توسعه آن برای وب آسان‌تر شود.

تصویر قهرمان از یان اشنایدر .