ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。Yahoo!広告を担当しているソフトウェアエンジニアの加藤です。 iOS/Androidにアドテクノロジーといった領域は変化が激しいため、それが楽しくもありますが、大変です。自分たちだけではコントロールが難しいOSの仕様変更や不具合対処など、外部起因の変化に対して強いプロダクトをiOS/Android上で提供するために、実践している工夫を紹介します。 私が担当するYahoo!広告での事例とはなりますが、この3個に絞ってご紹介します。可能な限り広告以外でも適用可能な工夫として説明します。 アプリやアプリで利用されるSDKに不要な知識を持たせないようにしよう 変化が起こり得るタイミングでは、E2Eテストをしよう OSもOS

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは、映像サービスプロダクト本部の浜田（@narirow）です。 GYAO!では最近トップページの大規模な変更が行われました。本記事では映像サービスのバックオフィスを含む大規模な構成変更と、その成果として得られたスケーラビリティ・ページの表示速度の向上についてをお話しします。 GYAO!のトップページの特徴 映像サービスであるGYAO!のトップページは、豊富なラインアップの中から作品を厳選して掲載しています。有名作品をただ並べるだけではなく、レコメンデーションやターゲティングの技術を使って、閲覧者の趣向にあった作品を一覧しています。大量の画像が表示されていることに加え、縦に長いページ構成となっています。 課題と解決のアプロー

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。Yahoo!ニュースを担当しているエンジニアの喜楽です。 2020年5月、GoogleよりWebでのユーザー体験を指標化したCore Web Vitalsが発表されました。本記事では、Yahoo!ニュースにおけるCore Web Vitals指標改善の取り組みとその効果についてご紹介します。 Core Web Vitalsとは Webページを閲覧しているときに、コンテンツの表示が遅かったり、スクロールやクリックなどの反応が悪い、レイアウトが読込中に変更され、クリックしたい要素の位置がずれてしまうなどといった経験はないでしょうか。これらはユーザー体験を低下させる一因となります。Core Web Vitalsは上記のような

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog サイトオペレーション本部に所属している大津と申します。普段CDNとNode.jsサポートの仕事をしていて、第9代黒帯（ヤフー内のスキル任命制度／ネットワーク・セキュリティ）に任命していただいています。1 先日ヤフー社内で黒帯LT会が開催されました。お題目は事前に指定された「専門的技術力を極めるための極意」ということで、10分ほど話をしました。しかし、これまでみたいにセミナールームで大勢の前で話すわけではなく、最近代わり映えしない自宅デスクからのオンラインLTは、正直勝手が違いました。時間配分もミスって中途半端に終了です。と思いきや数日前、このYahoo! JAPAN Tech Blog担当者から「いやー、よかったですよ。そのネタ書

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちはお久しぶりです。岡部和昌（@kzms2）と申します。 今回お話しする内容はタイトルでほぼ全部述べているのですが、PC 版 Yahoo! JAPAN のトップページを 2019 年 10 月 1 日に刷新、主に開発環境をアップデートした経緯と採用した技術に関してのお話です。 見た目に関しては特に大きな変化はなかったので、気が付かなかった方も多いのではないでしょうか？ なぜ刷新したか Yahoo! JAPAN トップページは 2008 年 1 月 1 日に大規模なリニューアルを行いました。その頃からある程度の改修はあったものの、基本的にはコードの継ぎ足しで修正を加えている状態でした。 （参照；Yahoo! JAPAN トップ

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。今期から Web フロントエンド領域で黒帯を務めることになりました伊藤（@koh110）です。 普段は情報システム本部に所属しチャットなど内製基盤の開発・運用をしつつ、Node.js 言語サポートチームとしてサーバサイド TypeScript の活用や、SSR（Server Side Rendering）、BFF（Backends For Frontends）のチューニング支援なども行っています。 ヤフーには Node.js と JavaScript の言語サポートチームがあります。Node.js サポートチームは主にバックエンドとして、JavaScript サポートチームはフロントエンドとして、それぞれ JavaSc

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。PayPayモールのエンジニア関と、Yahoo!ニュースのデザイナー萩野です。 皆様、突然ですがPortalsをご存じでしょうか。 Portalsとは、新しいHTML要素です。2019年11月11日〜12日にサンフランシスコで開催された「Chrome Dev Summit 2019」（以下CDS）でも紹介されました。 本記事では、Portalsが可能にする新しいWebでの体験をご紹介します。 Portalsとは？　なにができるの？ Webブラウザー上でユーザーにとって良い体験を提供するためには、表示速度の向上が欠かせません。 Portalsを利用すると、画面遷移の体感速度を向上させることが可能です。 まずはこちらの比較

