چرا تیم مایکروسافت اج در حال جایگزینی React با وب کامپوننت‌ها هستند!

تیم مرورگر مایکروسافت اج در تلاش هستند تا کامپوننت‌های رابط کاربری که با React توسعه داده شده رو با web componentها جایگزین کنند تا سرعت و عملکرد بهتری برای کاربرانشون فراهم کنند. ایده اصلی اینه که با استفاده از یک “معماری مبتنی بر مارک‌آپ”، وابستگی به جاوااسکریپت کاهش پیدا کنه و پردازش کمتری در سمت کلاینت صورت بگیره.

اندرو ریتز، مدیر تیم Edge Fundamentals مایکروسافت، توضیح می‌ده که هدف تیمش تبدیل حدود ۵۰٪ از رابط‌های کاربری وب مبتنی بر React در اج به وب‌کامپوننت‌ها تا پایان سال ۲۰۲۴ است. انگیزه اصلی این پروژه عملکرد ضعیف رابط‌های کاربری مبتنی بر React بود، به ویژه در دستگاه‌های ضعیف یا قدیمی. استفاده گسترده از React در مایکروسافت منجر به ایجاد یک باندل بزرگ و پیچیده شده بود که بر عملکرد تأثیر منفی داشت.

تیم اج در ابتدا از React برای تمایز رابط کاربری خود از کروم استفاده کرده بود، اما حالا با پروژه WebUI 2.0، به دنبال بهبود عملکرد با استفاده از وب کامپوننت‌ها هستند. به عنوان مثال، رابط کاربری “browser essentials” رو که با کلیک بر روی آیکون قلب در نوار مرورگر فعال می‌شود، با وب کامپوننت‌ها بازسازی کردند.

بحث‌هایی توی کامیونیتی توسعه‌دهنده‌ها در مورد سختی استفاده از وب کامپوننت‌ها وجود داره و برخی معتقدند که فریمورک‌هایی مانند SolidJS قابلیت‌ها و سادگی بیشتری ارائه می‌دهند، در حالی که برخی دیگه به پایداری و قابلیت interoperable بین المان‌ها در وب کامپوننت‌ها وزن بیشتری می‌دن. ریتز می‌گوید که تیم او با تمرکز بر استفاده از عناصر داخلی HTML و CSS، تونسته توسعه را ساده‌تر کنه و هماهنگی بهتری بین توسعه‌دهندگان و طراحان ایجاد کنه.

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

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

مقاله کامل رو می‌تونید از اینجا بخونید 🙂

دیدگاهتان را بنویسید