مایکروسافت تب لایه های ترکیبی را در ابزار نمای سه بعدی اضافه می کند

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

ویژگی لایه های مرکب به این منظور است که صفحه وب را به تعداد مناسبی از لایه ها تقسیم می کند. مایکروسافت لبه مدیر محصول ارشد پاتریک بروست می گوید زمانی مفید خواهد بود که اجزا متحرک شوند یا مستقل از بقیه تغییر کنند. می‌توان یادآوری کرد که Microsoft Edge DevTools قبلاً یک ابزار لایه‌های جداگانه داشت که عملکرد مشابهی را ارائه می‌کرد. با این حال، این شرکت تصمیم گرفت تا پنل آن را حذف کند و در نتیجه با ابزار 3D View ادغام شد.

در یک پست وبلاگی که ورود این ویژگی جدید را اعلام می کند، Brosset همچنین با بحث در مورد فعالیت موتورهای رندر مرورگر در سطح بالا، به جزئیات اهمیت لایه ها و چگونگی آنها اساساً در وب می پردازد. به گفته وی، یک موتور مرورگر یک سری مراحل را دنبال می کند تا از HTML و CSS به پیکسل روی صفحه نمایش داده شود. این رویه ها شامل تجزیه کد HTML و ایجاد درخت DOM، تجزیه کد CSS و کسب اطلاعات سبک و چیدمان، تولید یک ساختار درختی جدید و نقاشی صفحه روی صفحه است.

Brosset خاطرنشان می کند: «در این مرحله آخر، موتور ممکن است تصمیم بگیرد که صفحه را یکجا نقاشی کند، یا آن را به چندین لایه تقسیم کند، آنها را به صورت جداگانه رنگ کند، و سپس تصویر نهایی را از آنها بسازد. ویژگی‌های خاص CSS و عناصر HTML وجود دارد که باعث می‌شود موتور تصمیم بگیرد یک لایه جداگانه ایجاد کند. به عنوان مثال، استفاده از ویژگی تبدیل سه بعدی یا ویژگی will-change باعث می شود موتور لایه ها را ایجاد کند. به این ترتیب، هنگامی که محتوای این لایه‌ها تغییر می‌کند، موتور فقط باید این لایه‌های جداگانه را دوباره رنگ کند و نه کل نمای را.»

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

او می‌افزاید: «به‌عنوان یک توسعه‌دهنده وب، می‌تواند بسیار مفید باشد که بدانید بخشی از صفحه‌ای که می‌خواهید متحرک کنید، واقعاً در لایه خودش است یا خیر». اگر اینطور است، می توانید مطمئن باشید که در حین پخش انیمیشن، بقیه صفحه نیز نیازی به رنگ آمیزی مجدد ندارند. اما به همان اندازه مهم است که بررسی کنید که به طور تصادفی لایه های زیادی ایجاد نکنید، زیرا هر یک به حافظه نیاز دارد.