Optimasi Kecepatan Loading Time Web Template Dengan Implementasi Teknik Front-End
Authors: Yusuf F Akhmad , Nuryasin Ilyas , Sari Zamah 
Published: February 2021

AbstrakSitus web merupakan sekumpulan dokumen Hypertext Markup Language (HTML) statis yang dibangun untuk memudahkan setiap orang berbagi informasi, selama terhubung ke dalam jaringan internet. Salah satu bagian dari sistem sebuah situs web adalah web template. Web template adalah komponen dasar dari sistem web template berguna untuk memudahkan pengembang web merancang ulang sebuah halaman web. Salah satu yang mempengaruhi kinerja halaman web yaitu loading time, dimana loading time adalah waktu yang dibutuhkan oleh browser agar dapat menampilkan halaman web secara menyeluruh oleh pengguna ketika pengguna melakukan request, selain itu loading time merupakan salah satu bagian penting dari optimasi situs web. Optimasi merupakan suatu proses dimana memodifikasi atau merubah sesuatu yang telah ada agar efektifitasnya meningkat. Dalam sebuah situs web, terdapat beberapa konsep dalam optimasi, yaitu First Paint, Time To Interactivity (TTI), First Meaningful Paint (FMP) dan Long Task. Berdasarkan penelitian-penelitian yang sudah ada, diketahui bahwa optimasi loading time web dapat dilakukan dari sisi front-end. Oleh karena itu pada penelitian ini melakukan teknik optimasi dengan menggunakan critical rendering path, above the fold, priority resource, bundle and minify, gzip, dan splitting code. Hasil dari peforma web berdasarkan metriks first meaningful paint (FMP), first contetful paint (FCP), dan time to interactivity (TTI) mengalami peningkatan rata-rata kecepatan (perosentase) yaitu FMP sebesar 73%, FCP sebesar 60%, TTI sebesar 50%, dan loading time sebesar 29%. Selanjutnya, pada resource file rata-rata ukuran file menurun sebesar 59% dan jumlah request file menurun sebesar 21%.AbstractWebsite is a collection of HTML documents that are built to make it easy for everyone to share information, as long as they are connected to the internet. One part of a website system is a web template. Web templates are the basic components of a web template system useful for making it easy for web developers to redesign a web page. One that affects the performance of web pages is loading time, where loading time is the time needed by the browser to be able to display the web page as a whole by the user when the user makes a request, besides that loading time is one important part of website optimization. Optimization is a process where modifying or changing something that already exists in order to increase its effectiveness. In a website, there are several concepts in optimization, namely First Paint, Time To Interactivity, and First Meaningful Paint Based on existing research, it is known that web loading time optimization can be done from the front-end side. Therefore, in this study, optimization techniques using critical rendering path, above the fold, priority resources, bundle and minify, gzip, and splitting code. The implementation of matrics first meaningful paint (FMP), first contetful paint (FCP), dan time to interactivity (TTI) make increase average of speed FMP as 73%, FCP as 60%, TTI as 50%, and loading time as 29%. And then average of resource file decrease as 59% and total file of request decrease as 21%.