+ Outil de Performance React
+ + 🏆 Nominé pour les React Open Source Awards 2020 +
+
+ Outil de Performance React
+
+
+
Sur la page principale, vous disposez de deux choix principaux depuis le menu déroulant :
+ +- **Timejump** : Consultez et naviguez dans l’historique des snapshots de l’état de votre application. Vous pouvez revenir à n’importe quel point dans le temps pour observer l’évolution de l’état au fil des modifications. Vous pouvez également utiliser le bouton de lecture pour rejouer chaque changement d’état automatiquement. +- **Providers / Consumers** : Comprenez mieux les dépendances de contexte de votre application et leurs interactions grâce à une visualisation des relations entre fournisseurs et consommateurs. +
+
+
+
+
+
+
+
+
+
Pada halaman utama, terdapat dua pilihan utama di panel dropdown:
+ +- **Timejump**: Melihat dan menavigasi riwayat snapshot state aplikasi Anda. Anda dapat melompat ke titik mana pun dalam waktu untuk melihat bagaimana state berubah di setiap perubahan. Anda juga dapat menggunakan tombol play untuk memutar ulang setiap perubahan state secara otomatis. +- **Providers / Consumers**: Memahami dependensi context aplikasi Anda dan bagaimana elemen-elemen tersebut berinteraksi, melalui visualisasi hubungan provider dan consumer. +
+
+
+
+
+
+
+
+
+
On the main page, there are two main selections from the dropdown panel:
+ +- **Timejump**: View and navigate through the snapshot history of your application's state. You can jump to any point in time to see how the state evolves across changes. You can also use the play button to replay each state change automatically. +- **Providers / Consumers**: Understand your application's context dependencies and their interactions better through visualizing its provider and consumer relationships. +
+
+
+
+
+
+
+ Инструмент для анализа производительности React
+
+
+
На главном экране доступны два основных выбора из выпадающего списка:
+ +- **Timejump**: Просматривайте и перемещайтесь по истории снимков состояния (snapshot) вашего приложения. Можно переместиться в любую точку во времени, чтобы увидеть, как состояние эволюционировало при изменениях. Также доступна кнопка воспроизведения, чтобы автоматически проиграть каждое изменение состояния. +- **Providers / Consumers**: Глубже понимайте зависимости контекста приложения и его взаимодействия, визуализируя отношения провайдеров и потребителей. +
+
+
+
+
+
+
+ "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt + ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation + ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in + reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur + sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id + est laborum." +
++ "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt + ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation + ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in + reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur + sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id + est laborum." +
+{`Render count: ${props.counter}`}
+//+ "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt + ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation + ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in + reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur + sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id + est laborum." +
++ "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt + ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation + ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in + reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur + sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id + est laborum." +
+Welcome, {user.username}!
+ +Please log in:
+ + +You clicked this {useStateCount} times
- * - * - *
- 
-
- 
-
- 
-
-
-
-
-
+ A Note to Developers: Reactime is using the Chrome Debugger API in order to grab the + Accessibility Tree. Enabling this option will allow you to record Accessibility Tree + snapshots, but will result in the Chrome browser notifying you that the Chrome + Debugger has started. +
+Each node is given a property labeled ignored. Nodes read by the screen reader have their ignored property evaluate to false.Nodes not read by the screen reader evaluate to true.
Nodes labeled as no name are visible to a screen reader, but were not given a name label.
Each node is given a property labeled ignored. Nodes read by the screen reader have their ignored property evaluate to false.Nodes not read by the screen reader evaluate to true.
Nodes labeled as no name are visible to a screen reader, but were not given a name label.
+ A Note to Developers: Reactime is using the Chrome Debugger API in order to + grab the Accessibility Tree. Enabling this option will allow you to record + Accessibility Tree snapshots, but will result in the Chrome browser + notifying you that the Chrome Debugger has started. +
++ {props.name} +
+{props.description}
++ Good: + {`< ${props.score[0]}`} +
++ Needs Improvement: + {`< ${props.score[1]}`} +
++ Poor: + {`> ${props.score[1]}`} +
+
+ 
+ 
+