Render Faster

説明

このプラグインは WordPress テーマのページ描画を最適化します。

機能

  • loading="lazy" または loading="eager" を画像に追加します。
  • defer または async 属性をスクリプトに追加します。
  • スタイルシートに rel="preload" を追加します。古いブラウザの後方互換も利用可能です。
  • 埋め込み(twitter, instagram) のヘルパースクリプトを除去し、ユーザーの操作を待ってから読み込みます。

上記のすべては選択可能で、許可リストをカスタマイズすることができます。

ケース1. 画像の読み込み

もしヘッダーロゴ (.custom-logo) と投稿のサムネイル (.post-feature-image) がファーストビューにあるために先に読み込まれて欲しいとしましょう。

設定画面の優先度高セクションにcustom-logo,post-feature-imageを入力してください。

ケース2. deferを停止

JavaScriptの遅延読み込みはしばしばサイトを壊すことがあります。たとえば、スクリプトが読み込み直後になにか処理を行うような書き方をされていた場合、エラーになることがあります。

<script id="some-script-js" src="somescript.js" defer></script>
<script>
new SomeScript();
</script>

これを避けるためには、some-script のようなハンドル名を設定画面の拒否リストに追加してください。

一般的に、WordPressで読み込まれるJavaScriptは WordPress コア、プラグイン、テーマ、あなたの書いたカスタムコードなどから読み込まれます。

JavaScript の読み込みを最適化するには、トライアンドエラーでアプローチするのが良いでしょう。

ケース3. クリティカルCSS

rel="preload" attributes makes your stylesheets loaded asynchrounsely, but FOUC(Flush of Unstyled Content) happens.

これを避けるためにはクリティカル CSS を設定画面の拒否リストに追加してください。クリティカルCSSは一般的にテーマのメインスタイルシートです。

インストール

プラグインディレクトリから

インストールをクリックし、有効化してください。

GitHubから

リリースをご覧ください。

FAQ

サポートはどこで受けられますか?

サポートフォーラムでチケットを作成してください。

貢献はどのようにしたらよいですか?

新しいイシューを作成するか、プルリクエストを作成してください。

評価

このプラグインにはレビューがありません。

貢献者と開発者

Render Faster はオープンソースソフトウェアです。以下の人々がこのプラグインに貢献しています。

貢献者

“Render Faster” は1ロケールに翻訳されています。 翻訳者のみなさん、翻訳へのご協力ありがとうございます。

“Render Faster” をあなたの言語に翻訳しましょう。

開発に興味がありますか ?

コードを閲覧するか、SVN リポジトリをチェックするか、開発ログRSS で購読してみてください。

変更履歴

1.2.0

  • ブロック用スタイルの分割読み込みをサポート。WP 5.8 以降で利用可能。

1.1.0

  • 埋め込み最適化をサポート。

1.0.0

  • 最初のリリース。