ウェブパフォーマンスは、いくら最適化してもし過ぎることはありません。ちょっとした小技もたくさん組み合わせることで、全体の読み込み時間を大幅に改善することができます。WordPressで絵文字を無効化する方法はこちらでご紹介していますが、この記事では、WordPressで埋め込みを無効にする方法をご紹介します。

WordPress 4.4以降、WordPressにはoEmbed機能が標準搭載されています。WordPressでは、URLを貼り付けるだけでYouTube動画やXの投稿などの外部リソースを簡単に埋め込むことができます。埋め込みは自動変換されるため、ビジュアルエディターでライブプレビューも確認可能です。例えば、Xの投稿のURL（https://twitter.com/kinsta/status/760489262127120385）を貼り付けると、以下のように表示されます（埋め込み可能なリソースの種類はこちら）。

WordPressのエディターに埋め込まれたXの投稿
WordPressのエディターに埋め込まれたXの投稿

oEmbed機能により、別のサイトがWordPressの投稿を埋め込むことも可能になります。これは多くのユーザーにとって便利な機能になりますが、wp-embed.min.jsファイルを読み込むためのHTTPリクエストが発生することを意味します。そしてこのリクエストはすべてのページで読み込まれます。ファイルのサイズはわずか1.7KBと軽量ですが、時とともに蓄積され、パフォーマンスに影響を与えかねません。また、コンテンツのダウンロードサイズよりも、リクエスト自体が問題になる可能性もあります（関連して、WordPressでFacebookのoEmbedエラーを解決する方法はこちら）。

wp-embed.min.js
wp-embed.min.js

WordPressで埋め込みを無効にする方法

WordPressで埋め込みを無効にするには、以下いくつかの方法があります。それぞれ順にご紹介していきます。

1.プラグインでWordPressの埋め込みを無効にする

無料プラグインDisable Embedsを使用して、埋め込みを無効化することができます。

Disable Embedsプラグイン
Disable Embedsプラグイン

このプラグインは3KBと超軽量で、本記事執筆時点では1万以上のアクティブインストール、5つ星中の4.8の評価を得ています。WordPressのリポジトリからダウンロードするか、WordPress管理画面の「プラグイン」＞「新規追加」で検索してインストールしてください。設定は特に不要で、有効化するだけで余分なJavaScriptファイルが排除されます。他にも、以下のような機能があります。

  • 自分のサイトのコンテンツが他のサイトで埋め込まれるのを防ぐ
  • ホワイトリストに登録されていないサイトを埋め込むことを防ぐ
  • サイトにJavaScriptファイルが読み込まれないようにする

このプラグインをサイトにインストールしても、YouTubeやXのコンテンツはiframeを使用すれば埋め込むことができます。また、Perfmatters（Kinstaの社員が開発）のような有料プラグインでも埋め込みを無効化できます。

Perfmattersプラグインで埋め込みを無効化
Perfmattersプラグインで埋め込みを無効化

2.コードを編集して埋め込みを無効にする

プラグインをインストールしたくない場合は、コードを編集して埋め込みを無効にすることもできます。この方法を選択する場合、まずは念のためにサイトのバックアップをとり、テーマを更新しても変更が失われないようにするために子テーマを作成します。それから、子テーマのfunctions.phpファイルに以下を貼り付けます。注）コードは上記のDisable Embedsプラグインから引用しています。

function disable_embeds_code_init() {

 // REST APIエンドポイントを削除
 remove_action( 'rest_api_init', 'wp_oembed_register_route' );

 // oEmbedの自動検出を無効化
 add_filter( 'embed_oembed_discover', '__return_false' );

 // oEmbedの結果をフィルタリングしない
 remove_filter( 'oembed_dataparse', 'wp_filter_oembed_result', 10 );

 // oEmbedの検出リンクを削除
 remove_action( 'wp_head', 'wp_oembed_add_discovery_links' );

 // フロントエンドとバックエンドからoEmbed固有のJavaScriptを削除
 remove_action( 'wp_head', 'wp_oembed_add_host_js' );
 add_filter( 'tiny_mce_plugins', 'disable_embeds_tiny_mce_plugin' );

 // すべてのembedの書き換えルールを削除
 add_filter( 'rewrite_rules_array', 'disable_embeds_rewrites' );

 // HTTPリクエストが行われる前にoEmbed結果のフィルタリングを取り除く
 remove_filter( 'pre_oembed_result', 'wp_filter_pre_oembed_result', 10 );
}

add_action( 'init', 'disable_embeds_code_init', 9999 );

function disable_embeds_tiny_mce_plugin($plugins) {
    return array_diff($plugins, array('wpembed'));
}

function disable_embeds_rewrites($rules) {
    foreach($rules as $rule => $rewrite) {
        if(false !== strpos($rewrite, 'embed=true')) {
            unset($rules[$rule]);
        }
    }
    return $rules;
}

あるいは、wp_dequeue_script関数を使用することも可能です。

function my_deregister_scripts(){
 wp_dequeue_script( 'wp-embed' );
}
add_action( 'wp_footer', 'my_deregister_scripts' );

3. 圧縮したJavaScriptをインラインで埋め込む

もう1つの選択肢として、wp-embed.min.jsファイルの内容を取得し、インラインで埋め込むという方法があります。これは小さなファイルや、それほどコード量が多くない場合に推奨されます。HTTPリクエストの数を削減しつつ、埋め込みの機能はキープしたい場合に適しています。