タグ

ブックマーク / techblog.yahoo.co.jp (39)

  • ブラウザの戻る/進むを高速に!ヤフーにおけるBFCache有効化に向けた取り組み

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは、第11/12代黒帯(ヤフー内のスキル任命制度/Webフロントエンド領域)の浜田(@narirow)と、Yahoo!ニュースのエンジニアの喜楽(@gladenjoy)です。今回は、ヤフーで対応をすすめてきた、BFCacheの有効化にむけた取り組みについてお話しします。BFCacheとはそもそも何か、有効化のボトルネックには何があるか、そして調査方法などの具体的な手法などを交えてご紹介します。 ヤフーではこれまでスムーズなユーザー体験を実現するべく、高速にページを表示できるBFCache技術の検証と、BFCacheの有効化率を上げる取り組みを行ってきました。その結果、Yahoo!ニュースでの検証では、PVが+2%向上、広告

    ブラウザの戻る/進むを高速に!ヤフーにおけるBFCache有効化に向けた取り組み
  • 25年続くYahoo!ニュースを支える、Figmaを用いたデザインシステム

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。Yahoo!ニュースでデザインを担当している萩野と小股です。 Yahoo!ニュースは、Yahoo! JAPANが運営する国内や海外のニュースを閲覧できるサービスです。1996年にサービスを開始し、2021年には25周年を迎えました。 そんなYahoo!ニュースでは、2020年より「Figma」を用いてデザイン業務を行っています。この記事では、Figmaの利用に至った背景や、運用し続けられるものにする工夫、デザインシステムによってデザイン業務がどのように効率化されたか、お伝えします。 Yahoo!ニュースが抱えていたデザインにおける課題と解決方法 この章では、Yahoo!ニュースが当時抱えていた複数のデザイナーがデザイン

    25年続くYahoo!ニュースを支える、Figmaを用いたデザインシステム
  • Yahoo! JAPANでの生体認証の取り組み(FIDO2サーバーの仕組みについて)

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog 目次 はじめに Yahoo! JAPANが対応したWebAuthnとは WebAuthnとFIDO認証について WebAuthnの処理について 登録と認証の流れ 削除機能 ブラウザーでの実装 navigator.credentials.create()について navigator.credentials.get()について サーバーでの実装 登録(公開鍵の登録) /attestation/optionsの処理 リクエストパラメーター navigator.credentials.create()の引数に必要な値 /attestation/resultの処理 CBORについて attestationObjectについて 公開鍵を作成す

    Yahoo! JAPANでの生体認証の取り組み(FIDO2サーバーの仕組みについて)
  • ヤフーのIE11 サポート終了の進め方

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。第11代黒帯(Webフロントエンド/ヤフー内のスキル任命制度)の伊藤(@koh110)です。 普段はCTO室にあるWebフロント技術室で、全社のフロントエンドに関わる仕事をしています。 最近の仕事のひとつとして、IE11 の非推奨の案内 がありました。 Yahoo! JAPANでは、Internet Explorer 11を推奨ブラウザーとしていましたが、Microsoft社のInternet Explorerサポート終了に伴い、2021年9月7日をもってYahoo! JAPANにおけるInternet Explorer 11でのご利用を非推奨とさせていただきます。 この案内についてTwitterや記事などで触れていた

    ヤフーのIE11 サポート終了の進め方
  • ブラウザバック時の表示を最適化する Yahoo!ニュースの取り組み事例

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。Yahoo!ニュース を担当しているエンジニアの喜楽です。 今回は、Yahoo!ニュースが取り組んでいるブラウザバック時の表示最適化手法について紹介します。 なぜブラウザバック時の挙動に注目するのか ユーザーがYahoo!ニュースのページを閲覧し、別のページに遷移する方法は大きく分けて以下の2つが考えられます。 (A) リンクをたどってページを遷移する (B) ブラウザーのナビゲーションボタンまたはスワイプ操作によって遷移する 「戻る」による遷移(ブラウザバック) 「進む」による遷移(ブラウザフォワード) Yahoo!ニュースでは総PVのうち一定程度が(B)のブラウザバックまたはブラウザフォワードによるページ遷移時のも

    ブラウザバック時の表示を最適化する Yahoo!ニュースの取り組み事例
  • よりセキュアなHadoopの作り方 〜 ApacheCon Asia 2021登壇報告

    HDFSのブロックデータ転送の暗号化 HDFSの実データに相当するブロックデータの転送に対する暗号化はRPC暗号化とはさらに別のパラメータで管理されています。 hdfs-siteの dfs.encrypt.data.transfer を true に、 dfs.encrypt.data.transfer.cipher.suites を AES/CTR/NoPadding にそれぞれ指定することで有効化します。 この設定を無停止で反映するにあたっては、転送の暗号化設定の反映済/未反映を判別する dfs.trustedchannel.resolver.class によるノードの動的な管理、場合によっては拡張による独自実装が必要となります。 HDFSクライアントおよびNameNode・DataNode間で dfs.encrypt.data.transfer の真偽が一致していない場合はブロックデ

    よりセキュアなHadoopの作り方 〜 ApacheCon Asia 2021登壇報告
  • あなたの会社のなりすましが現れたら? 迷惑メール対策方法とYahoo!メールのDMARC導入事例紹介

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。エンジニアの中村成陽と申します。Yahoo!メールを担当しております。 今回の記事ではなりすましメールについての説明と、その対策としてYahoo!メールに導入した送信ドメイン認証技術のひとつである「DMARC」についてご紹介します。そしてこれらを踏まえ、なりすましメール対策のために何ができるのかをご紹介しますので、参考になれば幸いです。 なりすましメールとは? なりすましメールとは、送信者自身のものではない、うそのメールアドレスを詐称、つまり別のメールアドレスからのものであると偽って送られたメールのことです。 送信元メールアドレスには、手紙でいえば封筒に記載する差出人となる EnvelopeFrom アドレスと、中身の

    あなたの会社のなりすましが現れたら? 迷惑メール対策方法とYahoo!メールのDMARC導入事例紹介
    ya--mada
    ya--mada 2021/07/05
    🤔 管理者のリソースが無いとツラいんだよ。いや、簡単なのはそうなんだけどさ。しかし、メールだとなんでヘンテコな法解釈が入ってしまうのだろう? https://active.nikkeibp.co.jp/atclact/active/17/110800178/110800004/?ST=act-security&P=2
  • 2020年度末のCSS総まとめ!有用でオススメな覚えておくべき新仕様をコードと画像付きで解説

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちはお久しぶりです。Web標準黒帯(ヤフー内のスキル任命制度)の岡部和昌(@kzms2)と申します。 今回の記事はありがちな「たくさんの良さげなCSSのプロパティなどを羅列してひたすらまとめる」だけではなく以下の考えのもと、まとめた記事です。 岡部が「使うケースがある・覚えておくべき」と感じたオススメできる、または有用と判断したCSS 可能な限り2020年からブラウザに実装された、またはこれから実装されるCSS 比較的新しいまたはあまり使われている印象がないCSS 実際のコードや挙動、対応ブラウザを掲載 自分目線でみたコメントや使えそうな場面をできる限り丁寧に説明 つまり2020年に実装されたものを中心に、有益でオススメでき

    2020年度末のCSS総まとめ!有用でオススメな覚えておくべき新仕様をコードと画像付きで解説
    ya--mada
    ya--mada 2020/12/22
  • ヤフーのスクラム開発実践者の経験年数ごとの学習方法の紹介

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは! アジャイルコーチの荒瀬です。 ヤフー、および関連会社のアジャイル開発支援や研修を担当しています。 今回はヤフーのスクラム実践者の学習方法についてお話しします。 イベントや研修の中で、スクラムの勉強方法をいろいろな方から質問されることが多かったので、記事にするとより多くの人の役に立つのではないかと思い執筆することにしました。 また、せっかく書くのであれば、ヤフーの中にいるさまざまなスクラム実践者の話も交えると、経験年数別に、より参考になりそうな書籍、セミナーや研修を紹介できるのではないかと考え、ヤフーのスクラム経験者にも協力いただいています。 スクラムを始めた頃の自身のことを考えながら、こういう記事があるといいのにと思

    ヤフーのスクラム開発実践者の経験年数ごとの学習方法の紹介
    ya--mada
    ya--mada 2020/12/17
    んー?
  • 大規模オンプレミスなヤフーのサーバーインフラの裏側 ~ サーバーインフラエンジニアの視点

    物理サーバーの評価 物理サーバーを導入する前にヤフーでは、必ずサーバーの評価を実施します。 評価項目は大まかに分けると下記です。 物理運用性の評価 パフォーマンスの評価 自社ツールの動作を評価 ヤフーの評価で特徴的なのは「物理運用性」の評価だと考えています。 オンプレミス環境で運用しており、物理作業の「簡単さ」「分かりやすさ」も全体の工数へ影響するため、注意している点です。 ラッキングレールの評価 ボタン、インジケーターの評価 他の評価にボタン、インジケーターの評価があります。 データセンターの中で物理サーバーに対して物理的な作業する際には、 持ち込める物、参照できる情報が限定されています。 また、大量のサーバーがある中でピンポイントで作業する必要があるため、 現地作業者が目視で直感的に、かつリモートから作業指示者と認識を共有しやすいことが重要です。 下記はボタン評価の際に注意しているポイ

    大規模オンプレミスなヤフーのサーバーインフラの裏側 ~ サーバーインフラエンジニアの視点
  • 社内勉強会で専門的技術力を高めるには

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

    社内勉強会で専門的技術力を高めるには
  • JSON Web Token(JWT)の紹介とYahoo! JAPANにおけるJWTの活用

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは。 IDソリューション部の都筑です。 新卒2年目で普段はYahoo! ID連携のサーバーサイド、iOSのSDKの開発などを担当しています。 今回は最近ユーザーやデバイスの認証で用いられる”JSON Web Token(JWT)”についての解説と、Yahoo! JAPANと他社の活用事例を紹介したいと思います。 JWTとは? JWTとはJSON Web Tokenの略称であり、属性情報(Claim)をJSONデータ構造で表現したトークンの仕様です。 仕様はRFC7519(外部サイト)で定められています。 特徴として、署名、暗号化ができ、URL-safeであることなどが挙げられます。発音は"ジョット"です。 JWTと関連す

    JSON Web Token(JWT)の紹介とYahoo! JAPANにおけるJWTの活用
    ya--mada
    ya--mada 2020/07/21
    JWTと書いてジョットと読むの?JWEはジョーですか?マジか知らんかった。
  • クラスタ数530以上、大規模Kubernetesを運用するエンジニア組織の作り方 #k8s

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog みなさんこんにちは。 システム統括部に所属し、プライベートクラウドのKaaS(Kubernetes as a Service)の担当をしている藤江です。 私は2007年にヤフーに新卒で入社し、会計システムや社内認証システムなどの業務システムの開発・運用経験を経て、2017年4月から今のKaaS運用業務をしています。 現在のプロジェクトではScrumを導入しており、プロダクトオーナーとして働いています。 さて、いきなりですが最初に質問です。Kubernetesというツールを知ってますか? 実際に業務で使っていますか? 去年の1月に開催されたYahoo! JAPAN Tech Conferenceの登壇で、この質問をした時、会場で手

    クラスタ数530以上、大規模Kubernetesを運用するエンジニア組織の作り方 #k8s
    ya--mada
    ya--mada 2019/12/12
  • Yahoo! JAPAN トップページを Atomic Design と React・Redux・TypeScript で作り変えたお話

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

    Yahoo! JAPAN トップページを Atomic Design と React・Redux・TypeScript で作り変えたお話
  • 守れサイバーセキュリティ~SOCとは? ヤフーにおけるその役割

    はじめまして。 ヤフーSOCの中村です。 みなさんは、SOCという言葉をご存じでしょうか? サイバーセキュリティの重要性が強く求められるようになった近年、このSOCという言葉を耳にすることも多くなっているように思います。 その一方で「SOCとは何か」「具体的に何をしているのか」といった部分は、まだあまり知られていないように感じています。 今回は「SOCとは何か」、そして「ヤフーSOCでは具体的にどんな活動をしているのか」を少しでもみなさんに知ってもらえるよう、ご紹介したいと思います。 SOCとは ヤフーSOCの話をする前に、一般的なSOCについてお話ししましょう。 「Security Operation Center」の頭文字を取って、SOC(ソック)と読みます。 近頃、その重要性が注目され、さまざまな企業で設置・構築が進められているセキュリティ組織の1つです。 なぜSOCは注目されている

    守れサイバーセキュリティ~SOCとは? ヤフーにおけるその役割
  • Yahoo! JAPAN のサーバー OS について

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog サイトオペレーション部の渡邉です。 サイトオペレーション部はデータセンタ・ネットワーク・サーバー・OS・ストレージ・OpenStack といった全社的なインフラの管理運用や調査検証などを担当しています。今回は Yahoo! JAPAN で使われているサーバー OS の状況やその開発運用について紹介したいと思います。 利用されているサーバー OS Yahoo! JAPAN では現在十数万台のサーバーが稼働しており、そのうちの約9割で CentOS 6/7 が利用されています。残りの1割では、用途に応じて次のようなものが利用されています。 Red Hat Enterprise Linux Oracle Linux Ubuntu F

    Yahoo! JAPAN のサーバー OS について
  • マネジメント視点でのオープンソースソフトウェア貢献に対する取り組み

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは、CTOの藤門(@mikanmarusan)です。 Yahoo! JAPANは、インフラレイヤーからユーザーの皆さんとのタッチポイントとなるフロントエンドレイヤーまですべて自社で開発しています。そのテクノロジーの大部分でオープンソースソフトウェア(以下、OSS)を利用しており、Yahoo! JAPANはOSSでできているといっても過言ではありません。そのため、OSSを正しく理解して利用することやOSSコミュニティと共存してさまざまな形で貢献していくことはYahoo! JAPANの持続的な成長につながると考えています。 Yahoo! JAPAN のテクノロジースタックとオープンソースソフトウェア(Yahoo! JAPAN

    マネジメント視点でのオープンソースソフトウェア貢献に対する取り組み
    ya--mada
    ya--mada 2019/02/24
  • おつかれさま、MYM 〜僕とMYMのフロントエンド戦争〜 - Yahoo! JAPAN Tech Blog

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

    おつかれさま、MYM 〜僕とMYMのフロントエンド戦争〜 - Yahoo! JAPAN Tech Blog
    ya--mada
    ya--mada 2018/12/25
    すごく、イイナ。
  • ありがとう、MYM 安らかに眠れ - Yahoo! JAPAN Tech Blog

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

    ありがとう、MYM 安らかに眠れ - Yahoo! JAPAN Tech Blog
    ya--mada
    ya--mada 2018/12/25
    "興味深い部屋の数々" というのが勉強になる。
  • ヤフー株式会社におけるWebフロントエンドの技術選定 - Yahoo! JAPAN Tech Blog

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog Yahoo! JAPAN Tech Advent Calendar 2018の6日目を担当します、Webフロントエンドエンジニアをやっている向井(@sakito)です! 今回はヤフー株式会社でWebフロントエンドエンジニアがどのような取り組みを行なっているのかをお伝えします。 ヤフーの組織体制 Webフロントエンドエンジニアの取り組みを紹介する前に、ヤフーがどのような組織体制なのか紹介します。 冒頭画像のようにヤフーではカンパニー制度を取り入れており、それぞれのカンパニーにサービスを開発する事業部があり、この事業部単位でデザイナーやエンジニア、そのほかにもさまざまな職種の方が所属し、サービスごとで日々開発に取り組んでいます。

    ヤフー株式会社におけるWebフロントエンドの技術選定 - Yahoo! JAPAN Tech Blog