Kompresor AMP HTML

Kompres halaman AMP HTML dengan menghapus komentar yang tidak sesuai AMP dan spasi berlebih untuk pengiriman AMP yang lebih cepat. Kompresor amp html kami meminifikasi blok <style amp-custom> Anda dan mempertahankan boilerplate AMP wajib persis seperti yang ditentukan. Termasuk pemeriksaan validasi struktur AMP untuk elemen wajib yang hilang. Semua pemrosesan berjalan di browser Anda. Tanpa pendaftaran.

AMP HTML Compressor

Compress AMP HTML pages by removing non-AMP compliant comments and excess whitespace - minifies <style amp-custom> content while preserving the required AMP boilerplate. Includes AMP validation checks. All processing runs locally in your browser.

AMP HTML Input

2.52 KBUpload .html

<!doctype html>
<html ⚡ lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
    <title>My AMP Page</title>
    
    <link rel="canonical" href="https://example.com/my-page">
    <script async src="https://cdn.ampproject.org/v0.js"></script>
    
    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style>
    <noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
    <style amp-custom>
      /* Page styles */
      body {
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
        margin: 0px;
        padding: 0px;
        background-color: #ffffff;
        color: #333333;
      }

.container {
        max-width: 800px;
        margin: 0px auto;
        padding: 16px;
      }

h1 {
        font-size: 2rem;
        font-weight: bold;
        color: #111111;
        margin-bottom: 16px;
      }

/* Article styles */
      .article-body {
        line-height: 1.6;
        font-size: 1rem;
      }
    </style>
    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "Article",
      "headline": "My AMP Article",
      "author": { "@type": "Person", "name": "John Doe" }
    }
    </script>
  </head>
  <body>
    
    <div class="container">
      <h1>Welcome to My AMP Page</h1>

<amp-img
        src="https://example.com/hero.jpg"
        width="800"
        height="400"
        layout="responsive"
        alt="Hero image">
      </amp-img>

<div class="article-body">
        <p>
          This is an AMP page with some content.
          AMP pages load faster because they follow strict rules.
        </p>

<p>
          <a href="https://example.com/more">Read more articles</a>
        </p>
      </div>
    </div>
  </body>
</html>

Compressed AMP HTML Output

Mengapa menggunakan kompresor AMP HTML kami?

Kompresi AMP HTML instan: kompres halaman AMP HTML seketika di browser Anda — tanpa unggahan ke server dan tanpa alat build. Kompresor amp html kami menghapus komentar dan merapatkan spasi sekaligus mempertahankan boilerplate AMP wajib serta blok script.
Kompresor AMP HTML online yang aman: AMP HTML Anda tidak pernah meninggalkan perangkat saat menggunakan kompresor amp html ini. Pemrosesan 100% di sisi klien berarti privasi penuh — tanpa penyimpanan cloud, tanpa log server, dan tanpa mengekspos konten halaman.
Kompresor AMP HTML tanpa instalasi: kompres AMP HTML langsung di browser tanpa paket npm, tanpa alat build, dan tanpa akun. Kompresor amp html gratis ini berfungsi di browser modern mana pun dan sistem operasi apa pun.
Pemeriksaan validasi AMP dan minifikasi gaya: dapatkan peringatan validasi struktur AMP (boilerplate hilang, tautan kanonis, script runtime) serta minifikasi otomatis blok <style amp-custom> Anda — semuanya dalam sekali proses dengan kompresor amp html.

Kasus penggunaan umum kompresor AMP HTML

Optimasi pengiriman halaman AMP: gunakan kompresor amp html sebelum menerapkan halaman AMP untuk mengurangi ukuran yang dikirim server asal Anda. AMP HTML yang lebih kecil mengurangi waktu penguraian dan mempercepat render awal halaman AMP Anda.
Performa cache AMP: gunakan kompresor amp html untuk mengurangi ukuran halaman AMP sebelum di-cache oleh Google AMP Cache. Halaman yang lebih kecil lebih efisien di-cache dan menekan biaya bandwidth saat dilayani dari cdn.ampproject.org.
Alur kerja pengembangan AMP: gunakan kompresor amp html sebagai bagian dari alur pengembangan AMP untuk memeriksa ukuran terkompresi halaman sebelum penerapan. Panel validasi AMP menandai elemen wajib yang hilang lebih awal.
Pengurangan bandwidth CDN dan origin: gunakan kompresor amp html untuk menekan biaya bandwidth saat melayani halaman AMP dari origin Anda. Dengan 100.000 tampilan halaman AMP per hari, mengurangi halaman AMP dari 15 KB menjadi 10 KB menghemat 500 MB bandwidth per hari.
Optimasi untuk penerbit dan situs berita: gunakan kompresor amp html untuk situs berita dan penerbit dengan arsip artikel AMP yang besar. Mengompres AMP HTML ribuan artikel menekan biaya penyimpanan dan bandwidth dalam skala besar.
Kompresi AMP Email: gunakan kompresor amp html untuk halaman AMP for Email — mengurangi ukuran HTML membantu tetap dalam batas ukuran klien email dan mempercepat render di Gmail serta klien email lain yang kompatibel dengan AMP.

Apa itu kompresi AMP HTML?

