Apakah ada cara mudah untuk melihat jumlah kompresi di Chrome?

33

Saya sibuk memeriksa bagaimana server web saya melakukan gzip. Saya yakin sekarang bahwa gzip aktif karena chrome menunjukkan penyandian konten: header gzip.

Apakah ada cara mudah untuk melihat seberapa banyak file dikompresi di alat pengembang Chrome?

gzip compression google-chrome

— Peter Smit
sumber

1

Jika ada plugin untuk melihat header HTTP, maka Anda bisa membandingkan ukuran dokumen dengan Content-Lengthheader.

— Lèse majesté

32

Jawaban yang diperbarui untuk 2017 : Ya.

Kolom ukuran di tab Jaringan di Alat Pengembang Chrome memiliki ukuran terkompresi dan tidak terkompresi, untuk gzip, brotli, dan apa pun yang terjadi di masa mendatang. Misalnya:

Di sini ukuran terkompresi adalah 242 KB, ukuran terkompresi adalah 1,1 MB

Untuk melihat keduanya, pastikan Anda memiliki Devtools yang menampilkan baris permintaan besar . Ini adalah ikon pertama dalam opsi "Lihat" di bilah alat khusus Jaringan.

— mikemaccana
sumber

7

Terima kasih. Mudah ketinggalan itu. Kita harus mengklik "gunakan baris permintaan besar"

— alds

Anda juga dapat mengklik kanan header kolom dan memperlihatkan Header Respons "Pengodean Konten". Setelah Anda melakukan ini, Anda dapat mengurutkan berdasarkan kolom untuk mendapatkan daftar cepat dari semua tanggapan yang di-gzip.

— thirdender

18

Sejauh ini metode termudah adalah dengan menggunakan alat online. GIDZipTest menampilkan banyak detail: ukuran asli, ukuran terkompresi, dan persentase kompresi.

Namun, ini dimungkinkan di Chrome dengan sedikit usaha. (Diperbarui untuk Chrome terbaru, September 2011.)

Di Alat Pengembang, buka tab "Jaringan" dan muat ulang halaman. Anda akan melihat daftar semua file yang diambil di kolom kiri. Klik halaman / file yang sesuai di sebelah kiri kemudian tab "Headers" di panel kanan.

Di bawah "Header Respons" Anda akan melihat "Pengkodean Konten: gzip" diikuti oleh tajuk "Panjang Konten". Ini adalah ukuran konten terkompresi.

Menemukan ukuran yang tidak terkompresi lebih sulit. Jika Anda menyajikan file statis, Anda cukup memeriksa ukurannya. Untuk konten dinamis Anda harus menyalin-tempel HTML ke editor teks dan menyimpannya untuk memeriksa ukuran yang tepat.

— DisgruntledGoat
sumber

di mana "aktifkan pelacakan sumber daya"?

— Pacerier

@Pacerier: ini sedikit berbeda dengan Chrome versi terbaru; Saya telah memperbarui jawaban saya dengan instruksi baru.

— DisgruntledGoat

Alat yang rapi. Saya tidak tahu mengapa respons yang dikirim oleh aplikasi Google App Engine saya tidak menunjukkan ukuran yang dikompresi. Respons yang dikirim oleh SDK (mis. Localhost) tidak dikompres sedangkan respons yang berasal dari cloud adalah. Ternyata, Chrome berfungsi dengan baik.

— Evan Plaice

9

Pembaruan untuk 2017

Saat menggunakan ikon besar, alat pengembang krom menunjukkan ukuran kompresi sebelum dan sesudah di tab jaringan.

Saya mengonfirmasi dengan mematikan dan mematikan gzip di server web saya.

— CodeMonkey
sumber

5

Cara lain untuk mencapai ini adalah dengan CURL:

curl -i -H "Accept-Encoding: gzip" http://someurl.com | wc -c

melawan

curl -i http://someurl.com | wc -c

Angka yang ditampilkan setelah setiap perintah adalah jumlah byte yang melewati kawat.

— Stephen
sumber

2

Saya pernah mendengar yang ada di chrome cacat karena bug di webkit.

The Y Plugin Lambat untuk firefox melakukan pekerjaan yang besar. Saat menjalankannya buka tab Komponen dan perluas jenis komponen yang Anda inginkan nilainya. Ini akan menampilkan ukuran asli dan ukuran gzip.

— XOPJ
sumber

2

Ini bukan alat khusus untuk Chrome, tetapi saya menggunakan Fiddler ketika memeriksa informasi lalu lintas HTTP / header. Ini alat yang hebat, bekerja di peramban apa pun dan gratis!

— BradB
sumber

1

Ada juga Fiddler versi ekstensi Chrome sekarang!

— karlbecker_com

Terima kasih telah menyarankan ini. Fiddler tidak menunjukkan "ukuran tidak terkompresi" tetapi membiarkan Anda menambahkan kolom untuk "CompressionSavings" dan "CompressionSavings%". Tambahkan dengan mengklik kanan kolom ==> "Sesuaikan Kolum" ==> "Lain-lain" ==> Dropdown "Nama Bidang".

— Jason

0

Bagi siapa pun yang masih tiba di sini dari pencarian google umum (seperti yang saya lakukan), dalam versi modern Firefox dimungkinkan untuk melihat ukuran "mentah" dan di-gzip langsung dari devtools dengan membandingkan kolom "Ukuran yang Dipindahkan" dan kolom "Ukuran". "Ukuran" adalah ukuran mentah dari respons, "Ukuran yang ditransfer" adalah ukuran sebenarnya dari data yang ditransfer untuk respons, yang mungkin lebih rendah dari ukuran sebenarnya jika menggunakan gzip, seperti pada gambar di bawah ini, atau bahkan 0 dalam kasus tanggapan telah di-cache di klien.

— LeartS
sumber