Sinais Angulares — Prevenindo Dependências Desnecessárias Usando a Função Untrack

Apr 28 2023
Quando um valor de sinal muda, qualquer computad() ou effect() que dependa dele será reavaliado. Isso é chamado de rastreamento.

Quando o valor de um sinal muda, qualquer um computed()ou effect()que dependa dele será reavaliado. Isso é chamado de rastreamento. Porém, às vezes queremos ler um valor de sinal sem criar uma dependência, ou seja, sem acionar a função reativa quando seu valor muda. Nesses casos, podemos usar a untrackfunção fornecida pelo Angular.

Vamos considerar um exemplo onde temos dois sinais, ae b, e queremos registrar seus valores em um effect:

const a = signal(0);
const b = signal(1);

effect(() => {
  console.log(a(), b());
})

import { untrack } from '@angular/core';

const a = signal(0);
const b = signal(1);

effect(() => {
  console.log(a(), untrack(() => b()));
})

const a = signal(0);
const b = signal(1);

effect(() => {
  console.log(a(), untrack(b));
})

effect(() => {
  // ...read signals...
  const a = a();

  untracked(() => {
    this.someMethodThatReadsSignals(a);
  });
})

Em conclusão, a untrackfunção é uma ferramenta útil em Angular para melhorar o desempenho de leitura do sinal e evitar dependências desnecessárias.

Siga-me no Medium ou Twitter para ler mais sobre Angular e JS!