この記事をおすすめしたい人
- WordPressのREST APIから記事一覧取得時に「embed」を使っていない人
- ページ内の複数の記事一覧をREST APIから取得している人
- つまりオレ
WordPressのREST APIで記事一覧取得時のサイズを減らす方法を紹介します。
減らす必要?
あると思いますよ。
このサイトだと、サイドバーに「最新の投稿」と「人気の投稿」、ページ下部に「関連記事」「その他の人気記事」の4箇所に記事一覧があります。 embed使わずにREST APIから取得すると1MB近くになっていました。
1MBって画像でもそうそういかないですからね。 おまけに必要な情報で重いんじゃなくて、不要な情報のせいで重いんです。
というわけでAPIのレスポンスサイズを減らす「embed」の指定の仕方とその原理について説明したいと思います。
このページの目次
記事一覧取得時には「context=embed」を指定すべし
いつものAPIクエリに「context=embed」を足すだけです。
このサイトの場合だとこう↓です。
/wp/v2/posts?context=embed
通常はこう↓です。
/wp/v2/posts
明らかにサイズが減っているのが分かると思います。
なぜ「context=embed」を指定するとサイズが減るのか
REST API(記事取得時)は、デフォルトでは「context=view」に設定されていて、「view」の場合には一番サイズが大きくなる「content」(記事本文)が含まれてしまっています。
「embed」を指定すると記事本文を含まなくなるためサイズが激減します。
実験環境では、このサイトの最新記事10件を取得した場合、通常272KBのところ、embed指定すると18KBにまで減らせました。 93%くらいの減少率です。
なぜ「context=embed」を指定すると本文を含まなくなるのか
REST APIから記事を取得する場合、「context」を指定することでどのような形で記事を取得することができます。 「表示モード」とでも考えればいいのでしょうか。
「context」には3つの値(view、embed、edit)を指定することができ、デフォルトでは「view」モードになっています。
それぞれのモードで何が表示されるかは公式に明記されています。
「context」の違いによる要素の変化
公式の内容を表にまとめるとこの↓ようになります。
要素名 | view | embed |
---|---|---|
date | ○ | ○ |
date_gmt | ○ | - |
guid | ○ | - |
id | ○ | ○ |
link | ○ | ○ |
modified | ○ | - |
modified_gmt | ○ | - |
slug | ○ | ○ |
status | ○ | - |
type | ○ | ○ |
title | ○ | ○ |
content | ○ | - |
author | ○ | ○ |
excerpt | ○ | ○ |
featured_media | ○ | ○ |
comment_status | ○ | - |
ping_status | ○ | - |
format | ○ | - |
meta | ○ | - |
sticky | ○ | - |
template | ○ | - |
categories | ○ | - |
tags | ○ | - |
「embed」モードではまさに記事一覧表示のために必要な要素のみにしぼられています。 ちなみに「embed」とは「埋め込み」という意味だそうです。
REST APIに自分でカスタムフィールドやアイキャッチを追加していた場合には、「embed」でも追加されたままです。
もうひとつの「edit」モードではこれらの要素を全て含み、さらに「password」「permalink_template」「generated_slug」の3つが追加されます。
「context=embed」の注意点
「embedモード」を単に「サイズを減らせる手法!」と解釈して、なんでもかんでもembed指定は危険です。
embedはあくまで、記事一覧表示時に「不要な情報を削除」することでサイズを減らせるに過ぎません。
記事ページなど、記事本文が必要な場合にはcontext指定なし、または「context=view」を指定しましょう。
ID指定で記事単体を取得する場合にも「context=embed」を指定すると、しっかりembedモードでの結果で返ってきてしまいます。
記事単体のembedモード:
/wp/v2/posts/101?context=embed
記事単体のviewモード:
/wp/v2/posts/101?context=view
まとめ
WordPressのREST APIで記事一覧を取得している場合は「context=embed」を指定するとレスポンスのサイズが激減するのでぜひ利用しましょう。
以上、WordPressからお届けしました!