リニューアルした日経電子版が高速すぎてヤバイ件｜こんぴゅ

日本経済新聞は国内を代表する経済誌だ。その電子版はwebでの継続課金を大成功させ、いまや50万以上の有料会員を擁するモンスターサイトだ。 その日経電子版が11月6日に全面リニューアルしたのだが、公開後、web業界がにわかにざわついた。表示速度が爆速だったのだ。日経公式もモバイルで2倍の表示速度を達成したと堂々と宣言していた。 webサービスは継続率こそ神KPIで、その継続率には速度が大きく影響する。 これはチェキらないとヤバイと感じ、友人のkitakさんとスピードの秘密を調査してみた。 Fastlyをコンテンツキャッシュに使う殆どのデータはFastlyを経由して取得されていた。Fastlyは最近注目を集めているCDN（世界中にエッジサーバーを配置し、高速にコンテンツを配信するサービス）で、非常に高機能でユニークなサービスだ。 一般に、CDNはいったん世界中にコンテンツをばらまくと、それを無

[pianocello7]

高速っていっても昔から、飛ばし記事が多いからね。

[TakamoriTarou]

日経はたしかシステム内製で専任担当がすごいひとって話をどっかで読んだ覚えがかすかに

[masato-ka]

エンジニアのハイアリング一生懸命してたのが功を奏してたのでは。これでWEB版の収益が上がってそれを日経新聞自身で記事にして世に知らせて欲しい。

[fukken]

技術的にもだけど、大規模サイトでこのレベルの変更を実施できる社内交渉力がまず何より強い

[moronbee]

fladdictさんとnaoyaさんに協力してもらい内製化する! と決めたボスがえらいと思う。経緯はここら辺に https://speakerdeck.com/natsuz/ri-jing-dian-zi-ban-apurinei-zhi-kai-fa-falsewu-tai-li?slide=18

[fishma]

webpはサイズ小さくなる（可逆でもpngより小さくなる）のは素晴らしいけどデコード遅い（HW支援も厳しい）のに注意。トラフィックがボトルネックならいいけど既にストレージにキャッシュ済みだと既存formatの方が大抵速い

[ledsun]

いいなー。こういう賞賛を浴びる、実装をしたい。

[kvx]

こんな新しい技術をつかってこの規模のサイトをリニューアルしてくれる会社がどこなのか気になる。

[timetrain]

サービスの費用徴収がうまくいってるせいかちゃんと投資してるのな

[lyiase]

webpだけど、accept見てjpgかwebpか判断してるな。対応してないブラウザではjpg返してくる。多分、サーバー名からしてimgixってCDNを使ってるっぽい。 https://www.imgix.com/

[masatotoro]

Fastlyがすごいのか？

[kiriano]

高速化

[cozyconemotel]

あらゆる高速化技術を取り入れてる。特にfastlyの採用がすごい

[miyatakesan]

高速化できると気持ちいいだろうなぁ。

[hi-hats]

“Fastlyは超高速に無効化が可能なつくりになっている”   ここ詳しく聞きたくてYamagoya予約したのに行けず…

[matsumoto_r]

ServiceWorkerとResource Hintsによる先行キャッシュ戦略をきちんととっているの素晴らしいなぁ。 HTTP/2の文脈でのServer-pushと前述の戦略の組み合わせや優先度制御はなんかやってるのかな

[soranopapa]

“。日経公式もモバイルで2倍の表示速度を達成したと堂々と宣言していた。”現代のフロントエンドのベストプラクティスが詰まっていて参考になることばかりだった。Devtoolを見ながら観察するだけでも勉強になるので試

[ginpei]

ざっくり技術解説。CDNでコンテンツキャッシュ、ServiceWorkerとResource Hintsで先行読み込みとローカルキャッシュ、HTTP/2で通信オーバーヘッド削減、WebPで画像軽量化。

[blueribbon]

・Fastlyをコンテンツキャッシュに使う ・ServiceWorkerによるブラウザキャッシュ ・お手本のようなHTTP/2の使い方 ・Resource Hint APIによる先読み ・躊躇なくwebpを投入

[robamoto]

特にスマホで見ると「ほんとに読みに行ってるの？」って不安になるくらい早くてびっくりした。サイト側の改善でここまで高速化できるんだ。

[ytabuchi]

技術者がこんなに頑張って爆速サイトを作ってるんだから記者はもう少しスピードを緩めてほしいw

[kusigahama]

webpは普通に使えるくらいには普及したんだ。Appleの.heicも流行らないかなー。

[KoshianX]

日経はそれだけ予算が取れてるのがすばらしいねえ……。

[s99e209]

なるほど、フロントエンドの高速化のためにServiceWorkerを導入するって発想もあるのか。

[yohskeey]

ほんとにドン引きするくらい早かった

[luccafort]

こういう解析、解説エントリは非常に学びがある。フロントエンド界隈のひとたちからしたら当たり前なんだろうけどもその辺疎いのでそんな使い方するのか！とかこの機能ってこういうことだったのか！ってなる。

[mizchi]

フロントエンド界隈で話題になってたやつだ

[rzi]

たしかに速い、すごい！

[tmatsuu]

webpに関しては画像配信CDNのimgixを使ってる模様。cache-controlにimmutableの文字を見つけておーモダンだと思った。

[taky1973]

「ServiceWorkerが他ページのアセットをダウンロード」は、痛い目にあう格安SIMユーザーが出るよなぁ

[juangotoh]

日経電子のバーン！

[tsupo]

fastly, webp

[morototo]

確かに高速になってた

[bk246]

Fastly、ServiceWorker、HTTP/2、Resource Hint、webp

[ayakohiroe]

“Devtool”

[dogwoood]

うむ。

[Ashizawa]

はやいと言っても結局2秒ぐらいかかるのね

[suzukiMY]

ServiceWorker、HTTP/2

[solidstatesociety]

飛ばし記事も早い

[shin1x1]

Fastly / ServiceWorker / HTTP/2 / Resource Hint API / webp