Chrome Geliştirici Araçları'nda JavaScript kaynaklarının canlı olarak düzenlenmesi desteğinin sonlandırılması

Yayınlanma tarihi: 22 Ekim 2025

Chrome, JavaScript kaynaklarının canlı düzenlenmesi özelliğinin desteğini sonlandırıyor. Chrome 142'de deneysel bir işaretin arkasına taşınacak ve Chrome 145'te (Şubat 2026) tamamen kaldırılacak. Kaynak dosyalarla ilgili yerel geçersiz kılmalar, çalışma alanları veya snippet'ler gibi diğer güçlü özellikler kaldırılmıyor. Bu özellikler tam olarak desteklenmeye devam edecek.

Chrome Geliştirici Araçları ekibi, geliştiricilere güçlü ve güvenilir araçlar sunmak için sürekli olarak çalışmaktadır. Bu çalışmalar kapsamında, bazen artık yeterli performansı göstermeyen özellikleri kullanımdan kaldırmamız gerekir. Bu karar kolayca verilmemiştir ve özelliğin orantısız derecede yüksek bakım maliyeti, düşük kullanım oranı ve daha iyi modern alternatiflerin varlığına dayanmaktadır. Herhangi bir iş akışında yapılan değişikliklerin aksaklığa yol açabileceğinin farkındayız. Bu nedenle, bu gönderide gerekçemizi net bir şekilde açıklamak istedik.

Canlı düzenleme nedir?

Canlı düzenleme, bir senaryo dosyasının içeriğini çalışma zamanında anında değiştirmenize olanak tanır. Bu özellik, komut dosyası bir kesme noktasında duraklatıldığında bile çalışıyordu. Kaynaklar panelinde JavaScript kodunu değiştirebilir ve dosyayı kaydederek (Command+S / Ctrl+S) değişikliği uygulayabilirsiniz. Hata ayıklayıcı daha sonra çalışma zamanında zaten tanımlanmış olan işlevleri yamayacaktır. Değiştirilen işlev, çağrı yığınında yer alıyorsa bu işlev de yeniden başlatılırdı.

Amaç, küçük değişiklikleri tam sayfa yeniden yüklemesi olmadan test etmenin bir yolunu sunmaktı. Aksi takdirde, uygulamanın durumu temizlenirdi. Bu nedenle, amacı modern geliştirme yığınlarında Hot Module Replacement (HMR) ile elde edilenlere benzerdi.

Bu özelliği neden kaldırıyoruz?

Canlı düzenleme kullanıcı deneyimi her zaman zorlu olmuştur. İlgili kısayol (Command+S / Ctrl+S) genellikle bir dosyayı kaydetmekle ilişkilendirilir ancak şaşırtıcı bir şekilde başka yan etkileri yoktur. Başarısız olduğunda geri bildirim net olmayabilir: DevTools, "LiveEdit failed: Functions that are on the stack (currently being executed) can not be edited" (LiveEdit başarısız oldu: Yığında bulunan (şu anda yürütülen) işlevler düzenlenemez) gibi bir uyarı mesajı gösterebilir. Bu mesaj gözden kaçabilir ve geliştirici, değişikliğinin uygulanıp uygulanmadığından emin olamaz.

Canlı düzenleme, kaynak dosyalarla ilgili diğer Geliştirici Araçları özellikleriyle etkileşime girdiğinde durum daha da kötüleşir. Örneğin, bir DevTools Snippet'inin içeriğini canlı olarak düzenlemek, snippet kaynağının kimliğiyle ilgili olarak DevTools'u karıştırabilir ve yeni sürümün salt okunur dosya olarak gösterilmesine neden olabilir. Çalışma alanları özelliği etkinleştirildiğinde Geliştirici Araçları, dosya sistemindeki kaynak değişikliklerini gözlemleyebilir ve bu değişiklikleri canlı sayfaya sorunsuz bir şekilde uygulayabilir. Bu davranış, kullanıcının ortamına ve araç zinciri kurulumuna bağlı olarak beklenebilir veya şaşırtıcı olabilir.

Canlı düzenlemenin çözmeye çalıştığı asıl sorun (uygulama durumunu kaybetmeden değişiklik yapma) artık Hot Module Replacement (HMR) ile daha etkili bir şekilde çözülüyor. HMR, React, Angular veya Vue gibi modern web geliştirme çerçevelerinde standart bir özelliktir. Bu, kullanıcı alanında aynı etkiyi ve daha yüksek bir soyutlama düzeyinde elde eder. DevTools'daki canlı düzenleme, bu özelliği etkileyerek beklenmedik ve hatalı davranışlara neden olabilir.

Bu sorunlar, kullanıcı deneyimini olumsuz etkiler. Ayrıca, kullanım istatistiklerimizin de doğruladığı gibi bu özellik, çoğu geliştiricinin iş akışının temel bir parçası haline gelmedi. Bu özelliği kullanan kullanıcı sayısı çok düşüktür ve düşüş eğilimindedir.

