IMPLEMENTASI REACT SERVER COMPONENT DAN SERVER ACTION UNTUK MENINGKATKAN PERFORMA APLIKASI WEB

Yudi Mulyanto; Eka Haryanti; Lazarus  Lazarus

doi:10.46764/teknimedia.v5i1.174

Yudi Mulyanto Informatika, Rekayasa Sistem, Universitas Teknologi Sumbawa
Eka Haryanti Informatika, Rekayasa Sistem, Universitas Teknologi Sumbawa
Lazarus Lazarus Informatika, Rekayasa Sistem, Universitas Teknologi Sumbawa

DOI: https://doi.org/10.46764/teknimedia.v5i1.174

Keywords: Black Box Testing, Extreme Programming, Legislative Elections, React Server Component, Server Action

Abstract

This research explores the use of React Server Components (RSC) and Server Action to improve web application performance, with a focus on the legislative election vote counting system in Sumbawa Regency, West Nusa Tenggara for internal party needs. Looking at the geographical and infrastructural challenges in Sumbawa, this research aims to overcome the limitations of signal and telecommunication infrastructure distribution through the use of RSC and Server Action. RSC allows the server to render components while maintaining interactivity on the client side, reducing load and speeding up load times. Advantages include avoiding chained network requests and minimizing Javascript on the client side, which is especially beneficial in areas with limited internet connectivity. Server Action eliminates the traditional API layer, reducing latency and improving application responsiveness. By utilizing Next.js as a framework, this research aims to maximize the use of server resources and minimize client resource requirements, improving speed in vote counting and reporting. This implementation is expected to not only improve overall application performance but also ensure smooth application accessibility in areas with limited internet infrastructure.

References

[1] M. Thakkar, “Introducing React.js,” pp. 41–91, 2020, doi: 10.1007/978-1-4842-5869-9_2.

[2] A. Javeed, “Performance Optimization Techniques for ReactJS,” 2019 IEEE International Conference on Electrical, Computer and Communication Tech-nologies (ICECCT), pp. 1–5, 2019, doi: 10.1109/ICECCT.2019.8869134.

[3] T. F. Iskandar, M. Lubis, T. F. Kusumasari, and A. R. Lubis, “Comparison between client-side and server-side rendering in the web development,” IOP Conf Ser Mater Sci Eng, vol. 801, 2020, doi: 10.1088/1757-899X/801/1/012136.

[4] “Introducing Zero-Bundle-Size React Server Com-ponents – React.” Accessed: Jan. 02, 2024. [Online]. Available: https://react.dev/blog/2020/12/21/data-fetching-with-react-server-components

[5] M. Madsen, O. Lhoták, and F. Tip, “A Semantics for the Essence of React,” pp. 12:1-12:26, 2020, doi: 10.4230/LIPIcs.ECOOP.2020.12.

[6] A. A. Pushkarev and O. Yakubailik, “A web appli-cation for visualization, analysis, and processing of agricultural monitoring spatial-temporal data,” Spa-tial Data Processing for Monitoring of Natural and Anthropogenic Processes 2021, 2021, doi: 10.25743/sdm.2021.20.11.028.

[7] A. Mlynarski and K. Nurzynska, “Comparative Analysis of JavaScript and Its Extensions for Web Application Optimization,” pp. 539–550, 2017, doi: 10.1007/978-3-319-58274-0_42.

[8] J. Singh, H. Sharma, R. Mishra, S. Hazra, and N. Sukhija, “Movie Review Sentimental Analysis Based on Human Frame of Reference,” Advances in Intelligent Systems and Computing, 2021, doi: 10.1007/978-981-33-4367-2_27.

[9] K. N. Illahi, S. Suhartini, and F. Fajriyah, “IMPLEMENTASI METODE EXTREME PROGRAMMING PADA SISTEM INFORMASI REPOSITORI SKRIPSI DI PERPUSTAKAAN UNIVERSITAS PRABUMULIH”, teknimedia, vol. 4, no. 2, pp. 182 -, Dec. 2023.

[10] M. R. Setyautami, D. Adianto, and A. Azurat, “Modeling multi software product lines using UML,” Proceedings of the 22nd International Systems and Software Product Line Conference - Volume 1, 2018, doi: 10.1145/3233027.3236400.

[11] H. Hendri, J. W. H. Manurung, R. A. Ferian, W. F. Hanaatmoko, and Y. Yulianti, “Pengujian Black Box pada Aplikasi Sistem Informasi Pengelolaan Masjid Menggunakan Teknik Equivalence Parti-tions,” vol. 3, pp. 107–113, 2020, doi: 10.32493/jtsi.v3i2.4694.

[12] K. Qi and B. Boehm, “Detailed Use Case Points (DUCPs): A Size Metric Automatically Countable from Sequence and Class Diagrams,” 2018 IEEE/ACM 10th International Workshop on Model-ling in Software Engineering (MiSE), pp. 17–24, 2018, doi: 10.1145/3193954.3193955.