この記事は次の言語でも利用可能です
テーマを最適化するために、以下の典型的なテクノロジーを適用します。

Lazyload Images:ページの読み込み時に重要ではないリソースの読み込みを延期する手法です。代わりに、これらの重要ではないリソースは、必要なときにロードされます。そのため、画像を遅延読み込みすると、サイトの初期読み込み時間とページペイロードを減らすことができます。

Webフォントのプリロード:フロントエンド開発者は、現在のページのリソースをダウンロードしてロードを高速化するようにブラウザーに指示できます。(使用可能なリソースタイプには、画像、フォント、メディア、さらにはスタイルシートが含まれます。)プリロードする前は、DOMとCSSOMが生成されるまでフォントをダウンロードできませんでした。そのためには、ブラウザーは最初にHTMLとリンクされたCSSファイルをダウンロードする必要がありました。ダウンロードするフォントファイルを見つけます。プリロードを使用すると、フロントエンド開発者は、CSSファイルと同時に必要なフォントファイルをダウンロードするようにブラウザに指示できます。フォントのダウンロードが速いほど、画面上でのレンダリングも速くなります。

CSSファイルの縮小:CSSファイルには、コメント、空白、インデントなどの不要な文字を含めることができます。本番環境では、これらの文字を安全に削除して、ブラウザがスタイルを処理する方法に影響を与えることなくファイルサイズを縮小できます。この手法は、CSSファイルの縮小と呼ばれます。CSSファイルは多くの場合、必要以上に大きいためです。一部のミニファイアは、ファイルサイズをさらに縮小するために、巧妙な最適化を実行できます。したがって、CSSファイルを縮小すると、ページの読み込みパフォーマンスを向上させることができます。

Javasciptファイルの縮小:縮小とは、空白と、小さいが完全に有効なコードファイルを作成するために必要のないコードを削除するプロセスです。そのため、ペイロードサイズとスクリプトの解析時間を短縮できます。

重要なCSSの抽出:重要なCSSは、スクロールせずに見える範囲のコンテンツのCSSを抽出して、ユーザーにコンテンツをできるだけ速くレンダリングする手法です。

サードパーティ(Tinypng)が提供するSmarty不可逆圧縮方式を使用して、画像を最適化し、画像の色数を選択的に減らすことで品質を低下させながら画像ファイルのファイルサイズを縮小し、保存に必要なバイト数を減らします。データ。しかし、この喪失は通常、人間の目には検出できません。その結果、画像が効果的に最適化され、不要なメタデータもすべて削除されます。これにより、Webサイトの使用帯域幅が少なくなり、読み込みが速くなります。

詳細については、参考資料をご覧ください。
画像のレイジーロード
Webフォントの
プリロードCSSファイルの
縮小Javascriptファイルの縮小
重要なCSSの抽出

これがお役に立てば幸いです。
さらにサポートが必要な場合は、ライブチャットでお気軽にお問い合わせいただくか、support @ perfectapps.ioまでメールでお問い合わせください。

注意
この記事の内容はもともと英語で書かれていて、自動的に日本語に翻訳されました。わかりにくい場合は英語版をご参照ください。
この記事は役に立ちましたか?
キャンセル
ありがとうございます