こんにちは、Yahoo! JAPANのCDNを運用している佐藤です。 6月にプレスリリースが掲載されましたが、3月23日から4月3日にかけて第91回選抜高等学校野球大会が行われ、Yahoo! JAPANでは全試合のライブ配信をしていました。今回のライブ配信では弊社初の試みとしてIPv6を用いた動画配信を行いましたので、ライブ配信の構成やIPv6も含めたリクエスト傾向について紹介します。 ライブ配信に向けての準備 試合日程は3月23日から4月3日の11日間でしたが、ライブ配信は3月14日のキャプテントークや3月15日の組み合わせ抽選会でも行っていました。コンテンツの配信周りはCDNチームを始めとしたインフラ部門が担当しており、主にCDNチームが担当した内容は下記の通りです。 メディア部署との調整 新しいCDN環境の構築 高負荷時の負荷分散対策の準備 配信に向けてのCDN環境は、現在トップペー

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog サイトオペレーション本部でCDNの仕事をしている大津と申します。他にも社内セキュリティガイドラインの作成や、Node.jsのサポートもしています。 今週、4月17・18日に東京で開催するAMP Conf 2019 において、「Maximize Yahoo! JAPAN 's UX with AMP and Signed HTTP Exchanges」（AMPとSigned HTTP Exchangesを使ってYahoo! JAPANのUXを最大化する）という発表を行います。プレゼンでは、最初に駒田がYahoo! JAPAN全体とYahoo!トラベルの取り組みについて、次に私がSXGシステムの技術解説、最後に宗像がYahoo!検索の

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。Hack Dayで技術コメンテーターをしていた、フロントエンドエンジニアの加藤と申します。 2017年の1月中旬に当時のHack Dayのマネジャーから「来月のHack Dayでコメンテーターしてみない？」と突然の指名を受けてから2年弱立ち、その間3回のHack Dayがありました。 個人的には未だ技術コメンテーターをするたびに「こうすればよかった...」など、課題に感じることは多いのですが、そういった点やこのあたりは気をつけているといった点を社内にあるナレッジ共有サービスに投稿してみたところ、比較的好評だったため、今回社外向けにアレンジして紹介します。 Photo by 中村友一（公式カメラ隊） about Hack

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。言語サポート（Node.js）チームの伊藤（@koh110）です。 Node.js v10 も10月にLTSとなり async/await によるフロー制御は当たり前のように利用されるようになってきました。JavaScriptの非同期処理は async/await から覚える人も今後増えていくでしょう。今回はそんな非同期処理について、社内での事例を交えて記事を書いていこうと思います。 index Promise 化がなぜ重要なのか ユーザーに promisify をさせる落とし穴 Road to Promise まとめ Promise 化がなぜ重要なのか ちょうど3年前のアドベントカレンダーで、今後はいろいろなモジュー

部屋への入室は招待かURL欄に部屋名を直接入力で可能です。もし入力した部屋が存在しなかった場合、新規に部屋が生成されます。 非公開設定はいらないのではないか、とよく言われるのですが「入室を拒んでいるわけではないが検索を汚したいわけではない」という日本人的なニーズを満たしていて僕は気に入っています。先の記事で数字が載っていた通りMYM上には部屋が全部で15万ほど存在しますが、この公開設定のおかげかこれだけの部屋数になっていても検索性をあまり損なっていません。 ヘビーに利用するユーザーであれば数百を超える部屋に入室するのは当たり前で、2000をオーバーすることも珍しくはありません。例えば僕は1000部屋以上入室しています。 > document.querySelectorAll('.list-myroom li').length 1109ぱっとこの数字だけ聞くと、まともに処理できる量を超えてい

