| title | description |
|---|---|
Dokumentasi yang ramah lingkungan |
Pelajari bagaimana Starlight bisa membantu Anda membangun website dokumentasi yang lebih ramah lingkungan dan mengurangi jejak karbon Anda. |
Estimasi dampak dari industri web terhadap iklim berkisar antara 2% hingga 4% dari emisi karbon global , kira-kira setara dengan emisi industri penerbangan. Ada banyak faktor kompleks dalam menghitung dampak ekologis sebuah website, namun panduan ini mencakup beberapa tips untuk mengurangi jejak lingkungan dari website dokumentasi Anda.
Berita baiknya adalah, memilih Starlight adalah awal yang baik. Menurut Website Carbon Calculator, website ini lebih bersih daripada 99% website-website yang telah diuji, menghasilkan 0,01g CO₂ per kunjungan halaman.
Semakin banyak data yang ditransfer oleh sebuah halaman web, semakin banyak sumber daya energi yang diperlukan. Pada bulan April 2023, nilai median dari banyaknya data yang harus di-download user ketika mengakses sebuah halaman website adalah lebih dari 2.000 KB berdasarkan data dari HTTP Archive.
Starlight membangun halaman-halaman yang seringan mungkin. Sebagai contoh, pada kunjungan pertama, pengguna hanya perlu mengunduh kurang dari 50 KB data yang telah dikompresi — hanya 2,5% dari nilai median HTTP Archive. Dengan strategi caching yang baik, kunjungan selanjutnya dapat mengunduh hanya sekitar 10 KB.
Meskipun Starlight memberikan basis yang baik, gambar yang Anda tambahkan ke halaman dokumentasi Anda dapat dengan cepat meningkatkan berat halaman Anda. Starlight menggunakan dukungan aset yang dioptimalkan dari Astro untuk mengoptimalkan gambar lokal dalam file Markdown dan MDX Anda.
Komponen yang dibangun dengan UI frameworks seperti React atau Vue dapat dengan mudah menambahkan banyak JavaScript ke halaman. Karena Starlight dibangun di atas Astro, komponen seperti ini secara default tidak memuat JavaScript di sisi klien berkat Astro Islands.
Caching digunakan untuk mengontrol berapa lama browser menyimpan dan menggunakan kembali data yang telah diunduh sebelumnya. Strategi caching yang baik memastikan bahwa pengguna mendapatkan konten baru sesegera mungkin ketika ada perubahan, tetapi juga menghindari pengunduhan yang tidak perlu dari konten yang sama berulang kali ketika konten tersebut tidak mengalami perubahan.
Cara paling umum untuk mengonfigurasi caching adalah dengan menggunakan Cache-Control HTTP header.
Ketika menggunakan Starlight, Anda dapat mengatur waktu cache yang lama untuk semua yang ada di direktori /_astro/.
Direktori ini berisi CSS, JavaScript, dan aset lainnya yang dapat di-cache secara permanen, mengurangi pengunduhan yang tidak perlu:
Cache-Control: public, max-age=604800, immutable
Cara mengkonfigurasi caching tergantung pada penyedia hosting website Anda. Misalnya, Vercel menerapkan strategi caching ini untuk Anda tanpa ada konfigurasi yang diperlukan, sementara Anda dapat mengatur header kustom untuk Netlify dengan menambahkan file public/_headers ke proyek Anda:
/_astro/*
Cache-Control: public
Cache-Control: max-age=604800
Cache-Control: immutable
Cara sebuah halaman web dibangun dapat mempengaruhi besarnya daya yang dibutuhkan untuk menjalankannya di perangkat pengguna. Dengan menggunakan JavaScript yang minimal, Starlight mengurangi jumlah daya pemrosesan yang dibutuhkan oleh telepon, tablet, atau komputer pengguna untuk memuat dan merender halaman.
Perhatikan saat menambahkan fitur seperti skrip pelacakan analitik atau konten yang kaya akan JavaScript seperti video yang disematkan, karena hal ini dapat meningkatkan penggunaan daya halaman. Jika Anda memerlukan analitik, pertimbangkan untuk memilih opsi yang lebih ringan seperti Cabin, Fathom, atau Plausible. Penyisipan video seperti YouTube dan Vimeo dapat ditingkatkan dengan menunggu pemuatan video saat ada interaksi pengguna. Package seperti astro-embed dapat membantu untuk layanan umum.
:::tip[Tahukah Anda?] Parsing dan kompilasi JavaScript adalah salah satu tugas yang paling mahal bagi browser. Dibandingkan dengan merender gambar JPEG dengan ukuran yang sama, pemrosesan JavaScript dapat memakan waktu lebih dari 30 kali lebih lama. :::
Dimana website di-hosting dapat memiliki dampak besar terhadap seberapa ramah lingkungan website dokumentasi Anda. Pusat data dan rumah server dapat memiliki dampak ekologis yang besar, termasuk konsumsi listrik yang tinggi dan penggunaan air yang intensif.
Memilih penyedia hosting yang menggunakan energi terbarukan berarti emisi karbon yang lebih rendah untuk website Anda. Green Web Directory adalah salah satu alat yang dapat membantu Anda menemukan perusahaan hosting yang ramah lingkungan.
Tertarik bagaimana perbandingannya dengan framework dokumentasi lainnya? Tes ini dengan Website Carbon Calculator membandingkan halaman-halaman serupa yang dibangun dengan tool yang berbeda.
| Framework | CO₂ per kunjungan halaman |
|---|---|
| Starlight | 0.01g |
| VitePress | 0.05g |
| Docus | 0.05g |
| Sphinx | 0.07g |
| MkDocs | 0.10g |
| Nextra | 0.11g |
| docsify | 0.11g |
| Docusaurus | 0.24g |
| Read the Docs | 0.24g |
| GitBook | 0.71g |
Data dikumpulkan pada 14 Mei 2023. Klik link untuk melihat angka terkini.
- “Building a greener web”, talk by Michelle Barker
- “Sustainable Web Development Strategies Within An Organization”, article by Michelle Barker
- “A sustainable web for everyone”, talk by Tom Greenwood
- “How Web Content Can Affect Power Usage”, article by Benjamin Poulain and Simon Fraser