大規模なメディアをnetlifyにする

最近、私はNetlifyの大規模なメディアのセットアップに取り組み、自分の経験を共有していると思いました。 GIT大きなファイルストレージ（GIT LFS）がここで重要です。メインGitリポジトリから大きなファイルを締め出します。 500MBの画像を備えたWebサイトを想像してみてください。リポジトリに直接それらを含めて、クローニングを悪夢にします。 GIT LFSは、大きなファイルを個別に保存することでこれを解決します。

Git LFSに基づいて大規模なメディアが構築され、セットアップを簡素化し、重要な利点を追加します。URLパラメーターを介してサイズ変更されています。この自動化されたサイズ変更は、大きな時間節約です。

公式のドキュメントは良い出発点ですが、いくつかのハードルに遭遇しました。これについては以下に記録します。

必要なインストール（macO）

これらの手順はmacosのものです。他のシステムに必要に応じて調整します。必要です：

1. git lfs： brew install git-lfs
2. Netlify CLI： npm install netlify-cli -g
3. Netlifyラージメディアプラグイン： netlify plugins:install netlify-lm-plugin 、続いてnetlify lm:install

あなたのサイトをリンクします

Netlifyで認証して、CLIをプロジェクトに接続します。

 netlifyリンク

これにより、サイトIDを含む.netlify/state.jsonファイルが生成されます。

 {
    「siteid」：「xxx」
}

大規模なメディアのセットアップ

セットアップコマンドを実行します。

 Netlify LM：セットアップ

これにより、 .lfsconfigファイルが作成されます。

 <code>[lfs] url = https://xxx.netlify.com/.netlify/large-media</code>

.netlify/state.jsonと.lfsconfig両方をコミットします。

画像の追跡

Git LFSを使用して、どの画像タイプを管理するかを指定します。

 git lfsトラック "*.jpg" "*.jpeg" "*.png"

（注：最初は.jpeg逃したため、問題につながりました。関連するすべての拡張機能を含めてください。）

これにより、 .gitattributesファイルが生成されます。たとえば、

 <code>*.jpg filter=lfs diff=lfs merge=lfs -text *.png filter=lfs diff=lfs merge=lfs -text *.jpeg filter=lfs diff=lfs merge=lfs -text</code>

コミットしてプッシュした後、あなたの画像はアップロードして大規模なメディアをネットライフします。このプッシュには、ファイルのサイズに応じて時間がかかる場合があります。

潜在的な障害：私の最初のプッシュが失速しました。ソリューションはnetlify-credential-helperインストールでした。

このプロセスは画像に限定されません。この方法では、大きなバイナリファイルを処理できます。

出入り後：ファイルではなくポインター

最初のプッシュ後、リポジトリには、Netlifyの大規模なメディアに保存されているファイルへのポインターのみが含まれます。

オンザフライのサイズ変更：最良の部分

URLパラメーターを使用して画像を動的にサイズ変更します。

<img src="/static/imghw/default1.png" data-src="https://img.php.cn/" class="lazy" alt="大規模なメディアをnetlifyにする">

これを応答性の高い画像技術と組み合わせて、最適なパフォーマンスを示します。

<img src="/static/imghw/default1.png" data-src="https://img.php.cn/" class="lazy" alt="大規模なメディアをnetlifyにする">

以上が大規模なメディアをnetlifyにするの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。