به روز رسانی معماری DevTools: مهاجرت به اجزای وب

جک فرانکلین

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

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

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

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

امروز، ما این سند را در goo.gle/building-ui-devtools در دسترس عموم قرار می دهیم. اگر تا به حال درباره نحوه استفاده از مؤلفه های وب در برنامه های کاربردی بزرگ و واقعی یا برخی از چالش هایی که با ادغام مؤلفه ها در یک پایگاه کد بزرگ و از قبل موجود است، بیشتر فکر کرده اید، این سند می تواند کمک کند و پاسخ هایی را ارائه دهد. اگر در مورد دستورالعمل های ما سؤالی دارید، در صورت تمایل به من توییت کنید .

کانال های پیش نمایش را دانلود کنید

استفاده از Chrome Canary ، Dev یا Beta را به عنوان مرورگر توسعه پیش‌فرض خود در نظر بگیرید. این کانال‌های پیش‌نمایش به شما امکان می‌دهند به جدیدترین ویژگی‌های DevTools دسترسی داشته باشید، APIهای پلت‌فرم وب پیشرفته را آزمایش کنید و قبل از اینکه کاربرانتان این کار را انجام دهند، مشکلات موجود در سایت خود را پیدا کنید!

تماس با تیم Chrome DevTools

از گزینه های زیر برای بحث در مورد ویژگی ها و تغییرات جدید در پست یا هر چیز دیگری مربوط به DevTools استفاده کنید.

  • پیشنهاد یا بازخورد خود را از طریق crbug.com برای ما ارسال کنید.
  • با استفاده از گزینه های بیشتر ، مشکل DevTools را گزارش کنیدبیشتر > راهنما > گزارش مشکلات DevTools در DevTools.
  • توییت در @ChromeDevTools .
  • نظرات خود را در مورد ویدیوهای YouTube DevTools یا نکات DevTools در YouTube ما بنویسید.