Dino Geek essaye de t'aider

Comment fonctionne le batching des mises à jour du state dans Reactjs ?


Batching est une méthode utilisée par React pour plusieurs mises à jour de l’état en une seule fois, pour améliorer les performances de l’application. Pour comprendre comment cela fonctionne, il est essentiel de connaître le mode de travail de React.

React utilise un modèle appelé “Reconciliation” pour déterminer quelles parties de l’interface utilisateur ont besoin d’être mises à jour.

Lorsque vous appelez setState à plusieurs reprises, React ne met pas à jour immédiatement l’interface utilisateur. Au lieu de cela, il ajoute toutes ces mises à jour d’état à une file d’attente. Cette technique est appelée “Batching”.

Cela signifie que React ne mettra à jour le DOM réel qu’une seule fois au lieu de plusieurs fois, ce qui améliorera les performances de l’application et maximisera l’efficacité.

React résout la file d’attente de traitement lorsqu’il a terminé avec l’exécution du code en cours ou lorsqu’il a fini avec les événements de navigateur.

Normalement, React batche les mises à jour qui se produisent à l’intérieur des gestionnaires d’événements React et les méthodes de cycle de vie. Mais si vous appelez setState en dehors des gestionnaires d’événements React, les mises à jour peuvent ne pas être batchées.

Cela peut être réglé en encapsulant le setState dans React.unstable\_batchedUpdates().

```
React.unstable_batchedUpdates(() => { this.setState({name: ‘John’}); this.setState({surname: ‘Doe’});
});
```

Dans cet exemple, même si setState est appelé deux fois, React mettra à jour le DOM une seule fois avec les deux mises à jour d’état batchées.

Cependant, gardez à l’esprit que React.unstable\_batchedUpdates() est marqué comme instable parce qu’il fait partie de l’API interne de React et pourrait changer dans le futur.

En résumé, le batching est une technique utilisée par React pour améliorer les performances de l’application en mettant à jour le DOM moins fréquemment et en mettant en batch plusieurs mises à jour d’état.


Générez simplement des articles pour optimiser votre SEO
Générez simplement des articles pour optimiser votre SEO





DinoGeek propose des articles simples sur des technologies complexes

Vous souhaitez être cité dans cet article ? Rien de plus simple, contactez-nous à dino@eiki.fr

CSS | NodeJS | DNS | DMARC | MAPI | NNTP | htaccess | PHP | HTTPS | Drupal | WEB3 | LLM | Wordpress | TLD | Nom de Domaine | IMAP | TCP | NFT | MariaDB | FTP | Zigbee | NMAP | SNMP | SEO | E-Mail | LXC | HTTP | MangoDB | SFTP | RAG | SSH | HTML | ChatGPT API | OSPF | JavaScript | Docker | OpenVZ | ChatGPT | VPS | ZIMBRA | SPF | UDP | Joomla | IPV6 | BGP | Django | Reactjs | DKIM | VMWare | RSYNC | Python | TFTP | Webdav | FAAS | Apache | IPV4 | LDAP | POP3 | SMTP

| Whispers of love (API) | Déclaration d'Amour |






Mentions Légales / Conditions Générales d'Utilisation