File HAR (HTTP Archive) adalah format yang digunakan untuk mendokumentasikan interaksi antara browser dan server saat memuat halaman web. Dokumen ini memuat informasi terperinci tentang setiap permintaan HTTP yang dilakukan oleh browser, termasuk waktu pemuatan, status respons, dan ukuran file yang diminta. Dengan mempelajari file HAR, Anda dapat mengevaluasi performa situs web, menemukan masalah yang mungkin ada, dan melakukan perbaikan yang diperlukan.

Mengenal File HAR

Definisi dan Struktur File

File HAR, yang merupakan singkatan dari HTTP Archive, adalah format yang menggunakan JSON untuk menyimpan data mengenai kegiatan jaringan yang terjadi saat sebuah halaman web dimuat. Dokumen ini dihasilkan oleh alat pengembang di berbagai jenis browser, seperti Google Chrome, Mozilla Firefox, dan Microsoft Edge, ketika pengguna merekam aktivitas jaringan. Melalui file ini, kamu bisa melihat semua permintaan HTTP yang dikirimkan oleh browser serta respons yang diterima dari server.

Struktur File

File ini dibangun dengan baik dan terbagi menjadi beberapa komponen utama, antara lain:

1. Log: Ini adalah bagian inti dari file HAR yang menyimpan semua data yang berkaitan dengan permintaan dan respons.
2. Version: Menyatakan versi format yang digunakan. Contoh: “1. 2”.
3. Creator: Memuat informasi mengenai perangkat yang digunakan untuk membuat HAR, termasuk nama dan versi dari perangkat tersebut. Sebagai contoh, jika file dihasilkan dengan menggunakan Google Chrome, maka bagian ini akan menunjukkan “Chrome” dan versi yang relevan.
4. Browser: Informasi mengenai peramban yang dipakai untuk merekam aktivitas, serupa dengan bagian creator.
5. Entries: Ini menjadi bagian paling penting dalam HAR, di mana setiap entri merepresentasikan satu permintaan HTTP. Setiap entri menyimpan informasi rinci, termasuk:

• • Started DateTime: Waktu ketika permintaan dimulai.
  • Time: Jumlah waktu yang digunakan untuk menyelesaikan permintaan, mencakup waktu menunggu, pengambilan informasi, dan proses rendering.
  • Request: Informasi tentang permintaan yang diajukan, termasuk URL, metode (GET, POST, dan lain-lain), header, dan body (jika ada).
  • Response: Informasi mengenai tanggapan yang diterima dari server, termasuk kode status (seperti 200 untuk berhasil, 404 untuk tidak ditemukan), header, dan body (jika tersedia).
  • Timings: Informasi lebih mendetail tentang berbagai tahap dalam siklus hidup permintaan, seperti waktu pencarian DNS, waktu untuk koneksi, waktu untuk pengiriman, dan waktu untuk pengambilan.

Sejarah dan Perkembangan

Format ini dirancang agar para pengembang dan analis situs web dapat dengan mudah mencatat dan mengkaji kinerja situs mereka. Seiring dengan bertambahnya kompleksitas aplikasi web dan kebutuhan untuk memahami hubungan dalam jaringan, dokumen ini menjadi suatu instrumen yang krusial dalam peningkatan performa situs. Dokumen ini mula-mula dikenalkan oleh alat pengembang di dalam browser, dan sejak saat itu telah digunakan secara luas oleh berbagai alat untuk menganalisis kinerja web, termasuk Google PageSpeed Insights dan GTmetrix.

Fungsi File HAR

File HAR (HTTP Archive) memiliki sejumlah fungsi yang bermanfaat dalam pengembangan dan evaluasi situs web. Berikut adalah bebCArerapa fungsi pokok dari berkas ini:

1. Analisis Performa Website

Salah satu kegunaan utama file HAR adalah untuk mengevaluasi kinerja situs web. Dengan mencatat semua permintaan dan jawaban HTTP, file HAR memberikan data rinci mengenai waktu yang dibutuhkan untuk memuat halaman. Beberapa aspek yang bisa dianalisis meliputi:

