Metode yang efektif untuk mengurangi bandwidth (dan dengan demikian waktu pemuatan halaman)?

Apa metode yang paling efektif untuk mengurangi jumlah bandwidth yang dibutuhkan situs web untuk membuat halaman?

Caching agresif? Meminimalkan JS / CSS? Gzip? CMS? Sprite?

bandwidth compression

— Mark Henderson
sumber

Pertanyaan duplikat mendapat jawaban duplikat: webmasters.stackexchange.com/questions/569/…

— Bryson

Pertanyaan ini pertama kali, jadi yang lain adalah duplikat

— Mark Henderson

Jawaban:

Beberapa metode dasar yang mudah diterapkan oleh situs web apa pun:

Kompres HTML, CSS, dan Javascript Anda dengan deflateatau gzipjika browser yang membuat permintaan mendukungnya.
Perkecil javascript Anda dengan Google Closure Compiler
Minimalkan css Anda dengan Kompresor YUI

Sedikit lebih terlibat:

Jika sebuah halaman atau gambar tidak mungkin berubah, beri tahu browser untuk menyimpannya. Sebagian besar server web sudah melakukan ini untuk file statis, jadi yang harus Anda lakukan adalah menambahkannya ke skrip dinamis Anda jika memungkinkan.
Gabungkan file CSS dan JS Anda menjadi satu secara otomatis . Ini menguntungkan karena mengurangi permintaan HTTP (yang memiliki overhead dan yang browser bodoh tertentu - dan maksud saya Internet Explorer - membatasi secara default 2 permintaan pada waktu per domain).
Pindahkan file statis Anda (CSS, JS, gambar, dll) ke nama domain yang terpisah. Ini menyebabkan informasi cookie tidak dikirim dalam permintaan HTTP.
Gunakan sprite yang dihasilkan secara otomatis . Sprite adalah gambar tunggal yang mengandung banyak ikon atau gambar kecil lainnya; Anda kemudian memilih gambar mana yang akan ditampilkan dengan backgroundproperti CSS . Contoh .

Keuntungannya adalah bahwa klien membuat lebih sedikit permintaan HTTP (yang memiliki overhead).

Saya berani "secara otomatis" karena jika Anda melakukan hal-hal ini secara manual maka itu pasti tidak sepadan, dan itu membuat pemeliharaan kode mimpi buruk. Biasanya melakukannya secara otomatis berarti menulis skrip khusus, itulah sebabnya "sedikit lebih terlibat",

— Thomas Bonini
sumber

Saya akan menjawab, tapi saya pikir Anda sudah membahas semuanya :)

— Echo mengatakan Reinstate Monica

overhead memang merupakan hal yang penting untuk dipertimbangkan, untuk file kecil, mereka dapat mewakili persentase yang baik dari data yang ditransfer.

— HoLyVieR

Jangan gunakan deflate kecuali Anda juga memeriksa agen pengguna dengan cermat, karena ada bug di Internet Explorer deflate.

@ Kinopiko: ya, saran bagus. Lihat pertanyaan saya tentang stack overflow.

— Thomas Bonini

Google telah menjabarkan dan menjelaskan rekomendasi mereka untuk meminimalkan Ukuran Payload terbaik . Mereka termasuk teknik-teknik berikut:

Aktifkan kompresi
Hapus CSS yang tidak digunakan
Perkecil JavaScript
Minimalkan CSS
Minify HTML
Tunda pemuatan JavaScript
Optimalkan gambar
Sajikan gambar berskala
Sajikan sumber daya dari URL yang konsisten

Saran-saran ini adalah bagian dari proyek add-on Firefox / Firebug open-source mereka yang disebut Page Speed . Mirip dengan plugin YSlow milik Yahoo ! . Pengaya Kecepatan Halaman aktual akan memeriksa lebih banyak optimasi daripada yang dijelaskan secara rinci di dalam daftar itu. Instruksi untuk Menggunakan Kecepatan Halaman juga disajikan.

Praktik Terbaik Yahoo! Untuk Mempercepat Situs Web Anda mengidentifikasi serangkaian praktik terbaik serupa:

Minimalkan Permintaan HTTP
Gunakan Jaringan Pengiriman Konten
Tambahkan Expire atau Header Cache-Control
Komponen Gzip
Letakkan Stylesheets di Atas
Letakkan Script di Bawah
Hindari Ekspresi CSS
Jadikan JavaScript dan CSS Eksternal
Kurangi Pencarian DNS
...

(Daftar Yahoo! Panjang ~ 35 item, tidak perlu mengutip secara keseluruhan.)

Baik YSlow (tautan gambar) dan Kecepatan Halaman (tautan gambar) akan memungkinkan Anda untuk menjalankan tes pada halaman Anda, menyarankan hal-hal yang dapat Anda lakukan dan menunjukkan kepada Anda apa, dari rekomendasi mereka, sudah diterapkan.

— Bryson
sumber