منتشر شده: ۲۲ اکتبر ۲۰۲۵
کروم قابلیت ویرایش زنده‌ی منابع جاوا اسکریپت را منسوخ می‌کند. این قابلیت در کروم ۱۴۲ به پشت یک پرچم آزمایشی منتقل خواهد شد و ما قصد داریم آن را در کروم ۱۴۵ (فوریه ۲۰۲۶) به طور کامل حذف کنیم. ما سایر ویژگی‌های قدرتمند مرتبط با فایل‌های منبع مانند Local Overrides ، Workspaces یا Snippets را حذف نمی‌کنیم و همچنان به طور کامل پشتیبانی خواهند شد.
تیم Chrome DevTools دائماً در تلاش است تا ابزارهای قدرتمند و قابل اعتمادی را در اختیار توسعه‌دهندگان قرار دهد. به عنوان بخشی از این تلاش، گاهی اوقات نیاز داریم ویژگی‌هایی را که دیگر کارایی لازم را ندارند، کنار بگذاریم. این تصمیم به راحتی گرفته نشده و بر اساس هزینه نگهداری بسیار بالای این ویژگی، استفاده کم از آن و وجود جایگزین‌های مدرن برتر گرفته شده است. ما می‌دانیم که تغییرات در هر گردش کاری می‌تواند مخرب باشد و هدف این پست توضیح واضح دلایل ما است.
تدوین زنده چی بود؟
ویرایش زنده به شما امکان می‌دهد محتوای یک فایل اسکریپت را در زمان اجرا، درجا، جایگزین کنید. این قابلیت حتی زمانی که اسکریپت در یک نقطه توقف متوقف شده بود، کار می‌کرد. شما می‌توانستید کد جاوا اسکریپت را در پنل منابع تغییر دهید و با ذخیره فایل ( Command+S / Ctrl+S ) تغییر را اعمال کنید. سپس اشکال‌زدا، توابعی را که قبلاً در زمان اجرا تعریف شده بودند، اصلاح می‌کرد. اگر تابع تغییر یافته در پشته فراخوانی بود، مجدداً راه‌اندازی می‌شد.
هدف، ارائه راهی برای آزمایش تغییرات کوچک بدون بارگذاری مجدد کامل صفحه بود، که در غیر این صورت وضعیت برنامه را پاک می‌کرد. به این ترتیب، هدف آن مشابه کاری بود که جایگزینی ماژول داغ (HMR) در پشته‌های توسعه مدرن انجام می‌دهد.
چرا داریم حذفش می‌کنیم؟
تجربه کاربری برای ویرایش زنده همیشه چالش برانگیز بوده است. میانبر مرتبط (Command+S / Ctrl+S) معمولاً با ذخیره فایل همراه است، اما عوارض جانبی دیگری ندارد که ممکن است تعجب آور باشد. هنگامی که این میانبر با شکست مواجه می‌شود، بازخورد آن می‌تواند نامشخص باشد: DevTools ممکن است پیام هشداری مانند "LiveEdit failed: Functions that are on the stack (currently running) can not be editing" را نمایش دهد، که می‌توان آن را نادیده گرفت و توسعه‌دهنده را از اعمال شدن تغییر خود مطمئن نکرد.
وقتی ویرایش زنده با سایر ویژگی‌های DevTools مربوط به فایل‌های منبع تعامل داشته باشد، اوضاع حتی بدتر هم می‌شود. برای مثال، ویرایش زنده محتوای یک قطعه کد DevTools ممکن است DevTools را با ارجاع به هویت منبع قطعه کد اشتباه بگیرد و در نتیجه نسخه جدید به عنوان یک فایل فقط خواندنی نشان داده شود. وقتی ویژگی Workspaces فعال باشد، DevTools ممکن است تغییرات منبع را در سیستم فایل مشاهده کند و این تغییرات را به طور یکپارچه در صفحه زنده اعمال کند. این رفتار بسته به محیط کاربر و تنظیمات زنجیره ابزار او ممکن است قابل انتظار یا تعجب‌آور باشد.
مشکل اصلی که ویرایش زنده سعی در حل آن داشت - ایجاد تغییرات بدون از دست دادن وضعیت برنامه - اکنون توسط جایگزینی ماژول داغ (HMR) به طور مؤثرتری حل می‌شود. HMR یک ویژگی استاندارد در چارچوب‌های توسعه وب مدرن مانند React، Angular یا Vue است. این ویژگی همان اثر را در فضای کاربری و در سطح بالاتری از انتزاع به دست می‌آورد. ویرایش زنده در DevTools ممکن است با آن تداخل داشته باشد و منجر به رفتار غیرمنتظره و معیوب شود.
این مشکلات به یک تجربه کاربری دشوار منجر می‌شوند. همچنین، همانطور که آمار استفاده ما تأیید می‌کند، این ویژگی به بخش اصلی گردش کار اکثر توسعه‌دهندگان تبدیل نشده است. تعداد کاربرانی که با این ویژگی درگیر می‌شوند بسیار کم است و روند نزولی دارد.
هزینه نگهداری بالا و پیچیدگی فنی
جایگزینی کد در یک صفحه زنده، چه از نظر تعریف معانی منطقی و چه از نظر پیاده‌سازی، کار ساده‌ای نیست. این کار هزینه مهندسی قابل توجهی را به موتور جاوا اسکریپت V8 و Chrome DevTools تحمیل می‌کند و مستلزم بررسی دقیق در بسیاری از بخش‌های V8 است. در صورت عدم دقت کافی، ویرایش زنده می‌تواند منجر به خرابی‌های دشوار در بازتولید و اشکال‌زدایی شود. به عنوان مثال، اگر نسخه جدید یک تابع حاوی تعداد متفاوتی از عبارات منظم، شیء یا تابع بایت‌ها نسبت به نسخه قبلی باشد، ساختار داده‌ای که این لیترال‌ها را ردیابی می‌کند، باید با دقت تطبیق داده شود.
این بارِ نگهداری، پیاده‌سازی ویژگی‌های جدید جاوااسکریپت را کند می‌کند و منابع را از بهبود ویژگی‌های پرکاربردتر DevTools دور نگه می‌دارد.
این پیچیدگی همچنین منجر به سناریوهای پشتیبانی نشده زیادی شد، از جمله:
- ویرایش تابعی که در پشته فراخوانی قرار دارد اما در بالاترین فریم نیست.
- ویرایش توابع یا مولدهای ناهمگام.
- ویرایش کد سطح بالای یک ماژول ES.
جایگزین‌ها
همانطور که قبلاً ذکر شد، جایگزینی ماژول داغ (HMR) جایگزین محبوب‌تری است و از چند جنبه کلیدی نسبت به ویرایش زنده برتری دارد:
- ویرایش زنده، بخش‌هایی از نسخه قدیمی‌تر صفحه زنده را در سطح کد منبع جایگزین می‌کند. از سوی دیگر، HMR نسخه قدیمی‌تر را در سطح انتزاعی که توسط چارچوب وب در نظر گرفته شده است، جایگزین می‌کند و احتمال انتقال صحیح کامپوننت و حالت برنامه را در طول به‌روزرسانی زنده افزایش می‌دهد.
- HMR روی کد منبع نوشته شده شما کار می‌کند. شما فایل‌های اصلی خود (مثلاً TypeScript، JSX) را در ویرایشگر خود ویرایش می‌کنید و ابزار ساخت، به‌روزرسانی را در مرورگر انجام می‌دهد، در حالی که ویرایش زنده فقط روی فایل‌های منبع مستقر تأثیر می‌گذارد که در بسیاری از موارد خروجی ساخت تولید شده توسط toolchain هستند.
- HMR بخش اصلی زنجیره ابزار توسعه مدرن است و در صورت موفقیت یا شکست به‌روزرسانی‌ها، تجربه‌ای قابل اعتماد با بازخورد واضح ارائه می‌دهد.
حذف ویرایش زنده بر دو ویژگی قدرتمند دیگر در Chrome DevTools تأثیری نمی‌گذارد:
- لغوهای محلی به شما امکان می‌دهد درخواست شبکه را متوقف کرده و به جای آن یک فایل محلی ارائه دهید. این گزینه برای نمونه‌سازی اولیه تغییرات در یک سایت تولیدی زنده که به کد منبع دسترسی ندارید، ایده‌آل است. تغییرات در طول بارگذاری مجدد صفحه باقی می‌مانند.
- فضاهای کاری با ایجاد یک اتصال دو طرفه بین پنل منابع و فایل‌های پروژه محلی شما، DevTools را به یک ویرایشگر قدرتمندتر تبدیل می‌کند. وقتی تغییری را در DevTools ذخیره می‌کنید، مستقیماً در سیستم فایل شما ذخیره می‌شود. این امر ممکن است HMR یا فرآیند بارگذاری مجدد زنده سرور توسعه شما را فعال کند.
نتیجه‌گیری
ما ویرایش زنده را حذف می‌کنیم زیرا هزینه نگهداری بالا و کاربرد کم آن، آن را ناپایدار می‌کند. اکوسیستم توسعه وب مدرن، راه‌حل بسیار بهتری را در جایگزینی ماژول داغ ارائه داده است.
با کنار گذاشتن این ویژگی، می‌توانیم تلاش‌های مهندسی خود را روی بخش‌های تأثیرگذارتر Chrome DevTools متمرکز کنیم. جدول زمانی حذف به شرح زیر است:
- آینده نزدیک: این ویژگی به پشت یک آزمایش در کروم ۱۴۲ منتقل خواهد شد و به عنوان یک پرچم کروم (chrome://flags/#devtools-live-edit) در دسترس خواهد بود.
- کروم ۱۴۵ (فوریه ۲۰۲۶): این ویژگی و پرچم کروم مربوطه به طور کامل حذف خواهند شد.
از بازخورد شما در مورد این تغییر استقبال می‌کنیم. نظرات خود را در مورد مشکل بازخورد اضافه کنید.