変換画像

あなたがあなたのフロントエンドを最適化しようとするとき、あなたはそれを理解しましたPageSpeed from Google WebPイメージを使用することを提案します.as they say , サイズは26 %小さい.
使い方を教えてあげようSpatie Media Library , これを達成するために素晴らしいPHP + LARAVELライブラリ.

始めましょう

1 .Install Spatie Media Library

2 .Prepare your model

3 .Associate a file to your model

4 .Converting your images
ドキュメントでは、Webp(または必要な別の形式)への適切な変換を実現する方法を指定しないため、この手順は混乱する可能性があります.
まず最初に、RegisterMediaConditionというメソッドをモデルに追加する必要があります.次の例を見てください.

class Course extends Model implements HasMedia
{
    use InteractsWithMedia;

    public function registerMediaConversions(Media $media = null): void
    {
        $this->addMediaConversion('cover')
            ->format(Manipulations::FORMAT_WEBP)
            ->width(320)
            ->height(200)
            ->nonQueued();
    }
}

重要なもの
呼び出し

->addMediaConversion('cover')

画像を得るために後で必要とする変換の名前を定義します.

->format(Manipulations::FORMAT_WEBP)

Webpへの変換のマジック(または別の形式)を作るメソッドです
含む

->nonQueued()

キューなしで変換を実行するには、

画像を取得する
したがって、変換後、フロントエンドで使用するイメージを取得する必要があります.

$urlToFirstImage = $course->getFirstMediaUrl('images', 'cover');

最初のパラメータは、画像を取得するコレクションを定義します.
te 2番目のパラメータは、以前に定義した変換名を指定します.
それで、簡単な方法で、我々は空間メディアライブラリを使用しているWebpにイメージを変えることができます.
を参照してくださいlibrary documentation 用途を広げて、あなたの特定のニーズにこれを調節するために.