日経電子版を支える広告技術 — HACK The Nikkei

本稿では、現在の日経電子版モバイル Web（以下、日経電子版）における広告掲示の技術について解説する。 広告とサイトパフォーマンスの関係 dev.to に代表されるような「高速」と言われる Web サイトは、CDN や ServiceWorker などを駆使して表示に関して適切なチューニングを行っており、日経電子版もほぼ同じ思想の元チューニングを行っているが、一点大きな違いを挙げるとするならば、広告表示の有無が挙げられる。 現在の日経電子版では 7 タイプの広告を表示しており、うち 4 タイプは外部 DSP からの配信を行っている。 その他にも様々なサイトトラッキングのサードパーティスクリプトを導入しているが、ご存知の通りこれらはメインとして打ち出したいコンテンツとはほぼ関連性はなく、パフォーマンス観点から見れば劣化させる要因でしかない。広告が無ければもっと速く表示できるのに…と思ったこと

[Rockridge]

「日経電子版ではさらに一歩進めて Shadow DOM での表示を試みている。（中略）実際に Shadow DOM vs iframe でのベンチマークを取ると、概ね Shadow DOM の方がパフォーマンスは良好であり、特に Chrome では顕著だった。」

[cyndow]

“「広告の最適化」という、おおよそフロントエンドの技術領域について触れられることがないであろうテーマについて解説した。何か一つでも最適化するヒントになれば幸いである。”

[massa142]

“もちろん広告は「確実に表示される」ことが至上命題であるが、メインスレッドで動作することが前提として書かれたスクリプトがあまりに多く、昨今の高速化を KPI とするサイトとは些か相性が悪いのが現状である”

[reboot_in]

"window.matchMedia でレイアウトの変更を検知し、モバイル・PC 毎に広告をスイッチする。"

[m_kashima]

“もちろん広告は「確実に表示される」ことが至上命題であるが、メインスレッドで動作することが前提として書かれたスクリプトがあまりに多く、”

[t_f_m]

あとで

[todesking]

日経電子版を支える広告技術 — HACK The Nikkei

[wyukawa]

どうでもいいけど、ENTRY押すとwantedlyにいくのか。。

[tzk2106]

こんなブログやってたのかー

[snowlong]

“「SDK の初期化」、「広告の取得」、そして「広告のレンダリング」の 3 つのフェーズに分けてチューニングを行った”

[efcl]

ウェブサイトのパフォーマンスを劣化させる広告(SDK)とその対策について。 無駄なRTTの削減、ファイルサイズの削減。 メインスレッドで同期処理される`document.write()`対策としてShadow DOMやiframeでの実行やIntersection Observerでの