@@ -26,7 +26,7 @@ Na maioria dos casos, você não precisa de `"use memo"`. Ele é primariamente n
2626Adicione ` "use memo" ` no início de uma função para marcá-la para otimização pelo React Compiler.
2727
2828``` js {1}
29- function MeuComponente () {
29+ function MyComponent () {
3030 " use memo" ;
3131 // ...
3232}
@@ -63,13 +63,13 @@ Em `compilationMode: 'annotation'`, a diretiva é necessária para qualquer fun
6363
6464``` js
6565// ✅ Este componente será otimizado
66- function ListaOtimizada () {
66+ function OptimizedList () {
6767 " use memo" ;
6868 // ...
6969}
7070
7171// ❌ Este componente não será otimizado
72- function WrapperSimples () {
72+ function SimpleWrapper () {
7373 // ...
7474}
7575```
@@ -79,13 +79,13 @@ Comece com o modo `annotation` e otimize seletivamente componentes estáveis:
7979
8080``` js
8181// Comece otimizando componentes folha
82- function Botao ({ onClick, children }) {
82+ function Button ({ onClick, children }) {
8383 " use memo" ;
8484 // ...
8585}
8686
8787// Gradualmente suba na árvore conforme verifica o comportamento
88- function GrupoDeBotoes ({ botoes }) {
88+ function ButtonGroup ({ buttons }) {
8989 " use memo" ;
9090 // ...
9191}
@@ -113,26 +113,26 @@ module.exports = {
113113#### Modo de anotação {/* annotation-mode-example* /}
114114``` js
115115// ✅ Otimizado com "use memo"
116- function CartaoProduto ({ produto }) {
116+ function ProductCard ({ product }) {
117117 " use memo" ;
118118 // ...
119119}
120120
121121// ❌ Não otimizado (sem diretiva)
122- function ListaProdutos ({ produtos }) {
122+ function ProductList ({ products }) {
123123 // ...
124124}
125125```
126126
127127#### Modo infer (padrão) {/* infer-mode-example* /}
128128``` js
129129// Automaticamente memorizado porque este é nomeado como um Componente
130- function DashboardComplexo ({ data }) {
130+ function ComplexDashboard ({ data }) {
131131 // ...
132132}
133133
134134// Ignorado: Não é nomeado como um Componente
135- function exibicaoSimples ({ texto }) {
135+ function simpleDisplay ({ text }) {
136136 // ...
137137}
138138```
@@ -154,4 +154,4 @@ Para confirmar que seu componente está sendo otimizado:
154154
155155* [ ` "use no memo" ` ] ( /reference/react-compiler/directives/use-no-memo ) - Desativar compilação
156156* [ ` compilationMode ` ] ( /reference/react-compiler/compilationMode ) - Configurar comportamento de compilação
157- * [ React Compiler] ( /learn/react-compiler ) - Guia de introdução
157+ * [ React Compiler] ( /learn/react-compiler ) - Guia de introdução
0 commit comments