Yüksek bakım maliyeti ve teknik karmaşıklık

Yayındaki bir sayfada kodu değiştirmek, hem makul semantik tanımlama hem de uygulama açısından kolay değildir. V8'in birçok bölümünde dikkatli bir değerlendirme gerektiren bu özellik, V8 JavaScript motoru ve Chrome Geliştirici Araçları'na önemli bir mühendislik maliyeti getirir. Canlı düzenleme, dikkatli olunmadığı takdirde yeniden üretilmesi zor ve hata ayıklaması zor olan kilitlenmelere neden olabilir. Örneğin, bir işlevin yeni sürümü, önceki sürümden farklı sayıda normal ifade, nesne veya işlev değişmezi içeriyorsa bu değişmezleri takip eden veri yapısının dikkatli bir şekilde mutabakatı yapılmalıdır.

Bu bakım yükü, yeni JavaScript özelliklerinin uygulanmasını yavaşlatır ve kaynakları daha yaygın olarak kullanılan Geliştirici Araçları özelliklerini iyileştirmekten uzaklaştırır.

Bu karmaşıklık, aşağıdakiler de dahil olmak üzere birçok desteklenmeyen senaryoya da yol açtı:

  • Çağrı yığınında bulunan ancak en üstteki çerçeve olmayan bir işlevi düzenleme
  • Asenkron işlevleri veya oluşturucuları düzenleme
  • Bir ES modülünün en üst düzey kodunu düzenleme

Alternatifler

Daha önce belirtildiği gibi, Hot Module Replacement (HMR) daha popüler bir alternatiftir ve birkaç önemli açıdan canlı düzenlemeden daha üstündür:

  • Canlı düzenleme, kaynak kodu düzeyinde canlı sayfanın eski sürümünün bölümlerini değiştirir. Diğer yandan HMR, eski sürümü Web çerçevesinin amaçladığı soyutlama düzeyinde değiştirerek canlı güncelleme sırasında bileşen ve uygulama durumunun doğru şekilde taşınma olasılığını artırır.
  • HMR, yazdığınız kaynak kod üzerinde çalışır. Orijinal dosyalarınızı (ör. TypeScript, JSX) düzenlediğinizde derleme aracı, tarayıcıdaki güncellemeyi işler. Canlı düzenleme ise yalnızca dağıtılan kaynak dosyaları etkiler. Bu dosyalar, çoğu durumda araç zinciri tarafından oluşturulan derleme çıktısıdır.
  • Güçlü ve iyi entegre edilmiştir. HMR, modern geliştirme araç zincirinin temel bir parçasıdır. Güncellemeler başarılı olduğunda veya başarısız olduğunda net geri bildirimlerle güvenilir bir deneyim sunar.

Canlı düzenleme özelliğinin kaldırılması, Chrome Geliştirici Araçları'ndaki diğer iki güçlü özelliği etkilemez:

  • Yerel geçersiz kılmalar, bir ağ isteğini yakalamanıza ve bunun yerine yerel bir dosya sunmanıza olanak tanır. Kaynak koduna erişiminizin olmadığı canlı bir üretim sitesinde değişikliklerin prototipini oluşturmak için idealdir. Değişiklikler, sayfa yeniden yüklendiğinde de geçerli olmaya devam eder.
  • Çalışma alanları, Kaynaklar paneli ile yerel proje dosyalarınız arasında iki yönlü bağlama oluşturarak DevTools'u daha güçlü bir düzenleyiciye dönüştürür. DevTools'da bir değişikliği kaydettiğinizde bu değişiklik doğrudan dosya sisteminize kaydedilir. Bu durum, geliştirme sunucunuzun HMR veya canlı yeniden yükleme sürecini tetikleyebilir.

Sonuç

Yüksek bakım maliyeti ve düşük kullanım oranı nedeniyle canlı düzenleme özelliğini kaldırıyoruz. Modern web geliştirme ekosistemi, Hot Module Replacement'ta çok daha üstün bir çözüm sunmaktadır.

Bu özelliği kullanımdan kaldırarak mühendislik çalışmalarımızı Chrome Geliştirici Araçları'nın daha etkili bölümlerine odaklayabiliriz. Kaldırma zaman çizelgesi aşağıdaki gibidir:

  • Yakın gelecekte: Bu özellik, Chrome 142'de bir denemenin arkasına taşınacak ve Chrome flag'i (chrome://flags/#devtools-live-edit) olarak kullanılabilecek.
  • Chrome 145 (Şubat 2026): Bu özellik ve ilgili Chrome işareti tamamen kaldırılacak.

Bu değişiklikle ilgili geri bildirimlerinizi bekliyoruz. Geri bildirim sorunuyla ilgili yorumlarınızı ekleyin.