Migliorare e rifattorizzare il codice
Best practice per il miglioramento e il refactoring del codice con Verdent
Verdent for VS Code ti aiuta a rifattorizzare e migliorare il codice in modo sicuro su più file preservandone le funzionalità. Usando Plan Mode con il sottoagente Explorer, puoi identificare tutti i file interessati prima di apportare modifiche, garantendo un refactoring completo senza tralasciare alcuna occorrenza.
Cosa imparerai
- Richiedere refactoring efficaci focalizzati sui risultati, non sull'implementazione
- Rifattorizzare in sicurezza su più file con gestione delle dipendenze
- Richiedere miglioramenti della qualità del codice e suggerimenti di ottimizzazione
- Gestire progetti di refactoring su larga scala con approcci multi-fase
- Ottimizzare le prestazioni tramite miglioramenti algoritmici e architetturali
- Preservare le funzionalità del codice durante le operazioni di refactoring
Prerequisiti
Prima di rifattorizzare con Verdent:
- Visual Studio Code con l'estensione Verdent installata
- Un codebase o un workspace di progetto aperto in VS Code
- Un abbonamento Verdent attivo con crediti disponibili
- Controllo di versione (Git) consigliato per un rollback sicuro in caso di necessità
Richiedere refactoring efficaci
Descrivi cosa vuoi migliorare e perché, invece di come risolverlo. Lascia che Verdent analizzi il codice e proponga l'approccio migliore in base ai pattern del tuo progetto.
Richieste di refactoring efficaci:
Concentrati sul risultato che vuoi ottenere, non sull'implementazione:
Refactor the UserController to improve readability and reduce duplicationThis authentication logic is scattered across multiple files. Consolidate it into a single moduleImprove error handling in the API layer to be more consistent and informativeVerdent analizza il codice, identifica tutti i file interessati, esamina i pattern e propone strategie di refactoring specifiche allineate alle convenzioni del tuo codebase.
Best practice: usa Plan Mode
Avvia le richieste di refactoring in Plan Mode. Verdent farà quanto segue:
- Analizzare il codice e identificare tutti i file interessati
- Presentare un piano di refactoring dettagliato prima di apportare modifiche
- Porre domande di chiarimento sulle preferenze di implementazione
- Mostrare esattamente cosa cambierà e in quale ordine
- Consentirti di rivedere e affinare l'approccio
Esempio con Plan Mode:
In Plan Mode: Refactor authentication logic to use a centralized authentication utilityVerdent farà quanto segue:
- Usare Explorer per trovare tutte le posizioni del codice di autenticazione
- Identificare pattern e incoerenze
- Proporre un'interfaccia di autenticazione unificata
- Mostrare quali file verranno modificati
- Spiegare la sequenza di refactoring
Puoi chiedere a Verdent di salvare il piano in un file plan.md per una revisione aggiuntiva e una discussione con il team prima dell'esecuzione.
Usare Explorer per ricerche complete:
Per refactoring complessi, chiedi esplicitamente a Verdent di usare l'agente Explorer per cercare in modo approfondito:
Use the Explorer agent to find all places where we manually validate email addresses, then refactor them to use a centralized validation utilityIn questo modo Verdent individua ogni posizione che necessita di aggiornamento, evitando refactoring incoerenti nel codebase.
Plan Mode è essenziale per il refactoring. Evita sorprese mostrando esattamente cosa cambierà prima dell'esecuzione e ti consente di affinare l'approccio in base a considerazioni architetturali.
Refactoring multi-file
Verdent rifattorizza su più file mantenendo import, dipendenze e riferimenti tra file. Identifica tutti i file interessati, li aggiorna nell'ordine corretto e garantisce la coerenza in tutto il codebase.
Come funziona il refactoring multi-file:
- Fase di scoperta: Verdent (usando Explorer) trova tutti i file che necessitano di modifiche
- Analisi delle dipendenze: identifica le dipendenze tra i file per determinare l'ordine di aggiornamento
- Creazione del piano: mostra tutti i file da modificare e la sequenza delle modifiche
- Aggiornamenti sequenziali: modifica i file in ordine di dipendenza (ad esempio i tipi prima dei componenti che li utilizzano)
- Gestione degli import: aggiorna automaticamente import, export e riferimenti tra file
- Verifica: controlla che le modifiche siano coerenti in tutti i file
Il refactoring multi-file preserva le funzionalità tramite il tracciamento automatizzato delle dipendenze: Verdent aggiorna tutti i file interessati in modo atomico.
Esempio:
Rename the User interface to UserProfile across the entire projectVerdent farà quanto segue:
- Trovare tutti i file che importano o usano
User - Identificare definizioni di tipo, implementazioni e utilizzi
- Aggiornare prima le definizioni di tipo, poi le implementazioni, poi gli utilizzi
- Adattare tutte le istruzioni di import
- Garantire la coerenza in tutto il codebase
Usa Plan Mode per rivedere l'ambito:
Prima di eseguire un refactoring multi-file, rivedi l'ambito completo in Plan Mode:
In Plan Mode: Extract the authentication logic from UserController into a separate AuthServiceVerdent mostrerà:
- Quali file verranno creati (il nuovo AuthService)
- Quali file verranno modificati (UserController e tutti gli importatori)
- Quale codice verrà spostato da UserController ad AuthService
- Come verranno aggiornati import e dipendenze
In questo modo si evita un'espansione accidentale dell'ambito e si comprende l'impatto completo prima di procedere.
Richiedere miglioramenti della qualità del codice
Verdent non suggerisce miglioramenti in modo proattivo senza che gli venga chiesto. Tuttavia, puoi richiedere revisioni della qualità del codice e suggerimenti di miglioramento in qualsiasi momento.
Richiedi revisioni ampie della qualità del codice:
Review this code for potential improvementsSuggest ways to improve code quality in the UserService moduleAre there any performance optimizations we could make here?Analyze the PaymentController for maintainability issuesVerdent analizza il codice e fornisce suggerimenti specifici per:
- Leggibilità: denominazione delle variabili, decomposizione delle funzioni, chiarezza dei commenti
- Prestazioni: complessità degli algoritmi, operazioni ridondanti, opportunità di caching
- Manutenibilità: duplicazione del codice, accoppiamento, separazione delle responsabilità
- Best practice: design pattern, gestione degli errori, copertura dei test
- Sicurezza: validazione dell'input, controlli di autenticazione, esposizione dei dati
Per un feedback mirato, fai riferimento a file specifici:
@services/UserService.js Review this module for dependency injection improvements@controllers/PaymentController.js Identify opportunities to reduce complexityVerdent esamina il codice specificato nel contesto dei pattern del tuo progetto e fornisce raccomandazioni concrete.
Progetti di refactoring su larga scala
Per il refactoring su larga scala, usa Plan Mode con un approccio multi-fase per ottenere i risultati più affidabili. Verdent suddivide il refactoring in fasi gestibili, permettendoti di rivedere e approvare ciascuna fase prima di procedere.
Flusso di lavoro di refactoring multi-fase:
Fase 1: analisi iniziale
Usa Plan Mode con l'agente Explorer per identificare tutti i file e le dipendenze interessati:
In Plan Mode: Use Explorer to analyze our codebase and create a plan to replace our custom authentication with OAuth 2.0Verdent esegue un'analisi completa:
- Identifica tutto il codice relativo all'autenticazione
- Mappa le dipendenze e i punti di integrazione
- Valuta le aree di complessità e di rischio
- Propone la suddivisione in fasi
Fase 2: pianificazione delle fasi
Verdent crea un piano multi-fase da rivedere:
Esempio di piano:
- Fase 1: aggiungere la libreria OAuth e configurare gli endpoint
- Fase 2: aggiornare il modello utente e lo schema del database
- Fase 3: migrare la logica di autenticazione esistente
- Fase 4: rimuovere il codice di autenticazione deprecato
- Fase 5: aggiornare test e documentazione
Ogni fase include:
- File da modificare
- Complessità stimata
- Dipendenze dalle fasi precedenti
- Valutazione del rischio
Fase 3: esecuzione fase per fase
Esegui una fase alla volta, testando tra una fase e l'altra:
- Approva la Fase 1 in Plan Mode
- Passa a Agent Mode ed esegui
- Testa a fondo per verificare che la Fase 1 funzioni
- Torna a Plan Mode per la Fase 2
- Ripeti finché tutte le fasi non sono completate
Fase 4: affinamento iterativo
Rivedi i risultati dopo ogni fase. Se emergono problemi:
- Adatta il piano per le fasi rimanenti
- Aggiungi fasi correttive se necessario
- Affina l'approccio in base alle scoperte
Questo approccio a fasi garantisce sicurezza e consente correzioni di rotta se emergono problemi durante progetti di refactoring di grandi dimensioni.
Il refactoring su larga scala dovrebbe sempre essere eseguito con il controllo di versione. Esegui un commit dopo ogni fase così puoi effettuare il rollback in caso di problemi senza perdere tutti i progressi.
Ottimizzazione delle prestazioni
Verdent analizza il codice alla ricerca di colli di bottiglia nelle prestazioni e suggerisce ottimizzazioni, tra cui miglioramenti della complessità algoritmica, strutture dati efficienti e riduzione dell'utilizzo delle risorse.
Migliora la complessità algoritmica:
Analyze the performance of this data processing function and suggest improvementsCan we improve the time complexity of this search algorithm?Cosa identifica Verdent:
- Complessità algoritmica: cicli O(n²), iterazioni annidate, ricerche inefficienti
- Calcoli ridondanti: calcoli ripetuti, operazioni non necessarie
- Problemi di memoria: memory leak, allocazioni eccessive, ritenzione di oggetti di grandi dimensioni
Esempio:
Optimize the searchProducts function that's currently O(n²)Verdent analizza la funzione, identifica l'inefficienza (cicli annidati o ricerche lineari ripetute) e propone miglioramenti specifici:
- Sostituire il ciclo annidato con una hash map per una ricerca O(n)
- Usare la ricerca binaria dopo l'ordinamento per una complessità O(log n)
- Memorizzare in cache i risultati calcolati per evitare calcoli ridondanti
- Implementare la memoizzazione per le operazioni costose
La risposta include:
- Complessità attuale: spiegazione del perché il codice attuale è lento
- Soluzione proposta: modifica specifica dell'algoritmo o della struttura dati
- Guadagno prestazionale: miglioramento stimato (ad esempio O(n²) → O(n log n))
- Compromessi: considerazioni su utilizzo della memoria, complessità del codice e manutenibilità
Ottimizza i componenti UI e il rendering:
Optimize this component to reduce unnecessary re-rendersCosa identifica Verdent:
- Prestazioni frontend: re-render non necessari, bundle di grandi dimensioni, operazioni bloccanti
- Ciclo di vita dei componenti: dipendenze useEffect inefficienti, memoizzazione mancante
- Gestione dello stato: aggiornamenti di stato ridondanti, prop drilling
Verdent analizza il tuo componente e suggerisce ottimizzazioni come React.memo, useMemo, useCallback o la suddivisione dei componenti.
Individua e correggi i colli di bottiglia di API e del database:
Identify performance bottlenecks in the API request handlerCosa identifica Verdent:
- Prestazioni del database: query N+1, indici mancanti, join inefficienti
- Prestazioni di API: endpoint lenti, recupero dati inefficiente, caching mancante
Verdent esamina i pattern delle query e suggerisce indici del database, strategie di caching e tecniche di ottimizzazione di API.
Per l'ottimizzazione delle prestazioni, fornisci il contesto sulle dimensioni tipiche dei dati e sui vincoli di prestazione. Questo aiuta Verdent a proporre soluzioni adeguate alla tua scala (ad esempio 100 elementi vs 1 milione di elementi).
Profila prima di ottimizzare e misura l'impatto sulle prestazioni per assicurarti che le ottimizzazioni offrano miglioramenti significativi.
Preservare le funzionalità durante il refactoring
Verdent mira a preservare le funzionalità del codice durante il refactoring, mantenendo gli stessi input, output e comportamenti mentre migliora l'implementazione interna.
Come Verdent preserva le funzionalità:
- Analisi input/output: identifica le firme delle funzioni, i contratti di API e i comportamenti previsti
- Consapevolezza dei test: considera i test esistenti come specifiche comportamentali
- Modifiche conservative: apporta le modifiche minime necessarie per raggiungere l'obiettivo del refactoring
- Verifica: può generare o eseguire test per verificare che le funzionalità siano preservate
Best practice per un refactoring sicuro:
-
Testa sempre il codice rifattorizzato - Anche con l'analisi di Verdent, i test manuali o automatizzati verificano che le funzionalità siano preservate, soprattutto per i refactoring complessi
-
Usa il controllo di versione - Esegui un commit prima del refactoring così puoi effettuare il rollback se emergono problemi
-
Rifattorizza in modo incrementale - Suddividi i grandi refactoring in passaggi più piccoli, testando dopo ogni modifica
-
Rivedi le modifiche con attenzione - Esamina il diff per capire cosa è cambiato e perché
-
Usa Plan Mode per i refactoring complessi - Rivedi l'approccio prima dell'esecuzione per individuare potenziali problemi
Esempio: richiesta di refactoring sicuro
Refactor the calculateOrderTotal function to use a more maintainable structure, but ensure it produces identical results for all input casesVerdent farà quanto segue:
- Analizzare l'implementazione attuale e i casi limite
- Proporre una struttura rifattorizzata
- Spiegare perché la versione rifattorizzata è equivalente
- Suggerire casi di test per verificare l'equivalenza
Quando le funzionalità potrebbero cambiare:
In alcuni casi, il refactoring modifica intenzionalmente il comportamento (correzione di bug, miglioramento della validazione). Rendilo esplicito:
Refactor the email validation function to correctly handle international domains, which the current implementation doesn't supportQuesto segnala che il cambiamento di comportamento è previsto e intenzionale.
Best practice
Descrivi il problema, non la soluzione
Lascia che Verdent analizzi il codice e proponga il miglior approccio di refactoring invece di prescrivere modifiche specifiche.
Usa sempre Plan Mode per il refactoring
Rivedi il piano completo prima dell'esecuzione. Questo evita sorprese e ti consente di affinare l'approccio in base a considerazioni architetturali.
Usa esplicitamente Explorer per ricerche complete
Per un refactoring approfondito, chiedi a Verdent di usare Explorer per trovare tutte le occorrenze: "Usa Explorer per trovare tutta la gestione manuale degli errori, poi rifattorizza per usare la nostra utility per gli errori."
Suddividi i grandi refactoring in fasi
Gli approcci multi-fase con test tra le fasi sono più sicuri e più gestibili rispetto al tentativo di fare tutto in una volta.
Testa tra le fasi
Verifica che ogni fase funzioni prima di procedere alla successiva. Questo isola i problemi ed evita che si accumulino.
Esegui commit frequenti
Usa il controllo di versione per creare checkpoint dopo ogni fase o modifica importante. Questo consente un rollback sicuro senza perdere tutti i progressi.
Salva i piani per la revisione del team
Per i refactoring significativi, chiedi a Verdent di salvare il piano in plan.md per una discussione con il team prima dell'esecuzione.
Fornisci il contesto per l'ottimizzazione
Quando richiedi miglioramenti delle prestazioni, includi informazioni sulle dimensioni dei dati, sui vincoli di prestazione e sui compromessi accettabili.