弾性同期Youtubeプレイヤー

Last updated Unknown Edit Source

• 弾性同期

  弾性同期

  非同期的に視聴しているユーザー同士を、再生速度の自動変化によって同期させるシステム /kineto/弾性同期 自分で考えたやつ、先行研究は今のところ見つけられていない のやつ もっと一般的でconceptual?な話をまとめたいなーと思ってる 過去のの話とつながりそうな雰囲気がある 「バラバラにいる人を、勝手にくっつけていくシステム」と言える 空間ではなく時間方向の「万有引力」といえそう #時間方向の物理法則 円環時間、均一な時間（抽象時間） 、 中世の鐘の時代は、鐘が同期のシグナル？ これはちょっと都合良く湾曲解釈しすぎなだな 「円形時間から直線時間へ」というぶんけんがあるっぽい？ kinetoはここから弾性時間(?)へ 文学の文脈での話 ...

  1/3/2023

  的な仕組みのYoutube

  Youtube

  「登録チャンネルの最新動画」以外の推薦はいらない 時間が溶けるので どうすれば消せるんだろう ミニマルなクライアントとかないかな ...

  1/3/2023

  配信プレイヤー、面白そう

• もっと分かりやすいユースケースに合わせるなら、

  • Youtube Live視聴時に、遅れているなら自動で若干早送りにされるYoutubeプレイヤー
  • /mitou2021demoday/自律分散的に展開される遊び場を実現するための遊びの制作支援ツールの開発#62107df52927950000a6ce4d これみて思った

• 視聴中に止めたりちょっと巻き戻した時に、小さい遅延が生まれることは良くある

  • その遅延を戻すために毎回2倍速にするのは面倒
  • その速度の調整をいい感じに代わりにやってくれるプレイヤーを作った

• できた

  • https://blu3mo.github.io/elastic-sync-player/

実装メモ

• React

  React

  ...

  1/3/2023

  とYoutube Player API使えば結構さくっと実装できそう

• Chakra UI

  Chakra UI

  名前好き よりデフォのデザインも好きなので、使ってみるか 最初はパーツ欲しいところで使うだけでも良いかな? まあでも別にロクにcssも理解してないから、Chakraの仕組み理解するのも大して変わらんか ...

  1/3/2023

  とかReact+Firebaseを試しつつ作ってみよう

• react-player

  react-player

  一部操作、を使うみたい getDuration()がYoutube Liveだとうまくいかないな 何度呼んでも同じ値を返す Liveだから増えていくはずなのに seekすると値が更新される ...

  1/3/2023

  使えば楽に実装できそう
  • 配信の全体durationを取得するのが難しいな
    • Youtube iFrame APIがガタガタっぽい

• Stateの挙動の理解不足でハマった

  • react HooksでsetTimeoutやsetIntervalなどからstateを参照する | きさらぼ
  • React + TypeScript: setInterval()をReactのプログラミングモデルに合わせてフックに書き替える ー useInterval - Qiita
  • setIntervalをuseIntervalに置き換えればいけそう
    • こういうの揃ってるのありがたい

• onSeekが拾えないのきついな

  • このせいでseekした瞬間に速度が変わらずとても非直感的なUIになる
  • clickイベントの時に秒数の大きな変化があったらonSeek、みたいな感じで自作はできそうだけど面倒