More than 3 years have passed since last update.

一念発起してYahoo!JapanTechConference2019 in Shibuyaに参加してきた

Posted at 2019-12-18

2019/12/13(金)に行われた、Yahoo!Japan(以後Yahoo)が主催するカンファレンスに参加してきました。

カンファレンスってレベルの高い人とかセッションだらけというイメージがあり、気後れして結構スルーしてきた過去があるのですが、
今回たまたま開催のお知らせが目に留まり、一念発起して仕事を(半ば無理に)休んで行ってきました。

せっかくだし写真いっぱい撮るぞ！と意気込んで参加したものの、セッション聞き入ったりツイッターで実況したりですっかり写真の事を失念してしまいました。
なので、写真を見て雰囲気を掴みたいという方にはあまり面白くないかもしれません。

会場の写真はYahoo公式のTech Blogにも掲載されておりますので、合わせてご覧下さい！

基調講演

基調講演ではCTOの藤門さんが登壇されました。
内容としては、

藤門さんがYahooのCTOになってから5年間で、どの様な取り組みをしてきたか
これからYahooが目指すビジョン

のお話が中心でした。
基調講演についてはYoutubeにアップされています。（前述したBlog内にYoutubeへのリンクあり）

個人的に印象に残った点

以下、内容を一部抜粋した箇条書きです。

うまくいかない３つのレガシーを、それぞれモダナイゼーションしていった。(画像１枚目)
マインドのモダナイゼーション
- 会社のトップ自らが人の前に立ちメッセージを伝える
  - トップダウンで伝言ゲームの様に伝えるだけでは真意は伝わらない
- 自分ごとにして取り組む
  - 本気で世界を変えていくマインドを持つ
- 困難なことにチャレンジする
  - チャレンジへの応援策：社内LT開催やイベント登壇の促進、技術補助費月１万、副業OK、海外イベントへの旅費も出す
テクノロジーのモダナイゼーション
- とにかくサービスを世に出すスピードを早める
  - コンテナテクノロジーを活用したクラウドネイティブな開発環境
  - CI/CD導入
  - 全て１からMakeすることもできるが、スピードアップの為にMakeとUseを使い分ける（OSSを使っていく）
  - アプリケーション開発に注力できる環境を作る（画像２枚目）
習慣のモダナイゼーション
- 負債が増える習慣を変える
  - 取り組む理由を伝え続ける
  - ルールをシンプルにする　ルールとドキュメントをそれぞれ一箇所に集約する
- 負債が増えにくい開発手法を選択する
  - スクラム開発やペアプログラミングの実施
結果的に、開発スピードが向上。世にリリースする回数も増えた
Yahoo!JapanのエンジニアリングはSpeedが重要！

基調講演を通して、いかにYahooが世に出すスピードを大切にしているかが伝わってきました。
そしてその為に技術だけではなくマインドや習慣も変えていこうという意識や達成するためへの取り組みは、
非常に力強く徹底されており組織全体に行き渡っているなと感じました。

個人的に刺さったのは、マインドのモダナイゼーションのお話しの中に出てきた「社内LT実施」です。
今私が勤めている会社でも社内LTの取り組みがありましたが、技術スタックの違いや発表できる場の少なさ、自らキャッチアップする人が多くないなど様々な要因であまり根付きませんでした。
お聞きしたところYahooさんでは技術ごとにLT大会が不定期に発生するそうで、自ら情報を発信・受信する技術的成長のマインドがとても強く根付いているなと感じました。
また、定期的に開かれるYahooさん主催イベントの「Bonfire」等、登壇する機会が多く技術者として成長できる場が多く提供されているのも魅力的だなと思います。
エンジニアとして成長できる環境が整っていて、とても羨ましいです

各セッション

特に印象に残ったセッションを抜粋してレポします。

`B-1 PayPayモールのAMP活用とデザインシステム`

デザインシステム　×　AMPの実現
デザインの統一の為、スタイルガイドを制定した
- 使う配色やpadding、Z-indexなどの原則を定めた
- 上記原則をSCSS変数を活用し管理した
- デザインはZeplinに載せ、PJ内でいつでもだれでも見られる様にした
コンポーネントはAtomic Design思考で作成した
- AMPコンポーネントをベースにコンポーネント（UI上で使うパーツとか）が作れる
- コンポーネント外部から使いたい情報を渡す前提で作り（Propsで渡す）、再利用性を高くした
実現へのブレイクスルーとして、Nuxt.jsを導入した
実現する為にはNuxt.jsとNPMパッケージで対応可能
唯一AMP validatedなページにすることが上記では対応出来ない。
- その為に、Nuxt.js hookによるビルド拡張を導入した
AMPの活用
AMPコンポーネントを用いれば、カルーセルなどが簡単に作成出来る
AMPキャッシュのパーソナライズを実現できた

