はじめに こんにちは。ニコニコ動画開発の小池です。 私の所属するチームではニコニコ動画の動画サービスのサーバーサイドをメインに担当しております。 今回は PHPerKaigi2024 向けの記事として、動画サービスのコード改善についてこれまでの歴史や取り組みとその成果について紹介していきたいと思います。 文中の3つのフレーズをチャレンジトークンとしてみました。ぜひ探してみてください! （※ 記事の見出しにの横についている「#」はチャレンジトークンではありません。チャレンジトークンは文中に配置されています。紛らわしくてすみません！） 2006年: ローンチ ニコニコ動画は2006年にローンチされて以来、皆様の応援のおかげで現在までサービスが継続されております。 当時はRuby on Railsが流行り始めてCakePHPが出ているかどうかといったくらいの時代で、フレームワークを利用しないとい

はじめに 2023年新卒エンジニアの武智です。 今回は2023年新卒エンジニアが3ヶ月間共通で受けた研修について、研修の内容と感想を記事にしようと思います。 この記事では、全3ヶ月の研修の内、以下の内容を扱います。 毎日の読書/朝会/振り返り会 1ヶ月の基礎研修 1ヶ月の個人研修 1ヶ月のチーム研修 その他 毎日の読書/朝会/振り返り会 3ヶ月の研修中、毎日9:00〜10:00で読書、10:00〜10:30で朝会、17:30〜18:30で振り返り会をしました。 読書は課題図書が指定されており、50分読んだ後、10分ほどオンラインMTGを繋いで同期+メンターさんたちと内容を共有する、という形で行いました。 課題図書は「図解即戦力 Web技術がこれ1冊でしっかりわかる教科書」や「Team Geek」、「達人プログラマー」、「入門監視」などがありました。技術的知識の基礎からチームで働く際のマイン

こんにちは。ニコニコQセクションのHajime-san(GitHub)です。 本稿では、HTMLのloading属性の仕様とブラウザの実装を解いていきます。これにより、ブラウザからのコンテンツ配信の最適化を支える判断材料の1つとなれば幸いです。 執筆の動機 筆者が開発に携わっているサービスであるニコニコオーディションが間接的に利用している社内ファミリーサービスについて、ふと自分のスマートフォンで見てみたところページの初期表示に時間がかかるように感じました。 オーディションシステムはiframe要素によって社内ファミリーサービスなどに専用のUIを埋め込むことが可能になっており、iframe要素のloading属性を用いた「遅延読み込み」（以下、遅延読み込みはloading属性によるもの）が効果的なのではないかと考えました。 まずは、実際にloading="lazy"を適用して読み込みが後回し

こんにちは。ニコニコ共通バックエンド開発担当の小野塚です。 ニコニコには各ファミリーサービスが使っている共通通知システムがあります。このシステムを利用することで、各サービスはiOSアプリプッシュ通知、Androidアプリプッシュ通知、ブラウザーWebPush通知、Eメール通知、Webページやスマートフォンアプリの「あなたへのお知らせ」を送っています。 そのリプレースが最近完了したので、ご紹介したいと思います。 リプレース前の状況 リプレース前の共通通知システムは、通知生成システムと通知配信システムという2つのシステムから構成されていました。この2つのシステムの間では、通知生成システムがニコニコ独自の通知ロジックを担い、通知配信システムがニコニコに限定されない汎用的な通知機能を担う[1]という分担がありました。 通知生成システムは、通知するイベントに含まれるコンテンツのIDから通知配信システ

2023-02-27 Mon Service WorkerとCache APIによるWebサーバーの負荷軽減とテスト実装について-前編 こんにちは。ニコニコQセクションのHajime-san(GitHub)です。 当記事では所属部署で開発に携わっている「ニコニコオーディション」の既存システムにService WorkerとCache APIを用いて、 Webサーバーからのレスポンスを一定期間保存し、キャッシュ（CacheStorage）からレスポンスを返すことによってWebサーバーへの負荷軽減を実現するまでの経緯や実装などを紹介します。 オーディションシステムの紹介 システムの概要 まず初めに本稿の主題となるシステムが抱える課題について、先ほどサラッと単語が登場した「ニコニコオーディション」というシステムの前提があるとより理解が明瞭になるのでこちらを紹介します。 ニコニコオーディションとは

はじめに ニコニコサービス本部ニコニコ開発部の小野寺と田中です。ニコニコ生放送の開発をしています。 今回は我々のチームで担当しているプロダクトの「品質改善の事例」をご紹介します。 Web アプリケーションの reftest (Reference Test) を導入する事例が出てきます。興味のある方はぜひご一読ください。 どんな課題があったか 今回ご紹介する事例は、 ある Web アプリケーションフレームワークの品質改善です。 過去の記事でもご紹介した Akashic Engine と呼ばれるもので、以降は 「エンジン」 と呼称します。 エンジンには 二つの課題 がありました。 いずれもある時期のプロダクト品質指標値を下げる要因となったもので、開発者の心の平穏を脅かすものです。 マルチプラットフォーム対応によるテスト範囲拡大 導入先サービス特有のテスト不足 これらを順に説明します。 1. マ

こんにちは。エンジニアの新入社員研修を担当している青木です。 今回はリモートで行われた2021年度の新入社員研修が、どのような様子だったかをご紹介します。 現在は2021年度の振り返りをもとに、迫っている2022年の新入社員研修の準備を進めています。 入社予定の皆さんやエントリーを迷っている皆さんの不安を軽減できればいいなと考え、この記事を書くことにしました。 昨年実施した研修に新入社員の皆さんから、沢山のフィードバックをもらいました。 その中に「完全リモートという不安な環境でエンジニアとしてのキャリアをスタートしたので〜」という一文がありました。 社会人という「新しい環境」に不安を感じているのに、馴染みのない「リモート環境」という要素も加わっていた為、不安は大きく、もっと軽減してあげられたらよかったなと思いました。 この記事を読んで少しでも研修の様子やドワンゴの文化が伝わり、不安が軽減で

