Improving Universal Rendering Performance on NuxtJS-based Web Application
Harta Angkasa, Darren Farell, Erik Hendrawan Putra Wijaya, Said Achmad, Devi Fitrianah · 2023
Universal rendering is a way to render a website by combining server and client-side rendering. Universal rendering promises to boost the performance and SEO score of the website. However, it can be computationally exhausting for the server. This prompts researchers to address this problem in multiple different environments. Two parameters that could be used to measure the aforementioned metrics are Time to First Byte (Or Latency) and Time to Interactive. This paper addressed the aforementioned problem of universal rendering in a NuxtJS-based web application. JMeter and Lighthouse was used to test each proposed solution’s performance and SEO score. Initially, there are three proposed solutions: lazy loading, SSR caching, and asset compression. This research proves that the aforementioned solutions effectively improve universal rendering performance in NuxtJS version 3.0.0. Each method has its pros and cons. For example, lazy loading and SSR caching are effective for improving the latency score, while asset compression is effective for enhancing the TTI score.