Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
テレビを飲み込め! Webの嵐!! / Swallow the TV! Web storm! !!
Search
Endo_Hizumi
October 28, 2020
Technology
1
110
テレビを飲み込め! Webの嵐!! / Swallow the TV! Web storm! !!
momoと使って、WebRTCでアニメをみようという話をしました。
Endo_Hizumi
October 28, 2020
Tweet
Share
More Decks by Endo_Hizumi
See All by Endo_Hizumi
JSでギャルゲー!~JavaScriptでノベルゲーエンジン作ったった~
endohizumi
1
150
意志の力が9割。アニメから学ぶAI時代のこれから。
endohizumi
1
140
JSでギャルゲーをつくろう!(第3版)
endohizumi
0
170
JSでギャルゲーをつくろう!(第2版)
endohizumi
0
80
JSでギャルゲーをつくろう!
endohizumi
0
420
OK:Googleから始めるスマートホーム生活 / OK: Smart home life starting from Google
endohizumi
0
330
クソアプリで基礎固め / Tutorial in your joke app for Vue.js
endohizumi
0
240
jQuery使いがVue.jsを使った話 / thank you jQuery,Hello Vue.js
endohizumi
0
200
スマホで始めるウェブアプリ開発 / let's start web application development with a Android Device
endohizumi
1
950
Other Decks in Technology
See All in Technology
M&A 後の統合をどう進めるか ─ ナレッジワーク × Poetics が実践した組織とシステムの融合
kworkdev
PRO
1
190
Mosaic AI Gatewayでコーディングエージェントを配るための運用Tips / JEDAI 2026 新春 Meetup! AIコーディング特集
genda
0
140
日本語テキストと音楽の対照学習の技術とその応用
lycorptech_jp
PRO
1
400
Amazon Bedrock AgentCore 認証・認可入門
hironobuiga
2
470
データ民主化のための LLM 活用状況と課題紹介(IVRy の場合)
wxyzzz
2
310
JuliaTokaiとしてはこれが最後かもしれない(仮) for NGK2026S
antimon2
0
130
サイボウズ 開発本部採用ピッチ / Cybozu Engineer Recruit
cybozuinsideout
PRO
10
73k
Azure SRE Agent x PagerDutyによる近未来インシデント対応への期待 / The Future of Incident Response: Azure SRE Agent x PagerDuty
aeonpeople
0
260
エンジニアとマネジメントの距離/Engineering and Management
ikuodanaka
3
700
しろおびセキュリティへ ようこそ
log0417
0
230
SREが向き合う大規模リアーキテクチャ 〜信頼性とアジリティの両立〜
zepprix
0
300
SMTP完全に理解した ✉️
yamatai1212
0
160
Featured
See All Featured
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
helenjbeal
1
88
Learning to Love Humans: Emotional Interface Design
aarron
275
41k
Speed Design
sergeychernyshev
33
1.5k
Crafting Experiences
bethany
1
44
Test your architecture with Archunit
thirion
1
2.1k
Context Engineering - Making Every Token Count
addyosmani
9
640
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
320
Testing 201, or: Great Expectations
jmmastey
46
8k
Exploring anti-patterns in Rails
aemeredith
2
230
Bioeconomy Workshop: Dr. Julius Ecuru, Opportunities for a Bioeconomy in West Africa
akademiya2063
PRO
1
54
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
100
Designing for Timeless Needs
cassininazir
0
120
Transcript
テレビを飲み込め! Webの嵐!! 2020年10月28日(水) オタクが最新技術を追うLTイベント#18 遠藤ヒズミ
ご静聴ください我のLTを!
自己紹介 名前:菊地 峻輔 HN:遠藤ヒズミ (@endo_hizumi) → 業務:SESのサーバーサイドエンジニア 今期の推しアニメ:アサルトリリィ 一言:週末の午前中は特撮しか見てない 土曜日: ウルトラマンZと仮面ライダーウィザードの YouTube配信
日曜日: 仮面ライダーセイバーとキラメイジャー、ゴーバスターズの YouTube配信
今回の動機 • 最近、邪魔になったTVを実家に送る • 27インチディスプレイにレコーダーつないでアニメを見るよ うにした • PCデスクに座ったまま、アニメ見られるじゃん。 チョーイイネ!サイコー!
今回の動機 • 最近、邪魔になったTVを実家に送る • 27インチディスプレイにレコーダーつないでアニメを見るよ うにした • PCデスクに座ったまま、アニメ見られるじゃん。 結果、布団に入りながら アニメが見づらくなった
そこでヒズミは考えた。
ブラウザから見られればいいよね?
タブレットからアニメみられるね?
実際に試してみた ラズパイ =Raspberry Pi ラズパイへはUSB キャプチャーカード で映像と音声を取り 込む WebRTC部分は、 時雨堂さまの
momoを利用
WebRTCとは • ブラウザ間でリアルタイム通信を行える技術の総称 • ビデオ・オーディオを送受信するためのAPIがある • 通信にP2PとUDPを用いて、低遅延で配信を行える • プラグインやネイティブアプリのインストールが不要 ➡簡単にいうとブラウザだけでビデオ通話ができる技術です
初版が2011年だから、目新しい技術ではない
momo の特徴 • WebRTCをブラウザを使わなくても映像を配信できる • ローカルLAN内で配信するのは簡単(以下の一行) • Raspberry Piでも動作するバイナリが配布されている •
Ayameというアプリケーションで、NATを越えてWebRTCで配信 ができる
使い方 • バイナリをmomoのリポジトリから落としてくる • 解凍後、”./momo test”でmomoを起動させる。 • {momoを起動したマシンのIP}:8080/html/test.htmlにブラウザ でアクセス •
ページの”connect”ボタンで通信開始 • レコーダーの映像が出れば成功!
どれくらい遅延するのか?(クリックすると別窓で動画が再生されます) 左:レコーダー直接 右: WebRTC経由
使った感想と分かったこと • ほぼ遅延せずに、簡単に映像を配信することができた。 • 映像だけなら、なにも設定せずに配信ができる。 • 音声は少し設定が必要である。 • ./momo testだけだと、画質・音質ともに加工されて劣化するた
め、オプションをつける必要はある • Raspberry pi 3よりRaspberry pi 4を使った方が良い。 これで寒い冬も布団の中でアニメがみられるぜ!!(本音
今後 • 現状はレコーダーのリモコンで操作してる • ブラウザから操作できるようクライアントの開発を目指す