徐々にVanilla JSで画像を遅延ロードすることができます

最近のWebサイトはすべて高速である必要があります。ページスピードを上げるためのテクニックやプラグインはたくさんありますが、それでも、どこから始めればよいのかわからない場合があります。.

プログレッシブスクリプトは ページスピードを上げるための素晴らしいリソース. これは、ユーザーがページを下にスクロールするにつれて画像をプログレッシブにロードするlazy loading imageスクリプトとして機能します。.

無料のオープンソースプロジェクトなので、これをダウンロードして任意のWebサイトで実行できます。それをプラス 100％バニラJSで動作するので、依存度がゼロになるため、負荷が軽減されます。.

プログレッシブホームページでライブデモを見ることができます。.

ページ全体の画像サイズを固定しているため、他の遅延ロードスクリプトとは少し異なります。この 画像がすばやくビューにロードされるたびに目にするような煩わしいページジャンプを防ぎます。 そして内容の高さを高めなさい.

そして画像プレースホルダーは実際にはロードしている画像のように見えます。驚くばかり!

このきちんとした技術は訪問者に機会を与えます 読み込む前に画像がどのように見えるかをプレビューする. すべてJavaScriptで処理され、ページ上のユーザーの位置が確認され、画像が表示されるときにその画像がプリロードされます。.

漸進的に かなり広範囲のAPI そのため、Web開発者にとっては素晴らしい選択です。あなたが基本的なフロントエンドコーディングのまわりであなたの方法を知っていればそれは助けるのでセットアップは技術的になることができます.

しかし、あなたはあなたのプロジェクトのためにあなたがコピーして貼り付けることができる完全なAPIドキュメンテーション、セットアップ手順とサンプルコード断片を含むメインGitHubページでもっと学ぶことができます.

あなたが厄介な依存関係のない信頼できる遅延ローディングのイメージスクリプトを必要とするならば、プログレッシブを撃ってください。それは完全に無料で、開発者にはたくさんのカスタマイズを提供します.

また、Progressive GitHubで詳細を調べ、ダウンロード可能なソースコードを理解してください。.