• Waktu Respon: File HAR memungkinkan Anda untuk mengetahui durasi yang diperlukan setiap permintaan untuk menerima respons dari server. Ini bermanfaat untuk menemukan permintaan yang lambat atau kurang efisien.
• Ukuran Sumber Daya: Anda dapat memeriksa ukuran setiap file yang diunduh (seperti gambar, CSS, dan JavaScript), sehingga bisa mengenali file-file besar yang mungkin menghambat proses pemuatan halaman.
• Peringkat Waktu: Dengan data mengenai waktu yang dihabiskan untuk setiap fase dalam siklus hidup permintaan (contohnya pencarian DNS, koneksi, dan pengambilan data), Anda bisa mengidentifikasi bagian mana dari proses yang perlu dioptimalkan.

2. Troubleshooting Masalah Jaringan

File ini sangat bermanfaat untuk mengatasi masalah yang berhubungan dengan jaringan. Beberapa cara untuk memanfaatkannya adalah:

• Mendeteksi Kesalahan: Jika sebuah halaman web tidak terbuka dengan baik atau mengalami masalah, file ini bisa memberikan rincian mengenai status kode respons HTTP (seperti 404, 500) yang menunjukkan jenis kesalahan yang sedang terjadi.
• Memeriksa Permintaan yang Gagal: Dengan menganalisis permintaan yang tidak berhasil dan rincian responsnya, Anda dapat menemukan sumber masalah, apakah itu berasal dari server atau hal lainnya.
• Menganalisis Latensi: File ini memudahkan Anda untuk melacak latensi dalam komunikasi antara browser dan server, sehingga dapat diketahui dimana terjadi penundaan.

3. Pengumpulan Data untuk Pengujian Aplikasi

File ini dapat dimanfaatkan dalam uji coba aplikasi berbasis web. Beberapa keuntungan yang didapat antara lain:

• Reproduksi Masalah: Dengan menyimpan sesi yang memiliki masalah dalam format file HAR, pengembang dapat dengan mudah mengulang situasi tersebut untuk analisis lebih mendalam.
• Automasi Pengujian: Sejumlah alat uji otomatis dapat memanfaatkan file HAR untuk meniru permintaan yang telah disimpan, sehingga mengurangi kebutuhan untuk membuat skrip pengujian secara manual.
• Penyusunan Laporan: File ini dapat digunakan untuk menyusun laporan mengenai kinerja, memberikan wawasan berharga bagi tim pengembang mengenai bagaimana situs bekerja di bawah kondisi tertentu.

4. Benchmarking

File ini dapat dimanfaatkan untuk mengukur kinerja situs web dalam berbagai situasi. Dengan melakukan perbandingan terhadap berkas yang diperoleh dari berbagai tes atau versi situs, Anda dapat menemukan informasi mengenai perubahan kinerja dari waktu ke waktu atau setelah menerapkan modifikasi tertentu.

5. Analisis Keamanan

File ini juga bisa berguna untuk evaluasi keamanan. Dengan memeriksa permintaan yang dibuat, Anda dapat mengenali:

• Permintaan Tidak Valid: Mengidentifikasi apakah terdapat permintaan yang mencurigakan atau yang seharusnya tidak dilakukan oleh pengguna.
• Potensi Kerentanan: Mengkaji informasi yang ditransmisikan melalui permintaan dan respons untuk menemukan kemungkinan titik lemah dalam keamanan.

Cara Membuat File HAR

Proses pembuatan file HAR (HTTP Archive) cukup mudah dan bisa dilakukan dengan menggunakan alat pengembang yang ada di berbagai browser modern. Berikut adalah langkah-langkah yang terperinci dan teratur untuk menangkap aktivitas jaringan dan menghasilkan file ini melalui browser populer seperti Google Chrome, Mozilla Firefox, dan Microsoft Edge.