今回のセッションの中で一番技術スタックが近く、特にSCSSで管理やAtomic Design採用の強みのところでめっちゃうんうん頷いていました。

後半のAMPの話は新鮮で、「なんか検索すると稲妻マークがつくページあるなあ」くらいの認識だったので新たな知見を得ることができました。
AMPコンポーネントもお初だったのですが、Material-uiの様に使えたり動作が軽かったりと、非常に魅力的に聞こえました。

ただ、AMPValidation時にはJSが使えないや自由度が低いというところが気になっていて、具体的にどんな感じなのかは試してみて実感したいと思います。

`LT 新しいHTML<portal>を利用した画面遷移設計〜PayPayモールとYahoo!ニュースの事例を添えて〜`

LTなのでスライドが公表されておりませんが、内容としては以下の記事のLTでした。

新しいHTMLタグportal、Portals機能で変わるWebの遷移体験！　CDS2019で紹介されたヤフーの実装例 #UIUX

Yahoo! JAPAN Tech Blogより
https://techblog.yahoo.co.jp/entry/20191118780830/
まだChromeでしか使えず、限定的な機能である
今回紹介された「一覧画面→詳細画面への遷移時」を例にとると、以下の様な感じ（上記Blogに動画あり）
1. 詳細画面への遷移リンクを踏む
2. 用意した要素（ここでは詳細画面チックなスケルトン）を一覧画面のURLのまま表示させる（普通はここでローディングとかになる）
3. 詳細画面へ遷移完了（URLも変わる）
<iflame>と<a>のいいとこ取りの様なもの
レンダリング処理をユーザーに見せない、シームレスな遷移体験を提供することができる
提供されているAPIも簡単で、実装も容易

<portal>が他ブラウザにも普及していけば、今後多用されること間違いなしかな、と思わせるLTでした。
また、スピーカーの方もおっしゃっていましたがまだまだ便利な使い方を見つけることが出来そうです。
自分も是非お試し実装して体験してみたいと思います。

`B-6 YDNレポートジョブ渋滞に機械学習でたちむかってみた`

YDNレポートとは、Yahooが提供する広告サービス「YDN」を利用する広告主（広告を出す側の人）に、出している広告がどれくらい見られているかをまとめたレポート
ある日を境に、ジョブ渋滞が発生
レポート生成のための集計処理にとてつもなく時間がかかるケースが大量に投入される様になった
重い処理がQueueに入ると、後続の処理（軽い処理も含めて）が渋滞し処理不能になった
軽い処理救済の為の救済として、重い処理専用のQueueを作ったが、軽い重いの判別をつけること自体に時間がかかってしまう
処理の重さの判別を付けるために、機械学習を導入。　無事重い処理を専用Queueに流すことができる様になった。

自分は機械学習に疎いので、機械学習といえば「画像識別」や「株価予想」を連想しがちでした。
そんな中、処理フローの課題解決のために機械学習を活用するアイディアを聞き、その様な使い方があるのかと驚かされました。

課題解決の為に機械学習を使いこなすことが選択肢に入ってくると、より困難なケースが打破できる様になりそうですね。
他にも機械学習を生かして課題解決した事例があれば是非聞いてみたいなと思いました。

アフターパーティー

カンファレンス経験がほとんどないので、このようなアフターパーティーも初参加でした。
一時間ほどの短い時間でしたが、とても充実したアフターパーティーだったと思います。

特に登壇者のみなさんが各テーブルにいらっしゃり、直接お話しさせていただけたのが刺激になりました。
（CTOの藤門さんとも直接お話しできる貴重な機会！）

またYahooプロパーさんのみならず、他の参加者の方と技術的な話や仕事の話（愚痴？）も出来たりできる貴重な場でした。
（React v15からv１６にあげたら結構違くて困る！とか、Kubernetes出来る人全然いない！とか、AMPめっちゃ便利そう！とか話しました。）

インプットだけになりがちなカンファレンスにおいて、質問したり感想会をしたりできるこういう場が大事なんだなあとしみじみ思いました。。。
「話せるかどうかわからないしカンファレンスは出るけどアフターパーティーは遠慮しがち、、、」はもったいないと思います！

感想

セッション一覧からもわかる様に、昨今流行っている機械学習や、PayPay関連のセッションが多くとても面白かったです。
特にPayPay関連のセッションである
「B-5 PayPayアプリにおけるオンラインとオフラインのユーザー体験」
「A-6 CtoCフリマアプリの作り方〜6ヶ月間のPayPayフリマ開発を支えた設計〜」
には非常に多くの人が参加されていたのが印象的です。
(セッション会場に入場する長蛇の列ができていました）
PayPayへの関心の高まりを肌に感じ、改めてYahooさんの影響力の高さを実感しました。