Gepubliceerd: 22 oktober 2025
Chrome stopt met het live bewerken van JavaScript-bronnen . Deze functie wordt in Chrome 142 achter een experimentvlag geplaatst en we zijn van plan deze volledig te verwijderen in Chrome 145 (februari 2026). We verwijderen geen andere krachtige functies met betrekking tot bronbestanden, zoals Lokale overschrijvingen , Werkruimten of Snippets , die volledig ondersteund blijven.
Het Chrome DevTools-team werkt er continu aan om ontwikkelaars te voorzien van krachtige en betrouwbare tools. Als onderdeel hiervan moeten we soms functies uitfaseren die niet langer hun nut bewijzen. Deze beslissing is niet lichtzinnig genomen en is gebaseerd op de onevenredig hoge onderhoudskosten, het lage gebruik en het bestaan van betere, moderne alternatieven. We weten dat wijzigingen in elke workflow verstorend kunnen zijn, en dit bericht is bedoeld om onze redenering duidelijk uit te leggen.
Wat was live editing?
Met livebewerking kon je de inhoud van een scriptbestand tijdens runtime direct vervangen. Dit werkte zelfs wanneer het script op een breekpunt was gepauzeerd. Je kon JavaScript-code aanpassen in het paneel Bronnen en de wijziging toepassen door het bestand op te slaan ( Command+S / Ctrl+S ). De debugger patchte vervolgens functies die al tijdens runtime waren gedefinieerd. Als de gewijzigde functie zich in de aanroepstack bevond, werd deze ook opnieuw gestart.
Het doel was om een manier te bieden om kleine wijzigingen te testen zonder de volledige pagina opnieuw te laden, wat anders de status van de applicatie zou wissen. Het doel was vergelijkbaar met wat Hot Module Replacement (HMR) bereikt in moderne ontwikkelstacks.
Waarom verwijderen we het?
De gebruikerservaring voor livebewerking is altijd al een uitdaging geweest. De bijbehorende sneltoets (Command+S / Ctrl+S) wordt meestal geassocieerd met het opslaan van een bestand, maar niet met verdere bijwerkingen, wat verrassend kan zijn. Wanneer dit mislukt, kan de feedback onduidelijk zijn: DevTools kunnen een waarschuwingsbericht weergeven zoals "LiveEdit mislukt: functies die zich op de stack bevinden (momenteel uitgevoerd) kunnen niet worden bewerkt", wat over het hoofd kan worden gezien, waardoor de ontwikkelaar niet zeker weet of de wijziging is toegepast.
Het wordt nog erger wanneer livebewerking samenwerkt met andere DevTools-functies die betrekking hebben op bronbestanden. Zo kan het live bewerken van de inhoud van een DevTools-fragment DevTools in verwarring brengen met betrekking tot de identiteit van de bron van het fragment, waardoor de nieuwe versie als een alleen-lezenbestand wordt weergegeven. Wanneer de functie Werkruimten is ingeschakeld, kan DevTools bronwijzigingen in het bestandssysteem observeren en deze naadloos toepassen op de livepagina. Dit gedrag kan verwacht of verrassend zijn, afhankelijk van de omgeving van de gebruiker en de configuratie van de toolchain.
Het oorspronkelijke probleem dat live editing probeerde op te lossen – wijzigingen aanbrengen zonder de applicatiestatus te verliezen – wordt nu effectiever opgelost door Hot Module Replacement (HMR). HMR is een standaardfunctie in moderne webontwikkelingsframeworks zoals React, Angular of Vue. Het bereikt hetzelfde effect in de gebruikersruimte en op een hoger abstractieniveau. Live editing in DevTools kan dit verstoren, wat kan leiden tot onverwacht en foutief gedrag.
Deze problemen dragen bij aan een moeizame gebruikerservaring. Onze gebruiksstatistieken bevestigen ook dat de functie geen vast onderdeel is geworden van de workflows van de meeste ontwikkelaars. Het aantal gebruikers dat deze functie gebruikt, is zeer laag en vertoont een dalende trend.
Hoge onderhoudskosten en technische complexiteit
Het vervangen van code op een live pagina is niet eenvoudig, zowel wat betreft het definiëren van een redelijke semantiek als wat betreft de implementatie. Het brengt aanzienlijke engineeringkosten met zich mee voor de V8 JavaScript-engine en Chrome DevTools, wat zorgvuldige overweging vereist in veel onderdelen van V8. Zonder grote zorgvuldigheid kan live bewerking leiden tot moeilijk te reproduceren en moeilijk te debuggen crashes. Als de nieuwe versie van een functie bijvoorbeeld een ander aantal reguliere expressies, objecten of functieliteralen bevat dan de eerdere versie, moet de datastructuur die deze literalen bijhoudt zorgvuldig worden afgestemd.
Deze onderhoudslast vertraagt de implementatie van nieuwe JavaScript-functies en onttrekt middelen aan het verbeteren van breder gebruikte DevTools-functies.
Deze complexiteit leidde ook tot veel niet-ondersteunde scenario's, waaronder:
- Een functie bewerken die zich op de call stack bevindt, maar niet in het bovenste frame.
- Asynchrone functies of generatoren bewerken.
- De hoofdcode van een ES-module bewerken.
Alternatieven
Zoals eerder vermeld is Hot Module Replacement (HMR) een populairder alternatief en op een aantal belangrijke punten beter dan live editing:
- Live editing vervangt delen van de oudere versie van de live pagina op broncodeniveau. HMR daarentegen vervangt de oudere versie op het abstractieniveau dat het webframework beoogt, waardoor de kans groter wordt dat de component- en applicatiestatus correct wordt gemigreerd tijdens een live-update.
- HMR werkt op je geschreven broncode. Je bewerkt je originele bestanden (bijvoorbeeld TypeScript, JSX) in je editor en de buildtool verwerkt de update in de browser. Live-bewerking heeft echter alleen betrekking op geïmplementeerde bronbestanden, die in veel gevallen de build-uitvoer vormen die door de toolchain wordt gegenereerd.
- Het is robuust en goed geïntegreerd. HMR is een essentieel onderdeel van de moderne ontwikkeltoolchain en biedt een betrouwbare ervaring met duidelijke feedback wanneer updates slagen of mislukken.
Het verwijderen van livebewerking heeft geen invloed op twee andere krachtige functies in Chrome DevTools:
- Met Local Overrides kunt u een netwerkaanvraag onderscheppen en in plaats daarvan een lokaal bestand serveren. Dit is ideaal voor het maken van prototypes van wijzigingen op een live productiesite waar u geen toegang hebt tot de broncode. De wijzigingen blijven behouden na het herladen van de pagina.
- Workspaces maakt van DevTools een krachtigere editor door een tweerichtingsverbinding te creëren tussen het Bronnenpaneel en uw lokale projectbestanden. Wanneer u een wijziging opslaat in DevTools, wordt deze rechtstreeks in uw bestandssysteem opgeslagen. Dit kan vervolgens het HMR- of live-herlaadproces van uw ontwikkelserver activeren.
Conclusie
We stoppen met live-bewerking omdat de hoge onderhoudskosten en het lage gebruik het onhoudbaar maken. Het moderne webontwikkelingsecosysteem biedt een veel betere oplossing in de vorm van Hot Module Replacement.
Door deze functie te verwijderen, kunnen we onze technische inspanningen richten op onderdelen van Chrome DevTools die meer impact hebben. De tijdlijn voor verwijdering is als volgt:
- Binnenkort: De functie wordt verplaatst naar een experiment in Chrome 142, beschikbaar als een Chrome-vlag (chrome://flags/#devtools-live-edit).
- Chrome 145 (februari 2026): De functie en de bijbehorende Chrome-vlag worden volledig verwijderd.
We stellen uw feedback over deze wijziging op prijs. Voeg uw opmerkingen toe aan het feedbackprobleem .