Kompresi AMP HTML adalah proses mengurangi ukuran dokumen HTML AMP (Accelerated Mobile Pages) dengan menghapus karakter yang tidak perlu — komentar, spasi berlebih, dan atribut berulang — sekaligus mempertahankan struktur AMP wajib secara ketat. Kompresor amp html kami menerapkan aturan kompresi yang sadar AMP: menghapus komentar HTML, merapatkan spasi antar tag, dan meminifikasi blok <style amp-custom>, tetapi mempertahankan <style amp-boilerplate> persis seperti yang diwajibkan spesifikasi AMP dan melindungi semua blok <script> dari perubahan.

Cara kerja kompresor AMP HTML kami

1 Tempel atau unggah AMP HTML Anda: masukkan HTML halaman AMP Anda di area masukan atau unggah file .html. Kompresor amp html menerima AMP HTML apa pun — artikel, halaman landing, halaman produk, atau template AMP for Email.
2 Kompresi instan di browser: klik "Kompres AMP HTML" dan kompresor amp html akan menghapus komentar, merapatkan spasi, meminifikasi gaya kustom Anda, dan menjalankan pemeriksaan validasi struktur AMP. Tidak ada data yang dikirim ke server mana pun.
3 Salin atau unduh keluaran terkompresi: salin AMP HTML terkompresi ke papan klip atau unduh sebagai file .html. Panel validasi AMP menampilkan elemen AMP wajib yang hilang yang terdeteksi selama kompresi.

Apa yang dihapus dan dipertahankan oleh kompresor AMP HTML

Menghapus — komentar HTML: semua komentar  dihilangkan dari keluaran AMP HTML. Komentar tidak dirender browser dan menambah byte yang tidak perlu pada setiap permintaan halaman.
Menghapus — spasi berlebih: spasi antar tag HTML, baris kosong, dan indentasi berulang dirapatkan. Ini adalah sumber penghematan terbesar pada AMP HTML yang terformat rapi.
Meminifikasi — <style amp-custom>: blok CSS kustom diminifikasi dengan aturan yang sama seperti Kompresor Bundle CSS — menghapus komentar, merapatkan spasi, dan menerapkan optimasi bentuk singkat.
Mempertahankan — boilerplate AMP: boilerplate <style amp-boilerplate> dan <noscript> dipertahankan persis seperti yang diwajibkan spesifikasi AMP. Mengubah boilerplate menyebabkan kegagalan validasi AMP.

Batas ukuran dan praktik terbaik AMP HTML

Halaman AMP memiliki batas CSS 75 KB untuk <style amp-custom> dan tidak ada batas ukuran HTML yang eksplisit, tetapi halaman yang lebih kecil memuat lebih cepat dan lebih efisien di-cache. Kompresor amp html membantu Anda tetap dalam batas CSS dengan meminifikasi gaya kustom Anda. Untuk performa AMP maksimal, aktifkan juga kompresi GZIP atau Brotli di server asal Anda — AMP HTML biasanya mencapai kompresi GZIP 70–80%. Validasi halaman AMP terkompresi Anda di validator.ampproject.org sebelum menerapkannya.

Pertanyaan yang Sering Diajukan

Kompresor amp html mengurangi ukuran dokumen AMP HTML dengan menghapus komentar, merapatkan spasi, dan meminifikasi gaya kustom — sekaligus mempertahankan boilerplate AMP yang wajib. Kompresor amp html gratis kami bekerja sepenuhnya di browser Anda.

Kompresor amp html menerapkan transformasi yang aman untuk AMP — alat ini mempertahankan boilerplate AMP dengan tepat, melindungi semua blok script, dan hanya menghapus komentar serta spasi. Selalu validasi di validator.ampproject.org sebelum menerapkan.

Tentu saja. Kompresor amp html memproses semuanya secara lokal di browser Anda. AMP HTML Anda tidak pernah diunggah ke server mana pun dan tidak pernah meninggalkan perangkat Anda.

Ya — 100% gratis, selamanya. Tanpa pendaftaran, tanpa akun, tanpa paket premium, tanpa batas ukuran file, dan tanpa iklan.

Boilerplate AMP harus cocok persis dengan string yang ditentukan dalam spesifikasi AMP. Setiap perubahan menyebabkan kegagalan validasi AMP. Kompresor amp html mempertahankan boilerplate persis seperti yang diwajibkan.

Halaman AMP memiliki batas 75 KB untuk blok <style amp-custom>. Kompresor amp html meminifikasi CSS kustom Anda untuk membantu Anda tetap dalam batas ini.

Kompresor amp html melakukan pemeriksaan struktural dasar — DOCTYPE yang hilang, atribut AMP, script runtime, boilerplate, dan tautan kanonis. Untuk validasi lengkap, gunakan validator.ampproject.org.

Kompresi AMP HTML tipikal menghasilkan pengurangan ukuran 10–30%, bergantung pada banyaknya spasi dan komentar di sumber Anda.

Ya — minifikasi dan GZIP saling melengkapi. Minifikasi dulu dengan kompresor amp html, lalu aktifkan GZIP atau Brotli di server Anda. AMP HTML biasanya mencapai kompresi GZIP 70–80%.