Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Electronで動画プレイヤー開発

Avatar for Yuta Imanishi Yuta Imanishi
February 25, 2021

 Electronで動画プレイヤー開発

Avatar for Yuta Imanishi

Yuta Imanishi

February 25, 2021
Tweet

More Decks by Yuta Imanishi

Other Decks in Technology

Transcript

  1. © DMM.com 2 自己紹介 • 名前:今西勇太(@nisshii0313) • 所属:東京理科大学 理学部 数学科

    4年 • 現在: 2021卒内定者アルバイトとして動画配信事業部でお世 話になってます • 趣味: 日常系アニメ見たり、ゲームしたり、友人とwebサービ ス作ってみたり、たまーに電子工作 などなど
  2. © DMM.com 今日話すこと • Electronの概要 • 新機能をリリースした話 (同時複数再生機能) 今日話さないこと •

    Electronでの開発の 0→1部分 (チュートリアルを見た方が早そ う) • Electronの最新情報 (公式docをキャッチアップしてみ てください) 4 はじめに
  3. © DMM.com Mainプロセス Renderer プロセス Renderer プロセス Renderer プロセス どんな感じで動いているか(ざっくり)

    • BrowserWindowインスタンスを作り、ウェブページを作成 • BrowserWindowインスタンスを破棄することでRendererプロ セスを終了し、ウェブページを閉じる → 全ての作成されるウェブページと、対応するRendererプロセ スを管理している (backend node.js のようなイメージ) 8
  4. © DMM.com どんな感じで動いているか(ざっくり) Mainプロセス Renderer プロセス Renderer プロセス Renderer プロセス

    • BrowserWindowインスタンスを作り、ウェブページを作成 • BrowserWindowインスタンスを破棄することでRendererプロ セスを終了し、ウェブページを閉じる → 全ての作成されるウェブページと、対応するRendererプロセ スを管理している (backend node.js のようなイメージ) 9
  5. © DMM.com どんな感じで動いているか(ざっくり) Mainプロセス Renderer プロセス Renderer プロセス Renderer プロセス

    Mainプロセスで作成されたBrowserWindowインス タンスによってウェブページが実行される → html/css/jsを使ってChromeの画面に描画す るのとやっていることはほぼ同じ プロセス間通信によって柔軟な表現が可能 10
  6. © DMM.com 20 Mainプロセス Renderer プロセス Renderer プロセス Renderer プロセス

    再生する動画情報を、各Rendererプロセスに分配 (Browserwindowインスタンスを立ち上げる時に、プロセス 間通信経由で動画のpath情報を渡す)
  7. © DMM.com 21 Mainプロセス Renderer プロセス Renderer プロセス Renderer プロセス

    UIから変更される各種設定(ログイン認証、音量、 再生速度、同時再生のon/offなど)を、 localstorageに保存、都度参照 (音量、再生速度等以外の同期すべき設定につ いては保存時に同期)
  8. © DMM.com 26 Mainプロセス Renderer プロセス Renderer プロセス Renderer プロセス

    UIから変更される各種設定(ログイン認証、音量、 再生速度、同時再生のon/offなど)を、 localstorageに保存、都度参照 (音量、再生速度等以外の同期すべき設定につ いては保存時に同期)
  9. © DMM.com 27 Mainプロセス Renderer プロセス Renderer プロセス Renderer プロセス

    UIから変更される各種設定(ログイン認証、音量、 再生速度、同時再生のon/offなど)を、 localstorageに保存、都度参照 (音量、再生速度等以外の同期すべき設定につ いては保存時に同期) 同時再生のon/offはlocalstorageに入れちゃだめだった…