Optimasi Performa React JS Web Application menggunakan Teknik Code Splitting (Studi Kasus: JTI Connect)

Fauzan Pradana

Abstrak

Optimasi kinerja dalam pemrograman web telah mendapat perhatian yang signifikan karena pengguna menuntut waktu muat yang lebih cepat. JTI Connect merupakan sebuah platform dengan target pengguna sebesar 1759 pengguna dengan performa yang masih perlu untuk ditingkatkan. Salah satu cara meningkatkan performa suatu web adalah menggunakan teknik code splitting yang dapat diimplementasikan pada client-side. Oleh karena itu, code splitting diimplementasikan pada JTI Connect untuk mengoptimasi performa pada sisi client. Penelitian ini bertujuan untuk mengetahui cara serta pengaruh optimasi performa React JS pada JTI Connect menggunakan code splitting. Code splitting akan diimplementasikan ke dalam tiga pendekatan, yaitu route-based code splitting, component-based code splitting, serta combined code splitting. Pengujian dilakukan menggunakan Google Lighthouse Dev Tools yang mengukur performa dari setiap pendekatan yang digunakan kemudian membandingkannya dengan performa awal sebelum diimplementasikan code splitting. Beberapa parameter yang digunakan, yaitu FCP, LCP, TBT, CLS, speed index, serta hasil kalkulasi skor Lighthouse yang didapatkan. Hasilnya, pada mode desktop route-based code splitting mendapatkan skor tertinggi dengan peningkatan skor Lighthouse sebesar 17,68%, kemudian combined code splitting dengan peningkatan sebesar 17,30%, serta component-based code splitting yang tidak mengalami peningkatan performa. Sedangkan pada mode mobile, route-based code splitting dan combined code splitting menghasilkan peningkatan yang sama, yaitu sebesar 0,18%, serta component-based code splitting justru mengalami penurunan performa sebesar 0,5%. Berdasarkan hasil yang didapatkan, code splitting pada pendekatan routebased code splitting dan combined code splitting dapat mengoptimasi performa React JS pada JTI Connect web application.

Kata kunci

© 2026 UPA Perpustakaan PolinemaStatus Layanan