رویدادهای جهش از Chrome حذف خواهند شد

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

Mason Freed

Chromium رسماً رویدادهای جهش را منسوخ کرده است و برنامه ای برای حذف پشتیبانی از نسخه 127 دارد که در 23 ژوئیه 2024 عرضه می شود. این پست توضیح می‌دهد که چرا رویدادهای جهش را حذف می‌کنیم، و مسیری برای مهاجرت قبل از حذف آنها از مرورگر ارائه می‌کند.

رویدادهای جهش چیست؟

رویدادهای جهش نام مجموعه رویدادهای زیر است:

• DOMNodeInserted
• DOMNodeRemoved
• DOMSubtreeModified
• DOMCharacterDataModified
• DOMNodeInsertedIntoDocument
• DOMNodeRemovedFromDocument
• (توسط هیچ مرورگر مدرنی پشتیبانی نمی شود) DOMAttrModified
• (توسط هیچ مرورگر مدرنی پشتیبانی نمی شود) DOMAttributeNameChanged
• (توسط هیچ مرورگر مدرنی پشتیبانی نمی شود) DOMElementNameChanged

این رویدادها بخش بسیار قدیمی از مشخصات DOM سطح 2 هستند و از سال 2011 منسوخ شده اند. آنها با رابط MutationObserver جایگزین شدند که از سال 2013 در تمام مرورگرهای مدرن پشتیبانی می شود.

تاریخچه رویدادهای جهش

رویدادهای جهش مدت ها پیش ایده خوبی به نظر می رسید، اما مشخص شد که چندین نقص کشنده دارد:

• آنها پرحرف هستند و اغلب شلیک می کنند. برای هر گره ای که حذف می شود یک رویداد اجرا می شود.
• آنها کند هستند، به دلیل انتشار رویداد و به دلیل جلوگیری از بهینه سازی زمان اجرا UA.
• آنها اغلب باعث تصادف می شوند. آنها منبع بسیاری از خرابی ها و اشکالات امنیتی در مرورگرها بوده اند، زیرا شنوندگان رویداد می توانند کل DOM را در زیر یک عملیات DOM در حال اجرا تغییر دهند.

به دلیل این نقص‌ها، رویدادها از مشخصات در سال 2011 منسوخ شدند و یک API جایگزین ( MutationObserver ) در سال 2012 ساخته شد. API جدید برای بیش از 10 سال در این مرحله پیاده‌سازی و کاربردی شده است.

چرا رویدادهای جهش حذف می شوند

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

اولاً، این رویدادها پلتفرم وب را متوقف می کنند. با تکامل وب و اضافه شدن APIهای جدید، وجود این APIهای قدیمی باید در نظر گرفته شود. گاهی اوقات، تنها نیاز به پشتیبانی از این رویدادها می تواند مانع از ارائه API های جدید شود. به عنوان یک مثال، یک درخواست طولانی مدت برای جلوگیری از بارگیری مجدد عناصر <iframe> هنگام انتقال آنها به DOM وجود دارد. با این حال، تا حدی به دلیل وجود رویدادهای جهش، دستیابی به آن تلاش بسیار دشوار تلقی شد و درخواست بسته شد.

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

از آنجایی که بیش از 10 سال از منسوخ شدن رسمی رویدادها می گذرد، و API جایگزین به طور مشابه برای بیش از 10 سال در دسترس بوده است، زمان آن فرا رسیده است که در نهایت رویدادهای جهش را یک بار برای همیشه از مرورگرها حذف کنیم.

نحوه مهاجرت

به جای آن از MutationObserver استفاده کنید

مستندات MutationObserver در MDN قرار دارد و نسبتاً کامل است. جایگزینی برای پایگاه کد شما بستگی به نحوه استفاده از این رویدادها دارد، اما به عنوان مثال:

// Old mutation event usage:  
target.addEventListener('DOMNodeInserted',event => doSomething(event.target));

// Replacement mutation observer code:  
const observer = new MutationObserver(mutationList =>  
  mutationList.filter(m => m.type === 'childList').forEach(m => {  
    m.addedNodes.forEach(doSomething);  
  }));  
observer.observe(target,{childList: true, subtree: true});  

در حالی که کد MutationObserver بزرگتر از کد اصلی شنونده رویداد DOMNodeInserted به نظر می‌رسد، توجه داشته باشید که می‌تواند همه جهش‌هایی را که در کل درخت در یک فراخوانی اتفاق می‌افتند، کنترل کند، به‌جای اینکه نیاز به تماس‌های متعدد با کنترل‌کننده رویداد داشته باشد.

پلی پر

یک polyfill وجود دارد که سعی می کند به کدهای موجود اجازه دهد تا به عملکرد خود ادامه دهند، در حالی که توسط MutationObserver ارائه می شود. polyfill در GitHub یا به عنوان یک بسته npm قرار دارد.

• https://github.com/mfreed7/mutation-events-polyfill#readme
• https://www.npmjs.com/package/mutation-events

جدول زمانی و اطلاعات آزمایشی منسوخ

رویدادهای جهش از Chrome 127 برای همه کاربران حذف می‌شوند* که در تاریخ 23 ژوئیه 2024 به نسخه پایدار عرضه می‌شوند. به‌عنوان یک هشدار اولیه، زودتر از آن رویدادها از کانال‌های Canary، Dev و Beta حذف خواهند شد.

• اگر برای انتقال کد خود به زمان بیشتری (فراتر از ژوئیه ۲۰۲۴) نیاز دارید، آزمایشی Deprecation وجود دارد که رویدادها را به طور موقت در سایت‌های مشخص شده مجدداً فعال می‌کند. همچنین یک سیاست سازمانی به نام MutationEventsEnabled وجود دارد که به روشی مشابه برای کاربران سازمانی عمل می کند. هر یک از این گزینه ها در صورت نیاز، تقریباً نه ماه زمان اضافی برای مهاجرت می دهد.