Lompat ke konten
Aback Tools Logo

Analisis Berat Halaman HTML

Tempel dokumen HTML apa pun untuk menganalisis berat totalnya secara online dan gratis. Analisis berat halaman HTML kami merinci CSS inline, JavaScript inline, gambar base64, SVG inline, komentar HTML, dan spasi - dengan estimasi kompresi GZIP dan Brotli serta rekomendasi optimasi yang praktis. Semua analisis berlangsung di browser Anda. Tidak perlu pendaftaran.

HTML Page Weight Analyzer

Paste any HTML document to analyze its total weight - broken down by inline CSS, inline JavaScript, base64 images, inline SVGs, comments, and whitespace. Shows GZIP and Brotli compression estimates and actionable optimization recommendations. All analysis happens locally in your browser.

Load sample:
1530 bytes

Mengapa Menggunakan Analisis Berat Halaman HTML Kami?

  • Analisis Berat Halaman HTML Instan: Analisis berat halaman HTML seketika di browser Anda - tanpa unggahan ke server, tanpa pemrosesan cloud. Analisis kami merinci CSS inline, JS inline, gambar base64, SVG, komentar, dan spasi secara real time.
  • Analisis Berat Halaman HTML Online yang Aman: Kode sumber HTML Anda tidak pernah meninggalkan perangkat saat dianalisis. Pemrosesan 100% di sisi klien berarti privasi penuh - tanpa penyimpanan cloud, tanpa log server, tanpa paparan kode sumber.
  • Analisis Berat Halaman HTML - Tanpa Instalasi: Analisis berat halaman HTML langsung di browser tanpa unduhan perangkat lunak, plugin, atau akun. Berfungsi di browser modern apa pun dan sistem operasi apa pun - tanpa pendaftaran.
  • Estimasi Kompresi GZIP & Brotli: Lihat perkiraan ukuran terkompresi GZIP dan Brotli di samping berat mentah HTML - dengan perbandingan bilah visual. Analisis juga mendaftar semua sumber daya eksternal dan jumlah permintaan HTTP-nya.

Kasus Penggunaan Umum Analisis Berat Halaman HTML

  • Optimasi Core Web Vitals & LCP: Analisis berat halaman HTML untuk mengidentifikasi apa yang membuat Largest Contentful Paint (LCP) Anda lambat. Blok CSS dan JS inline yang besar serta gambar base64 menambah ukuran transfer HTML dan menunda render pertama.
  • Peningkatan Skor PageSpeed Insights: Gunakan analisis berat halaman HTML untuk menemukan dan memperbaiki peringatan PageSpeed "Reduce initial server response time" dan "Avoid large network payloads". Analisis menunjukkan persis konten inline mana yang menambah berat.
  • Perencanaan Minifikasi HTML: Kenali berapa banyak penghematan dari menghapus spasi dan komentar sebelum menjalankan minifier HTML. Analisis menunjukkan estimasi penghematan dari minifikasi bersama estimasi kompresi GZIP dan Brotli.
  • Optimasi Server-Side Rendering (SSR): Analisis keluaran HTML Next.js, Nuxt, atau framework SSR lain untuk mengenali payload hasil render server yang membengkak. Blok data JSON inline yang besar dan payload hidrasi adalah masalah berat SSR yang umum.
  • Analisis Berat Template Email: Analisis template email HTML untuk masalah berat - klien email punya batas ukuran ketat (Gmail memotong email di atas 102 KB). Analisis mengenali CSS inline, gambar base64, dan penyumbang berat lainnya.
  • Audit Performa Halaman E-Commerce: Analisis HTML halaman produk untuk mengenali masalah berat sebelum memengaruhi tingkat konversi. Skrip inline yang besar, foto produk base64, dan sumber daya eksternal yang berlebihan adalah hambatan performa e-commerce yang umum.

Apa Itu Berat Halaman HTML?

Berat halaman HTML adalah ukuran byte total dokumen HTML yang ditransfer dari server ke browser. Ini mencakup struktur HTML mentah, CSS inline (tag <style>), JavaScript inline (tag <script> tanpa src), gambar berkode base64, SVG inline, komentar HTML, dan spasi. Analisis berat halaman HTML kami memakai API DOMParser native browser untuk mengurai HTML dan mengukur kontribusi setiap komponen terhadap berat total - memberi Anda rincian tepat ke mana byte dipakai.

