Analysis of modern optimization methods in "React"

Cover Page

Cite item

Full Text

Abstract

The article presents a comprehensive analysis of performance optimization methods for React applications: memoization (React.memo, useMemo, useCallback), list virtualization (react window, react virtualized), code splitting (React.lazy, Suspense), optimizing the Context API, and new capabilities of React 18 (automatic batching, Concurrent Mode). The analysis and performance data are based on various existing scientific research as well as the documentation of the optimization methods themselves. Developers are recommended to use the React Profiler API and Chrome Performance for measuring the performance of React applications. A test SPA with dynamic data filtering and three rendering options has been developed. Using the React Profiler API, the processing time for 1,000 to 20,000 elements was measured ten times, followed by statistical processing. The methodology includes a comprehensive theoretical analysis, an examination of the mechanisms of various optimization methods, and their impact on performance. The scientific novelty of the article lies in the comprehensive analysis and practical comparison of key approaches to optimization within the React framework. The practical significance of the work is justified by the fact that the results can be directly used in commercial software development. Additionally, the article conducts an experimental comparison of list virtualization libraries using a computer experiment, followed by statistical analysis. The results showed that react window provides up to a 95% increase in speed and stability under increasing load, while react virtualized offers enhanced functionality at the cost of slightly higher latency, as confirmed by other studies. The article contains not only a theoretical description but also practical examples that reveal optimization methods in real applications, which confirms its practical significance.

References

  1. Iseal, S. Edge Computing and React: Enhancing Performance at the Edge. – 2025. – С. 24.
  2. Сугаипов, С. А. А., Гериханов, З. А. Оптимизация веб-разработки с помощью React, Angular и Vue // Тенденции развития науки и образования. – 2023. – № 98-10. – С. 141-143. – doi: 10.18411/trnio-06-2023-565. – EDN HYNKWA.
  3. Veeranjaneyulu, V. Performance Optimization Techniques in React Applications: A Comprehensive Analysis // International Journal of Research in Computer Applications and Information Technology. – 2024. – Т. 7, № 2. – С. 1165-1177.
  4. Савкин, С. С., Логвинов, Д. В. Оптимизационные возможности JavaScript-библиотеки REACT 18 // Вызовы глобализации и развитие цифрового общества в условиях новой реальности: сборник материалов IV Международной научно-практической конференции, Москва, 19 декабря 2022 года. – Москва: Алеф, 2022. – С. 126-129. – doi: 10.34755/IROK.2022.97.75.019. – EDN ALNIUP.
  5. Чэнь, К. Improving Front-end Performance through Modular Rendering and Adaptive Hydration (MRAH) in React Applications. – 2025. – Режим доступа: https://arxiv.org/abs/2504.03884, свободный.
  6. Toprak, Ahmet, Toprak, Feyzanur. Improving and Optimizing React Web Applications: Strategies and Techniques. – 2025. – С. 17.
  7. Пирюшов, А. С., Пирюшов, М. С. Сравнительный анализ времени рендеринга компонентов при использовании различных инструментов управления состояниями в React-приложениях // Международный журнал информационных технологий и энергоэффективности. – 2024. – Т. 9, № 3(41). – С. 79-87. – EDN KPOFLF.
  8. Ким, А. Оптимизация ре-рендеринга компонентов инструментами React // Научно-технические инновации и веб-технологии. – 2022. – № 1. – С. 4-10. – EDN JHYSXA.
  9. Dudak, A. Optimization of loading and performance in SPA on React // Тенденции развития науки и образования. – 2024. – № 116-19. – С. 183-187. – doi: 10.18411/trnio-12-2024-899. – EDN JJQMMK.
  10. Iseal, S. Performance Benchmarking Techniques for React Applications. – 2025. – С. 14.
  11. Кравцов, Е. П. Разработка высокопроизводительных React-приложений: методы и практики оптимизации // European science. – 2024. – № 1 (69).
  12. Яровая, Е. В. Нестандартные архитектура в написание веб приложений // Столыпинский вестник. – 2022.
  13. Dubaj, S., Pańczyk, B. Comparative of React and Svelte programming frameworks for creating SPA web applications // Journal of Computer Sciences Institute. – 2022. – Т. 25. – С. 345-349. – doi: 10.35784/jcsi.3020. – EDN AYUSVM.
  14. Karić, A., Durmić, N. Comparison of JavaScript Frontend Frameworks-Angular, React, and Vue // International Journal of Innovative Science and Research Technology (IJISRT). – 2024. – С. 1383-1390. – doi: 10.38124/ijisrt/ijisrt.
  15. Kasenda, R., Tenda, J., Iman, E., Manantung, J., Moekari, Z., Pantas, M. The Role and Evolution of Frontend Developers in the Software Development Industry // Jurnal Syntax Admiration. – 2024. – Т. 5. – С. 5191-5196. – doi: 10.46799/jsa.v5i11.1852.
  16. Karka, Narender. Front-End Performance Optimization: A Comprehensive Guide // International Journal of Scientific Research in Computer Science, Engineering and Information Technology. – 2025. – Т. 11. – С. 83-100. – doi: 10.32628/CSEIT251112389.
  17. Mathew, Prakash. Front-End Performance Optimization for Next-Generation Digital Services // Journal of Computer Science and Technology Studies. – 2025. – Т. 7. – С. 993-1000. – doi: 10.32996/jcsts.2025.7.4.111.
  18. Yan, Fenglong, Xu, Zhao, Zhong, Yu, HaiBei, Zhang, Ge, Chang. Research on Performance Optimization Scheme for Web Front-End and Its Practice. – 2021. – doi: 10.1007/978-981-15-8411-4_118.
  19. Saks, E. JavaScript frameworks: Angular vs React vs Vue. – 2019.
  20. Paakkanen, J. Upcoming JavaScript Web Frameworks and Their Techniques. – LUT University, 2022. – 62 с.

Supplementary files

Supplementary Files
Action
1. JATS XML
Download

Согласие на обработку персональных данных

 

Используя сайт https://journals.rcsi.science, я (далее – «Пользователь» или «Субъект персональных данных») даю согласие на обработку персональных данных на этом сайте (текст Согласия) и на обработку персональных данных с помощью сервиса «Яндекс.Метрика» (текст Согласия).