※本ブログは2022/2に執筆されています。そのため、アップデートによって内容が現在と異なる可能性があります。 はじめに モバイル事業本部プロダクトエンジニアリングセクション マネージャーの安田です。 インフラっぽいことやクラウドっぽいことやデータエンジニアっぽいことをやってます。 今回、モバイル事業部で使うS3のコスト削減のため、ストレージクラスの移行等を行うライフサイクルの設定を行いましたのでご紹介します。 これからS3の管理を行っていく方、コスト削減に興味のある方の参考になれば幸いです。 実施の背景 モバイル事業本部ではドワンゴジェイピーやアニメロミックスなど音楽配信ビジネスを中心に展開しており、様々なレーベルからお預かりした楽曲データを管理しています。 また、ニコニコ事業本部ができる前からサービスを行っており、多大な量のシステムログやクラウドサービスのログデータなどが存在しています

ドワンゴ 技術コミュニケーション室のsaka1です。 この記事では、社内で用いられているLightningTalk(LT)用のライブストリーミングシステムについて紹介したいと思います。 LTは普段こんな感じで行われています。 実は、社内ではLTの開催形式について見直しが行われつつあります。 記事の執筆時点ではまだこのシステムは使われていますが、ライフサイクルとして末期かもしれません。 せっかくなのでシステムがどういったものだったかについての記録を残したいと思い、記事を書くことにしました。 記事ではまず、なぜシステム開発が必要だったかについて簡単に説明し、次にシステムの技術的詳細について紹介していきます。 LT運営にどういった課題があったか エンジニア有志が参加するLT会はそれまでも定期開催されていたのですが、エンジニアの人数が増えるにつれて、 一つの会議室に全員が物理的に集合してLTを開催

選定作業にはAOMが公開しているソフトウェアエンコーダaomを使用し、改造によってツールを削減したときの映像品質を比較しました。 映像品質は一般的にビットレートと客観/主観画質のバランスで表されます。 客観画質とは計算によって数値化した画質のことで、代表的な手法としてはPSNRやSSIMがあります。 主観画質とは人の目で映像を評価した画質のことです。 今回は、客観画質としてPSNRを用いた指標(RD性能)を用い、映像品質を比較しました。 PSNRには"30dBを下回ると低品質である"といった基準はありますが、人の目で見たときの評価と必ずしも一致するわけではありません。 そこで、主観画質の評価も並行して実施し、多角的に映像品質低下を防止しました。 選定結果 まず、Superblockサイズを64X64と128X128とで比較しました。 その結果、テストケースのうち約75％でRD性能に変化がな

ドワンゴ 技術コミュニケーション室の塩谷（ kwappa ) です。 2019年、ドワンゴには19名の新卒エンジニアが入社しました。一般研修やグループ会社との合同研修を経て、4/22からはエンジニア研修が始まっています。 その冒頭に「エンジニアの心技体」というテーマでぼくが話す時間を作りました。エンジニアとして成果を出し、成長し、生きのこるための心構えを「親父の小言」的に紹介しています。 スライドはこちらです。 前提知識として、ここ数年話題に上ることが増えてきた「心理的安全性」と「HRT」などを紹介し、その上でプロのエンジニアとして生きのこり成果を出すための心構えを「心技体」という軸で切り取って紹介しています。 「心理的安全性」という言葉が注目を集める結果となったGoogleのプロジェクト・アリストテレスについては時間的な都合で言及していませんが、平易に書かれた重要な文章ですので、あわせて

ドワンゴ 技術コミュニケーション室の塩谷（ @kwappa / kwappa@friends.nico ）です。 エンジニアにとって勉強会やカンファレンスに参加するのは学びであるとともに楽しみでもあります。そんなイベントをさらに楽しみなものにしてくれるのが、みんな大好き懇親会。 本日はそんな懇親会をさらに楽しくしてくれる、革新的で魔法のようなアイテム「プルタブフック」をご紹介します。 懇親会といえば 🍣 と 🍕 、そして 🍺 がつきものですよね。でも、皿を持ち、箸を持ち、さらに缶を持つのはとても大変です。空きスペースを探してウロウロするのはなんだかマヌケなものですし。 そんな悩みを解決してくれるのが、この「プルタブフック」。これさえあれば、食べる・飲む・喋るという懇親会の行動をスムーズに切り替えることができます。 使い方はいたって簡単。プルタブを開けたら垂直に立て、その穴にフックを通

パフォーマンス改善ハンドブック ウェブページにおけるパフォーマンスに関する問題の見つけ方や考え方の事例をまとめた Webフロントエンド パフォーマンス改善ハンドブックを公開しました。 URL: https://dwango-js.github.io/performance-handbook/ このハンドブックでは過去に行ったWebフロントエンドのパフォーマンス改善の事例を中心に紹介しています。 注意点としてWebフロントエンドは常に変化しているため、現在の最適な解決方法を提案するものではありません。 また、アプリケーションによっても最適な解決方法は異なります。 今回の事例ではViewライブラリにReactを用い、映像再生プレイヤーなどある程度複雑な機能を持ったウェブアプリケーションのWebフロントエンドを扱います。 具体的にはニコニコ生放送（以下「生放送」）で行った事例を中心に書かれていま