1. Membuat HAR di Google Chrome

Langkah 1: Buka Developer Tools

• Cara: Klik kanan pada halaman web dan pilih Inspect, atau tekan Ctrl + Shift + I (Windows) atau Cmd + Option + I (Mac).

Langkah 2: Navigasi ke Tab Network

• Cara: Di panel developer tools, pilih tab Network. Di sinilah semua permintaan HTTP akan terlihat.

Langkah 3: Aktifkan Perekaman

• Cara: Pastikan tombol perekaman (ikon lingkaran merah di kiri atas tab Network) dalam keadaan aktif. Jika belum, klik ikon tersebut untuk memulai perekaman.

Langkah 4: Muat Ulang Halaman

• Cara: Tekan F5 atau klik ikon refresh di browser untuk merekam semua permintaan yang terjadi saat halaman dimuat ulang.

Langkah 5: Lakukan Interaksi (Jika Diperlukan)

• Cara: Jika Anda ingin merekam interaksi tambahan (seperti mengklik tombol atau tautan), silakan lakukan tindakan tersebut setelah halaman dimuat ulang.

Langkah 6: Simpan File 

• Cara: Setelah semua permintaan yang diinginkan telah direkam, klik kanan di area daftar permintaan dan pilih Save all as HAR with content. Pilih tempat penyimpanan dan klik Save.

2. Membuat HAR di Mozilla Firefox

Langkah 1: Akses Developer Tools

• Cara: Klik kanan di halaman dan pilih Inspect Element, atau tekan Ctrl + Shift + I (Windows) atau Cmd + Option + I (Mac).

Langkah 2: Navigasi ke Tab Network

• Cara: Di panel developer tools, pilih tab Network.

Langkah 3: Aktifkan Perekaman

• Cara: Tekan ikon lingkaran merah untuk memulai proses perekaman.

Langkah 4: Muat Ulang Halaman

• Cara: Refresh halaman untuk menangkap semua permintaan yang terjadi.

Langkah 5: Lakukan Interaksi (Jika Diperlukan)

• Cara: Lakukan aksi tambahan yang ingin dicatat, seperti mengklik tautan.

Langkah 6: Simpan File

• Cara: Setelah selesai merekam, tekan ikon menu (tiga titik vertikal di sudut kanan atas panel Network) dan pilih Save All As HAR. Pilih lokasi untuk menyimpan file dan klik Save.

3. Membuat HAR di Microsoft Edge

Langkah 1: Buka Developer Tools

• Cara: Klik kanan pada tampilan dan pilih Periksa atau tekan Ctrl + Shift + I (Windows).

Langkah 2: Navigasi ke Tab Network

• Cara: Pilih tab Network di panel developer tools.

Langkah 3: Aktifkan Perekaman

• Cara: Tekan ikon lingkaran merah untuk memulai perekaman.

Langkah 4: Muat Ulang Halaman

• Cara: Refresh halaman untuk menangkap semua permintaan yang terjadi.

Langkah 5: Lakukan Interaksi (Jika Diperlukan)

• Cara: Lakukan interaksi tambahan jika diperlukan.

Langkah 6: Simpan File

• Cara: Klik kanan pada daftar permintaan dan pilih Save all as HAR with content. Pilih lokasi penyimpanan untuk file tersebut dan klik Save.

File HAR: Alat Efektif untuk Menganalisis Kinerja Website

File HAR (HTTP Archive) adalah instrumen yang sangat bermanfaat untuk menilai kinerja situs web, mengidentifikasi masalah jaringan, serta melakukan pengujian aplikasi. Dengan merekam setiap permintaan dan respons HTTP, dokumen ini menyajikan informasi yang mendalam mengenai waktu pemuatan, ukuran sumber daya, dan kesalahan yang muncul saat membuka suatu halaman. Pembuatan file ini juga terbilang mudah, bisa dilakukan melalui alat pengembang di berbagai peramban seperti Google Chrome, Mozilla Firefox, dan Microsoft Edge.