Checklist per evitare gli anti-pattern

Utilizza questa checklist per verificare la presenza di anti-pattern nel tuo codice RxJS. Clicca su ogni voce per una spiegazione dettagliata e un esempio di codice.

Voci di controllo

🔴 Evitare i problemi critici

Controllo	Voce	Punti chiave
	Subject pubblicato con asObservable()	Non esportare direttamente Subject, ma esporlo come Observable con asObservable() Le modifiche allo stato sono possibili solo tramite metodi dedicati
	Evitare subscribe annidati	Non chiamare un altro subscribe all'interno di un subscribe Appiattire con switchMap, mergeMap, concatMap ecc.
	Gli stream infiniti devono essere sempre cancellati	Annullare sempre la sottoscrizione degli stream infiniti, come i listener di eventi Pattern takeUntil o gestione delle Subscription
	Impostare esplicitamente shareReplay	Utilizzare il formato shareReplay({ bufferSize: 1, refCount: true }) Abilitare il conteggio dei riferimenti per evitare memory leak
	Evitare l'annidamento di if in subscribe	Evitare condizionali complessi (annidamento di 3 o più livelli) all'interno di subscribe Dichiarare con operatori quali filter, iif e partition

🟡 Evitare i problemi che richiedono attenzione

Controllo	Voce	Punti chiave
	map è una funzione pura, gli effetti collaterali in tap	Nessun cambiamento di stato o output di log all'interno di map Gli effetti collaterali sono esplicitamente separati dall'operatore tap
	Usare Cold/Hot appropriatamente	Convertire richieste HTTP ecc. in Hot con shareReplay Decidere se eseguire per ogni sottoscrizione o condividere
	Promise convertita con from	Non mischiare Promise e Observable Convertire in Observable con from() per un'elaborazione unificata
	Gli eventi ad alta frequenza sono controllati	Controllare l'input di ricerca con debounceTime e lo scroll con throttleTime distinctUntilChanged per escludere i duplicati

🔵 Miglioramento della qualità del codice

Controllo	Voce	Punti chiave
	Gestire correttamente gli errori	Catturare gli errori con catchError e gestirli appropriatamente Mostrare messaggi di errore comprensibili Riprovare con retry / retryWhen se necessario
	Rilasciare correttamente gli eventi DOM	Annullare sempre la sottoscrizione di fromEvent Annullare automaticamente con takeUntil quando il componente viene distrutto
	Garantire la type safety	Definire interfacce e alias di tipo Parametri di tipo espliciti per Observable<T> Sfruttare l'inferenza di tipo di TypeScript
	Selezionare l'operatore appropriato	Ricerca: switchMap, parallelo: mergeMap Sequenziale: concatMap, prevenire clic ripetuti: exhaustMap
	RxJS non necessario per elaborazioni semplici	Il normale JavaScript è sufficiente per l'elaborazione di array ecc. RxJS è usato per l'elaborazione asincrona e i flussi di eventi
	Lo stato è gestito in modo reattivo	Gestire lo stato con BehaviorSubject o scan subscribe è usato come trigger finale
	Scrivere test	Test marble con TestScheduler L'elaborazione asincrona può essere testata in modo sincrono

Utilizzo

1. Durante la revisione del codice

Dopo aver scritto nuovo codice, utilizza questa checklist per effettuare un'auto-revisione.

2. Durante le pull request

Includi questa checklist nel template delle pull request, in modo che tu e i revisori abbiate criteri comuni.

3. Revisione periodica

Utilizza regolarmente questa checklist per verificare la presenza di anti-pattern nella codebase esistente.

4. Condivisione con il team

Condividila con i membri del team per unificare le best practice di RxJS.

Risorse correlate

• Errori comuni e come affrontarli - Spiegazioni dettagliate ed esempi di codice per ogni anti-pattern
• Raccolta di anti-pattern RxJS - Elenco di anti-pattern e percorso di apprendimento
• Gestione degli errori - Best practice per la gestione degli errori
• Metodologie di test - Come testare il codice RxJS

Suggerimenti per l'uso della checklist

1. Non cercare di perfezionare tutte le voci in una volta

   • Affronta prima i problemi critici (🔴)
   • Migliora passo dopo passo

2. Stabilisci le priorità all'interno del team

   • Adatta il livello di importanza in base alle caratteristiche del progetto
   • Crea checklist personalizzate

3. Considera l'automazione

   • Controlli automatizzati con strumenti di analisi statica come ESLint
   • Incorpora nella pipeline CI/CD

4. Aggiorna regolarmente

   • Aggiorna in base agli aggiornamenti di versione di RxJS
   • Rifletti le conoscenze acquisite dall'esperienza del team

---

Importante: Questa checklist non è una guida per scrivere codice perfetto, ma per evitare problemi comuni. Utilizzala in modo flessibile in base al contesto del tuo progetto.