Skip to content

Commit 8bceaaa

Browse files
authored
feat: translate React Compiler debugging page to Portuguese (#1098)
1 parent 4877aed commit 8bceaaa

File tree

1 file changed

+50
-50
lines changed

1 file changed

+50
-50
lines changed
Lines changed: 50 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1,93 +1,93 @@
11
---
2-
title: Debugging and Troubleshooting
2+
title: Depuração e Solução de Problemas
33
---
44

55
<Intro>
6-
This guide helps you identify and fix issues when using React Compiler. Learn how to debug compilation problems and resolve common issues.
6+
Este guia ajuda você a identificar e corrigir problemas ao usar o React Compiler. Aprenda como depurar problemas de compilação e resolver questões comuns.
77
</Intro>
88

99
<YouWillLearn>
1010

11-
* The difference between compiler errors and runtime issues
12-
* Common patterns that break compilation
13-
* Step-by-step debugging workflow
11+
* A diferença entre erros do compilador e problemas em tempo de execução
12+
* Padrões comuns que quebram a compilação
13+
* Fluxo de trabalho de depuração passo a passo
1414

1515
</YouWillLearn>
1616

17-
## Understanding Compiler Behavior {/*understanding-compiler-behavior*/}
17+
## Entendendo o Comportamento do Compilador {/*understanding-compiler-behavior*/}
1818

19-
React Compiler is designed to handle code that follows the [Rules of React](/reference/rules). When it encounters code that might break these rules, it safely skips optimization rather than risk changing your app's behavior.
19+
O React Compiler é projetado para lidar com código que segue as [Regras do React](/reference/rules). Quando encontra código que pode quebrar essas regras, ele ignora com segurança a otimização em vez de arriscar alterar o comportamento do seu app.
2020

21-
### Compiler Errors vs Runtime Issues {/*compiler-errors-vs-runtime-issues*/}
21+
### Erros do Compilador vs Problemas em Tempo de Execução {/*compiler-errors-vs-runtime-issues*/}
2222

23-
**Compiler errors** occur at build time and prevent your code from compiling. These are rare because the compiler is designed to skip problematic code rather than fail.
23+
**Erros do compilador** ocorrem no momento da compilação e impedem que seu código seja compilado. Estes são raros porque o compilador é projetado para ignorar código problemático em vez de falhar.
2424

25-
**Runtime issues** occur when compiled code behaves differently than expected. Most of the time, if you encounter an issue with React Compiler, it's a runtime issue. This typically happens when your code violates the Rules of React in subtle ways that the compiler couldn't detect, and the compiler mistakenly compiled a component it should have skipped.
25+
**Problemas em tempo de execução** ocorrem quando o código compilado se comporta de forma diferente do esperado. Na maioria das vezes, se você encontrar um problema com o React Compiler, é um problema em tempo de execução. Isso geralmente acontece quando seu código viola as Regras do React de maneiras sutis que o compilador não conseguiu detectar, e o compilador compilou incorretamente um componente que deveria ter ignorado.
2626

27-
When debugging runtime issues, focus your efforts on finding Rules of React violations in the affected components that were not detected by the ESLint rule. The compiler relies on your code following these rules, and when they're broken in ways it can't detect, that's when runtime problems occur.
27+
Ao depurar problemas em tempo de execução, concentre seus esforços em encontrar violações das Regras do React nos componentes afetados que não foram detectadas pela regra do ESLint. O compilador depende do seu código seguindo essas regras, e quando elas são quebradas de maneiras que ele não consegue detectar, é quando ocorrem problemas em tempo de execução.
2828

2929

30-
## Common Breaking Patterns {/*common-breaking-patterns*/}
30+
## Padrões Comuns que Quebram {/*common-breaking-patterns*/}
3131

32-
One of the main ways React Compiler can break your app is if your code was written to rely on memoization for correctness. This means your app depends on specific values being memoized to work properly. Since the compiler may memoize differently than your manual approach, this can lead to unexpected behavior like effects over-firing, infinite loops, or missing updates.
32+
Uma das principais maneiras pelas quais o React Compiler pode quebrar seu app é se seu código foi escrito para depender de memoização para correção. Isso significa que seu app depende de valores específicos sendo memoizados para funcionar adequadamente. Como o compilador pode memoizar de forma diferente da sua abordagem manual, isso pode levar a comportamentos inesperados como efeitos disparando demais, loops infinitos ou atualizações ausentes.
3333

34-
Common scenarios where this occurs:
34+
Cenários comuns onde isso ocorre:
3535

36-
- **Effects that rely on referential equality** - When effects depend on objects or arrays maintaining the same reference across renders
37-
- **Dependency arrays that need stable references** - When unstable dependencies cause effects to fire too often or create infinite loops
38-
- **Conditional logic based on reference checks** - When code uses referential equality checks for caching or optimization
36+
- **Efeitos que dependem de igualdade referencial** - Quando efeitos dependem de objetos ou arrays mantendo a mesma referência entre renderizações
37+
- **Arrays de dependência que precisam de referências estáveis** - Quando dependências instáveis fazem efeitos dispararem com muita frequência ou criar loops infinitos
38+
- **Lógica condicional baseada em verificações de referência** - Quando código usa verificações de igualdade referencial para cache ou otimização
3939

40-
## Debugging Workflow {/*debugging-workflow*/}
40+
## Fluxo de Trabalho de Depuração {/*debugging-workflow*/}
4141

42-
Follow these steps when you encounter issues:
42+
Siga estes passos quando encontrar problemas:
4343

44-
### Compiler Build Errors {/*compiler-build-errors*/}
44+
### Erros de Compilação do Compilador {/*compiler-build-errors*/}
4545

46-
If you encounter a compiler error that unexpectedly breaks your build, this is likely a bug in the compiler. Report it to the [facebook/react](https://github.com/facebook/react/issues) repository with:
47-
- The error message
48-
- The code that caused the error
49-
- Your React and compiler versions
46+
Se você encontrar um erro do compilador que quebra inesperadamente sua compilação, isso provavelmente é um bug no compilador. Reporte-o para o repositório [facebook/react](https://github.com/facebook/react/issues) com:
47+
- A mensagem de erro
48+
- O código que causou o erro
49+
- Suas versões do React e do compilador
5050

51-
### Runtime Issues {/*runtime-issues*/}
51+
### Problemas em Tempo de Execução {/*runtime-issues*/}
5252

53-
For runtime behavior issues:
53+
Para problemas de comportamento em tempo de execução:
5454

55-
### 1. Temporarily Disable Compilation {/*temporarily-disable-compilation*/}
55+
### 1. Desabilite Temporariamente a Compilação {/*temporarily-disable-compilation*/}
5656

57-
Use `"use no memo"` to isolate whether an issue is compiler-related:
57+
Use `"use no memo"` para isolar se um problema está relacionado ao compilador:
5858

5959
```js
6060
function ProblematicComponent() {
61-
"use no memo"; // Skip compilation for this component
62-
// ... rest of component
61+
"use no memo"; // Pula a compilação para este componente
62+
// ... resto do componente
6363
}
6464
```
6565

66-
If the issue disappears, it's likely related to a Rules of React violation.
66+
Se o problema desaparecer, provavelmente está relacionado a uma violação das Regras do React.
6767

68-
You can also try removing manual memoization (useMemo, useCallback, memo) from the problematic component to verify that your app works correctly without any memoization. If the bug still occurs when all memoization is removed, you have a Rules of React violation that needs to be fixed.
68+
Você também pode tentar remover a memoização manual (useMemo, useCallback, memo) do componente problemático para verificar que seu app funciona corretamente sem qualquer memoização. Se o bug ainda ocorrer quando toda a memoização for removida, você tem uma violação das Regras do React que precisa ser corrigida.
6969

70-
### 2. Fix Issues Step by Step {/*fix-issues-step-by-step*/}
70+
### 2. Corrija Problemas Passo a Passo {/*fix-issues-step-by-step*/}
7171

72-
1. Identify the root cause (often memoization-for-correctness)
73-
2. Test after each fix
74-
3. Remove `"use no memo"` once fixed
75-
4. Verify the component shows the ✨ badge in React DevTools
72+
1. Identifique a causa raiz (frequentemente memoização-para-correção)
73+
2. Teste após cada correção
74+
3. Remova `"use no memo"` uma vez corrigido
75+
4. Verifique se o componente mostra o badge ✨ no React DevTools
7676

77-
## Reporting Compiler Bugs {/*reporting-compiler-bugs*/}
77+
## Reportando Bugs do Compilador {/*reporting-compiler-bugs*/}
7878

79-
If you believe you've found a compiler bug:
79+
Se você acredita que encontrou um bug do compilador:
8080

81-
1. **Verify it's not a Rules of React violation** - Check with ESLint
82-
2. **Create a minimal reproduction** - Isolate the issue in a small example
83-
3. **Test without the compiler** - Confirm the issue only occurs with compilation
84-
4. **File an [issue](https://github.com/facebook/react/issues/new?template=compiler_bug_report.yml)**:
85-
- React and compiler versions
86-
- Minimal reproduction code
87-
- Expected vs actual behavior
88-
- Any error messages
81+
1. **Verifique se não é uma violação das Regras do React** - Verifique com o ESLint
82+
2. **Crie uma reprodução mínima** - Isole o problema em um exemplo pequeno
83+
3. **Teste sem o compilador** - Confirme que o problema só ocorre com a compilação
84+
4. **Abra uma [issue](https://github.com/facebook/react/issues/new?template=compiler_bug_report.yml)**:
85+
- Versões do React e do compilador
86+
- Código de reprodução mínima
87+
- Comportamento esperado vs atual
88+
- Qualquer mensagem de erro
8989

90-
## Next Steps {/*next-steps*/}
90+
## Próximos Passos {/*next-steps*/}
9191

92-
- Review the [Rules of React](/reference/rules) to prevent issues
93-
- Check the [incremental adoption guide](/learn/react-compiler/incremental-adoption) for gradual rollout strategies
92+
- Revise as [Regras do React](/reference/rules) para prevenir problemas
93+
- Verifique o [guia de adoção incremental](/learn/react-compiler/incremental-adoption) para estratégias de implementação gradual

0 commit comments

Comments
 (0)