Cara Kerja Analisis Berat Halaman HTML Kami

  1. 1. Tempel HTML Anda: Tempel dokumen HTML apa pun - halaman penuh, komponen, atau template email. Penghitung byte diperbarui secara real time saat Anda mengetik. Semua analisis berlangsung lokal di browser Anda - kode sumber HTML tidak pernah meninggalkan perangkat.
  2. 2. Klik "Analisis Berat Halaman": Analisis memakai DOMParser browser untuk mengurai HTML dan mengekstrak CSS inline, JS inline, gambar base64, SVG, komentar, dan referensi sumber daya eksternal. Ia menghitung ukuran byte setiap komponen dan memperkirakan ukuran terkompresi GZIP dan Brotli.
  3. 3. Tinjau rincian dan rekomendasi: Hasilnya menampilkan ringkasan berat dengan estimasi GZIP/Brotli, rincian per kategori dengan bilah visual, daftar sumber daya eksternal, serta rekomendasi optimasi yang praktis beserta estimasi penghematannya.

Apa yang Dianalisis

  • CSS Inline: Konten di dalam tag <style> - diukur dalam byte. Blok CSS inline yang besar sebaiknya dipindahkan ke stylesheet eksternal agar bisa di-cache browser.
  • JavaScript Inline: Konten di dalam tag <script> tanpa atribut src. Skrip inline yang besar memblokir rendering dan sebaiknya dipindahkan ke file eksternal.
  • Gambar Base64: Gambar yang disematkan sebagai URI data: - pengodean base64 menambah ~33% overhead dibanding biner. Gunakan URL gambar eksternal untuk gambar di atas 1 KB.
  • Komentar & Spasi HTML: Komentar dan spasi berlebih dihapus oleh minifier HTML - analisis menunjukkan seberapa besar kontribusinya terhadap berat total.

Keterbatasan Penting

Analisis berat halaman HTML hanya mengukur berat dokumen HTML - ia tidak mengunduh atau mengukur sumber daya eksternal (file CSS, bundel JS, gambar). Estimasi GZIP dan Brotli adalah perkiraan berdasarkan rasio kompresi teks tipikal - kompresi sebenarnya bergantung pada entropi konten. Analisis memakai DOMParser browser, yang dapat menormalkan sebagian HTML (misalnya menambahkan tag penutup yang hilang) - tempel HTML persis seperti yang disajikan server Anda untuk pengukuran akurat.

Pertanyaan yang Sering Diajukan

Analisis berat halaman HTML mengukur ukuran byte dokumen HTML dan merincinya per komponen - CSS inline, JavaScript inline, gambar base64, SVG, komentar, dan spasi. Alat online gratis kami bekerja sepenuhnya di browser Anda.

HTML adalah sumber daya pertama yang diunduh browser - ia memblokir rendering hingga diterima sepenuhnya. Dokumen HTML yang besar menunda First Contentful Paint (FCP) dan Largest Contentful Paint (LCP). Google menyarankan menjaga HTML di bawah 100 KB tanpa kompresi.

Google menyarankan menjaga HTML di bawah 100 KB tanpa kompresi untuk Core Web Vitals yang optimal. Dengan kompresi GZIP, dokumen HTML 100 KB biasanya ditransfer sekitar ~35 KB. Gmail memotong email HTML di atas 102 KB.

Tentu saja. Analisis kami memproses semuanya secara lokal di browser Anda memakai API DOMParser. Kode sumber HTML Anda tidak pernah diunggah ke server mana pun, tidak pernah disimpan, dan tidak pernah meninggalkan perangkat Anda.

Ya - 100% gratis, selamanya. Tanpa pendaftaran, tanpa akun, tanpa paket premium, tanpa batas ukuran file, dan tanpa iklan yang mengganggu alur kerja Anda.

CSS dan JavaScript inline tidak dapat di-cache oleh browser - keduanya diunduh ulang setiap kali halaman dimuat. File CSS dan JS eksternal di-cache setelah kunjungan pertama. Skrip inline juga memblokir parsing HTML dan menunda rendering.

Pengodean base64 menambah sekitar 33% overhead pada data biner - gambar 10 KB menjadi ~13,3 KB saat dikodekan base64. Gambar base64 juga tidak dapat di-cache terpisah dari dokumen HTML.

Estimasi memakai rasio kompresi tipikal untuk konten HTML (GZIP ~65% pengurangan, Brotli ~72% pengurangan). Kompresi sebenarnya bergantung pada entropi dan pengulangan konten.

Tidak - analisis berat halaman HTML hanya mengukur berat dokumen HTML. Ia mendaftar URL sumber daya eksternal dan menghitung permintaan HTTP, tetapi tidak mengunduh atau mengukur ukuran file eksternal.