Frontend Academy · Aula

Turbo: armazenamento em cache e pipelines de tarefas

Definir um pipeline em turbo.json, configurar dependências de tarefas com dependsOn e ativar o armazenamento remoto em cache para partilhar resultados armazenados entre máquinas.

Aula 4 de 417 etapas

Turbo: armazenamento em cache e pipelines de tarefas é uma aula grátis de Frontend Academy no CoddyKit. Esta é a aula 4 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de Frontend Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de Frontend Academy inclui 4 aulas no total.

Recapitulação do Turborepo

O Turborepo (agora apenas Turbo) é o orquestrador de compilações de alto desempenho para monorepos de JavaScript. Ele executa tarefas em paralelo entre os pacotes, armazena os resultados em cache usando hashes e ignora o trabalho quando as entradas não mudaram.

Por que o armazenamento em cache é importante

Em um monorepo com 20 pacotes, executar o 'teste' a cada envio é caro. Se apenas um pacote mudou, o Turbo executa novamente o teste dele e reproduz a saída armazenada em cache para os outros 19 — transformando minutos em segundos.

Como funciona o hashing

O Turbo calcula o hash de: arquivos-fonte (padrão glob de entrada), dependências (package.json + arquivo de bloqueio), variáveis de ambiente que você declara e a própria configuração da tarefa. Mesmo hash = trabalho idêntico = acerto de cache.

turbo.json — O fluxo de tarefas

Declare as tarefas e suas relações em turbo.json.

// turbo.json
{
  "$schema": "https://turbo.build/schema.json",
  "tasks": {
    "build": {
      "dependsOn": ["^build"],
      "inputs": ["src/**", "package.json"],
      "outputs": ["dist/**", ".next/**"]
    },
    "test": {
      "dependsOn": ["^build"],
      "inputs": ["src/**", "test/**", "package.json"]
    },
    "lint": { "inputs": ["**/*.{ts,tsx,js,jsx}", ".eslintrc*"] },
    "dev": { "cache": false, "persistent": true }
  }
}

Entradas e saídas

entradas: arquivos que contribuem para o hash. saídas: arquivos que o Turbo deve armazenar e restaurar no cache. Configure isso corretamente e sua taxa de acertos de cache saltará para mais de 90%.

dependsOn

['^build']: compile primeiro as dependências. ['lint']: execute a verificação antes desta tarefa no mesmo pacote. ['^build', 'lint']: combine as duas opções.

cache: false e persistent: true

Tarefas como dev nunca são armazenadas em cache (são interativas e executadas por muito tempo) e permanecem ativas (o Turbo as mantém em execução). Defina ambas as opções para servidores de desenvolvimento.

Executando tarefas

Use a CLI do Turbo.

npx turbo run build
npx turbo run test lint
npx turbo run build --filter=web
npx turbo run build --filter=web... --concurrency=10

Locais do cache

Por padrão, o cache local fica em node_modules/.cache/turbo. Cada execução produz registros + as saídas capturadas. Os acertos de cache exibem: 'acerto de cache, reproduzindo registros'.

Cache remoto

Envie o cache para um armazenamento remoto para que a CI e os colegas compartilhem os acertos. Cadastre-se gratuitamente por meio de turbo login (Vercel Remote Cache) ou hospede-o por conta própria.

npx turbo login
npx turbo link    # link to a Vercel remote cache

# In CI:
env:
  TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
  TURBO_TEAM: yourteam

Cache remoto hospedado por você

Alternativas OSS: turborepo-remote-cache (Node), turbo-cache-server (Go). Implante na sua infraestrutura e defina a variável de ambiente TURBO_API.

Entradas de variáveis de ambiente

Declare quais variáveis de ambiente afetam as saídas — o Turbo trata essas variáveis como entradas, portanto alterá-las invalida o cache.

// turbo.json
{
  "tasks": {
    "build": {
      "env": ["NODE_ENV", "VITE_API_URL"],
      "outputs": ["dist/**"]
    }
  },
  "globalEnv": ["GITHUB_SHA"]
}

Filtragem

Execute uma tarefa para pacotes específicos ou para aqueles afetados por alterações.

# Specific package and its dependencies:
turbo run build --filter=web...

# Packages that depend on shared/ui:
turbo run test --filter='...@repo/ui'

# Changed since main:
turbo run lint --filter='[origin/main]'

# Combine:
turbo run build --filter=web...[origin/main]

DRY_RUN e criação de perfil

--dry=json exibe o grafo de tarefas sem executar nada. --profile gera um rastreamento no estilo do Chrome-DevTools.

turbo run build --dry=json | jq
turbo run build --profile=trace.json
# open chrome://tracing and load trace.json

Armadilhas comuns

1) Esquecer de declarar as saídas (o Turbo não as armazenará em cache). 2) Esquecer uma variável de ambiente que afeta a compilação. 3) Armazenar servidores de desenvolvimento em cache (defina cache: false). 4) Não usar --frozen-lockfile na CI (alterações no arquivo de bloqueio podem mudar os hashes).

Verificação rápida

Quais dois campos na configuração de uma tarefa do Turbo determinam se as saídas podem ser reproduzidas a partir do cache?

Responda na aula interativa

Recapitulação: Turbo

Armazenamento local + remoto em cache, baseado em hashes, para tarefas de monorepos. turbo.json declara tarefas com dependsOn, entradas, saídas e ambiente. Use cache: false + persistent: true para servidores de desenvolvimento. Filtre tarefas com --filter=web..., changed-since=[origin/main]. O cache remoto (Vercel ou hospedado por você) compartilha acertos entre a CI e a equipe. Crie um perfil com --profile. Configure corretamente as entradas e saídas para maximizar a taxa de acertos.

Grátis para começar

Aprenda HTML com um tutor de IA — grátis

Escreva e execute código real no seu navegador, obtenha ajuda instantânea de um tutor de IA 24/7 e continue de onde parou na web ou no app.

Cursos: 41
Aulas: 163

Começar a aprender grátis Ver o curso completo

Perguntas Frequentes

A aula “Turbo: armazenamento em cache e pipelines de tarefas” é grátis?

Sim — o texto completo de “Turbo: armazenamento em cache e pipelines de tarefas” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de Frontend Academy, atualize para CoddyKit PRO. O curso de Frontend Academy inclui 4 aulas no total.

O que vou aprender em “Turbo: armazenamento em cache e pipelines de tarefas”?

Definir um pipeline em turbo.json, configurar dependências de tarefas com dependsOn e ativar o armazenamento remoto em cache para partilhar resultados armazenados entre máquinas. Você pratica Frontend Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar Frontend Academy?

Nenhuma experiência prévia é necessária. Frontend Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 4 de 4.

Quanto tempo leva a aula “Turbo: armazenamento em cache e pipelines de tarefas”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de Frontend Academy?

Sim. Cada aula de Frontend Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

Vite: sistema de plugins e modo SSR
esbuild: velocidade e limitações
Workspaces pnpm para monorepos
Turbo: armazenamento em cache e pipelines de tarefas

← Voltar para Frontend Academy