Rendering Performance Analysis of Astro JS, Next JS, Nuxt JS, and SvelteKit Frameworks Using Google Lighthouse, PageSpeed Insight, and JMeter

Abstract

The development and popularity of modern technology encourage innovation in developing web applications to increase loading speed and retain users. This research analyzes the performance of websites that use Astro JS, Next JS, Nuxt JS, and SvelteKit frameworks using the SSR (Server Side Rendering) technique. The advantage of the SSR technique is that it can improve website performance, SEO (Search Engine Optimization) optimization, and user experience. The tools used in this research are Google Lighthouse, PageSpeed Insight, and JMeter. The metrics measured in Google Lighthouse and PageSpeed Insight testing are FCP (First Contentful Paint), TBT (Total Blocking Time), SI (Speed Index), LCP (Large Contentful Paint), and CLS (Cumulative Layout Shift). While JMeter testing, the metrics measured are Response Time (Min, Max, Average), Error Rate, and Throughput. The development method used is the XP (Extreme Programming) method. The results of this study show Astro JS has superior performance in most Web Vitals metrics, followed by Next JS which shows superiority in several metrics. Nuxt JS and SvelteKit each only excelled in one Web Vitals metric. In stability and reliability of the system testing using JMeter, Nuxt JS showed the best performance by excelling in the response time, error rate, and throughput metrics. SvelteKit also performed well with dominance in several stability metrics, while Astro JS and Next JS only excelled in a small number of them. This research was conducted to provide insight for developers in choosing the right framework based on their needs.