特筆すべきはボット数かもしれません。ボットは何らかの操作を自動で行うために作られたプログラムで動作するアカウントなのですが、なんとそのボットの数（14,000）がユーザーの数（18,000）に迫りつつあります。MYMのボットは通常ひとつの部屋にリンクしているため、おそらく同じような機能を持ったボットが大多数だと思われますが、ボット数 14,000 はインパクトのある数字ですね。 興味深い部屋の数々 MYMはこの8年間で計150,000の部屋が生み出されました。業務系・技術系・雑談系を問わず、異彩を放つ部屋は数え切れないほどあります。ここでは数多くの部屋の中でも、ひときわ特徴的な部屋を紹介してみようと思います。 もちろんすべての部屋を把握しているわけではないため、あくまで把握している範囲内での紹介となることをご了承ください。 トピックス編集 Yahoo!ニュース トピックスの編集業務に活用さ

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは、データ＆サイエンスソリューション統括本部所属の後藤泰陽（@ono_matope）です。少し時間があいてしまいましたが、9月19日にお茶の水女子大学で開催された WebDB Forum 2017 において、分散オブジェクトストレージ “Dragon” について講演しました。良い機会なので、本エントリでもDragonについてご紹介させていただきたいと思います。 発表資料 WebDB Forumでの発表資料については以下をご覧ください（講演時の内容と一部異なります）。 日本語版 Dragonとは？ Dragonは、ヤフー・ジャパンで開発された分散オブジェクトストレージシステムです。Amazon S3互換のWeb APIを実装

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。Node.js 言語サポートチームの柄澤史也 (@fmy) です。 12/6のエントリ「今年のうちに対応したい、Node.jsのBufferに潜む危険性」に引き続き、社内での Node.js Core API 勉強会の内容を紹介します。 1. Stream API の重要性 Node.js 界隈の有名な言葉に次のようなものがあります。 「Stream を制するものは、 Node.js を制す」 Node.js 最大の特徴は何と言っても非同期 I/O です。 そしてその非同期 I/O の実装こそが stream モジュールなのです。 HTTP サーバのリクエスト・レスポンス gulp のようなタスクランナー TCP ソケ

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。Node.js言語サポートチームの加藤佑典です。 普段はYahoo!ブックストアの開発/運用を主にしています。 先日、同じチームの柄澤がNode学園祭 2016の発表でも少し触れていますが、今期から社内でNode.jsの言語サポートチームが発足しました。 本日はそのチームメンバー+有志で行っているNode.js Core APIの勉強会で話題になった、Buffer APIの変更点について触れたいと思います。 本記事はNode.js v6.9.1 Documentationをベースに書いています。 1. はじめに 勉強会は、以下のようにAPIをカテゴリ分けし、基礎的なAPIであるカテゴリー1のものから順に進めています。

初稿ではAVX2による効果ではないかと記述をしておりましたが、stitchedではなく、multi bufferのサポートやその他要因が混合しており数値検証が完全ではないという指摘をいただきました。 記事内容の訂正を行います。検証が不十分なままの掲載となり申し訳ございません。また、数値や技術的な裏付けは今後再検証を進めていこうとおもいます。 サイトオペレーション本部（＊1）を兼務させていただいている匿名希望の社員Mです。 私はハードウエアとソフトウエアの両面から指数関数的に増えるデータ処理にコツコツ対応する仕事をやっております。 今回の取り組みは以下の投稿に影響を受けた取り組みです。 Accelerating SSL Load Balancers with Intel® Xeon® v3 Processors https://software.intel.com/en-us/article

ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog 「細かいと言うより長いよね」 はじめに こんにちは。ATS の脆弱性を発見した小柴さんや ATS に HTTP/2 の実装を行っている大久保さんと同じチームの一年目、匿名社員M さんからいじられている新人です。今回ありがたい事に、こういったすごい方々を含めモヒカン諸先輩方より「何か書かないの？」「いつ書くの？」という数々のプレッシャーお言葉をいただきました。 というわけで、SSL/TLS の Session 再開機能に関して書いていこうかと思います。 SSL/TLS は機密性、完全性そして真正性に対して安全な通信を行うための仕組みです。しかし、この仕組みは暗号技術を多用し特に接続において複雑なプロトコルを用い、Client, Se

ストリームによる多重化 2つ目の特徴は「ストリーム」です。従来のHTTPでは、リクエストとレスポンスの組を1つずつしか同時に送受信できないことが、パフォーマンス上のボトルネックになっています。この問題を改善するべくHTTP/1.1では新たにパイプラインが導入されましたが、一部のレスポンスに時間がかかるような場面でレスポンスが詰まってしまう問題などがあり、広く使われてはいません。そこで、HTTP/2では1つの接続上にストリームと呼ばれる仮想的な双方向シーケンスを作ることでこの問題に取り組んでいます。 1つの接続上に作られた複数のストリーム上では、複数のフレームを同時並行で転送できます。例えば、あるストリーム上ではリクエストにあたるフレームが送信中でも、別のストリームではレスポンスにあたるフレームを受信するといったことが可能になります。これにより、全体的なパフォーマンスが向上します。 ヘッダー