環境に優しいドキュメント
ウェブ産業が気候に与える影響は、世界の炭素排出量の2%から4%であり、航空業界の排出量にほぼ匹敵すると推定されています。ウェブサイトの生態学的影響の計算には多くの複雑な要因がありますが、このガイドではドキュメントサイトの環境への負荷を減らすためのいくつかのヒントを紹介します。
幸いなことに、Starlightを選ぶことは素晴らしいスタートです。Website Carbon Calculatorによると、このサイトはテスト対象のウェブページの99%よりもクリーンであり、ページ訪問あたり0.01gのCO₂を生成します。
ページの重さ
ウェブページが転送するデータが多いほど、より多くのエネルギー資源が必要になります。2023年4月現在、HTTPアーカイブのデータによると、中央値のウェブページでは、ユーザーは2,000KB以上のデータをダウンロードする必要がありました。
Starlightは、可能な限り軽量なページを作成します。たとえば、初回訪問時にユーザーがダウンロードする圧縮データは50KB未満であり、HTTPアーカイブの中央値のわずか2.5%にすぎません。優れたキャッシュ戦略により、後続のナビゲーションのダウンロードは10KB程度に抑えられます。
画像
Starlightは優れたベースラインを提供しますが、ドキュメントページに追加した画像はページの重さを急速に増加させます。Starlightは、Astroの最適化されたアセットサポートを使用して、MarkdownとMDXファイル内のローカル画像を最適化します。
UIコンポーネント
ReactやVueなどのUIフレームワークで作成されたコンポーネントを使うと、大量のJavaScriptがページに追加される可能性があります。StarlightはAstro上に構築されており、Astroアイランドのおかげで、このようなコンポーネントがデフォルトでロードするクライアントサイドJavaScriptはゼロとなります。
キャッシュ
キャッシュは、ブラウザがすでにダウンロードしたデータをどのくらいの期間保存して再利用するかを制御するために使用されます。優れたキャッシュ戦略は、コンテンツが変更されたときにユーザーができるだけ早く新しいコンテンツを取得することを保証し、また変更されていないときに同じコンテンツを何度も無駄にダウンロードするのを避けます。
キャッシュを設定する最も一般的な方法は、Cache-Control
HTTPヘッダーを使用するものです。Starlightを使用する場合、/_astro/
ディレクトリ内のすべてに対し長めのキャッシュ時間を設定できます。このディレクトリには、CSS、JavaScript、その他のバンドルされたアセットが含まれており、安全に永続的なキャッシュを設定できるため、不要なダウンロードを減らすことができます。
キャッシュの設定方法は、ウェブホストによって異なります。たとえば、Vercelは設定不要でこのキャッシュ戦略を適用しますが、Netlifyではプロジェクトにpublic/_headers
ファイルを追加することでNetlify用カスタムヘッダーを設定できます。
電力消費
ウェブページをどのようにビルドするかは、ユーザーのデバイス上で実行するために必要な電力に影響します。Starlightは、最小限のJavaScriptを使用することで、ユーザーの携帯電話、タブレット、そしてコンピューターがページをロードしてレンダリングするために必要な処理量を削減します。
アナリティクスのトラッキングスクリプトのような機能や、ビデオ埋め込みのようなJavaScriptを多用するコンテンツを追加すると、ページの電力消費量が増加する可能性があるため注意してください。アナリティクスが必要な場合は、Cabin、Fathom、あるいはPlausibleのような軽量なオプションを選択することを検討してください。YouTubeやVimeoのような埋め込みは、ユーザーの操作に応じて動画をロードすることで改善できます。astro-embed
のようなパッケージは、一般的なサービスに対し有効です。
ホスティング
ウェブページをホスティングする場所は、あなたのドキュメントサイトがどれだけ環境に優しいかどうかに大きく影響します。データセンターやサーバーファームは、高い電力消費や水の集中的な使用など、生態系に大きな影響を与える可能性があります。
再生可能エネルギーを使用するホストを選択すれば、サイトの炭素排出量を少なくできます。Green Web Directoryは、ホスティング会社を見つけるのに役立つツールの1つです。
比較
他のドキュメントフレームワークとの比較に興味がありますか?Website Carbon Calculatorを用いた以下のテストでは、異なるツールで作成された類似のページを比較しています。
フレームー枠 | ページ訪問ごとのCO₂ |
---|---|
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 |
データは2023年5月14日に収集されたものです。リンクをクリックすると、最新の数値が表示されます。
その他のリソース
ツール
記事と講演
- “Building a greener web”、Michelle Barkerによる講演
- “Sustainable Web Development Strategies Within An Organization”、Michelle Barkerによる記事
- “A sustainable web for everyone”、Tom Greenwoodによる講演
- “How Web Content Can Affect Power Usage”、Benjamin PoulainとSimon Fraserによる記事