Youtube埋込多すぎて遅くなった・処理落ちするサイトへの対処法
safariで「ｘｘｘｘで問題が繰り返し起きました」などとエラーが発生するとご連絡をいただきました。
wordpressで作成したサイト。
PC/Androidでは再現しない。
再現手順も不明。原因も不明。
あれこれしていると記事一覧ページを順々に読んでいくと発生するという再現方法が見つかりました。
どうもこれ読み込みすぎて処理落ちしてるなと。
原因ですが、youtubeの埋め込みが多すぎました。
1記事にyoutube埋込が10個以上ある。。
記事一覧ページを開くと更に30個以上ある。。。
埋込にiframeを使用しあちこちからjsを引っ張ってきてる状態。
そら落ちるわ(ノД`)・゜・。
対策としてwordpressのフィルター機能を使用して、コンテンツ内のiframeタグを外部リンクに変更しました。
functions.php
/**
* iframe判定
**/
function rep_iframe($the_content)
{
$the_content = preg_replace('/<iframe/i', '<a class="youtube-link" ', $the_content);
$the_content = preg_replace('/src=/', 'target="_blank" href=', $the_content);
$the_content = preg_replace('/<\/iframe>/i', 'Youtubeで見る</a>', $the_content);
return $the_content;
}
add_filter('the_content','rep_iframe');
/**
* iframe遅延無効
**/
function disable_post_content_iframe_lazy_loading( $default, $tag_name, $context ) {
if ( 'iframe' === $tag_name && 'the_content' === $context ) {
return false;
}
return $default;
}
add_filter(
'wp_lazy_loading_enabled',
'disable_post_content_iframe_lazy_loading',
10,
3
);