console.lealog();

@leader22のWeb系に関する勉強めもブログですのだ

ChromeのMediaStreamTrackとvideo要素の組合せには罠がある話

WebRTC界隈で、

  • Chromeの`video.srcObject = stream`はバグってるから使っちゃダメ
  • 代わりに`video.src = URL.createObjectURL(stream)`を使え

という噂があって。

とはいっても、

などなど事情もあるのでそろそろ`srcObject`だけ使いたい!
そのためにもどういうケースでバグってるとか、この噂の真意を確かめたいなーと思って調べてたのが事の発端。

続きを読む

Safari TPのWebRTCでaddTransceiver('audio').setDirection('recvonly')するとMediaStreamがautoplayされない問題

タイトルに収まらんw

SafariのWebRTCは新しめの仕様なので、`createOffer()`にオプションを渡して`recvonly`にする方法が使えない。

pc.createOffer({
  offerToReceiveAudio: true,
  offerToReceiveVideo: true,
})

こういうやつ。

なので、代わりに、

pc.addTransceiver('audio').setDirection('recvonly');
pc.addTransceiver('video').setDirection('recvonly');

// からの
pc.createOffer();

とする必要がある。
だがしかし、こうやって開始したP2Pで相手のストリームを受け取ると、`video`に`autoplay`を指定していても再生が開始されないという謎の挙動を踏みましたというメモです。

しかもSafariどうしでは再現しなくて、片側はChromeFirefoxの時だけっていう・・。

確認バージョン

続きを読む

2017年版 getUserMedia()で画面のストリームを取得する

間違ってたら教えてください。

続きを読む

Flowでコンストラクタをエクスポートするモジュールの型を定義する

こういうやつ。

import EventEmitter from 'events';

const ee = new EventEmitter(); // <- コレ

これはあくまで例で、Node標準の`events`のEventEmitterなら、Flowがビルトインで型情報を持ってるので困りません。
でも似たようなのを自分で書いたり、他のライブラリに型をつける場合に必要になるはず。

続きを読む

やっぱりサーバーサイドレンダリングなんかしなくていいやという気持ち

個人の意見 aka ポエムです。
界隈的には今さら感がすごいけど。

そんな今さらポエった事情としては、

  • とある案件でSPAをReactで作りつつサーバーサイドレンダリング(以下SSR)をすることになるかも
    • SPAじゃないページもまとめてReactでSSRすることになるかも
  • ただ個人的にはSPA+SSR不要論者
    • サーバーサイドのテンプレートとしてのReactも冗長なだけやろ派
  • でも仕事なのでしゃーない(お客様がそう申されるなら・・
  • なのでやるからには再考察してみて、前向きにやれる要素を見つけたい!
  • けどどんだけ考えてもやっぱり意義が見つけられなーい( ´Д`)=3

という感じで、SSR自体の是非はまあどうでもよくて、ただ個人的に「しなくていい」と思ってる気持ちをまとめたものです。
技術に是も非もないです。大事なのはどう使うかなのです。

ちなみにやってみた結果・・とかいう話ではなく、やってないけどやらなくてよさそうだなーという話です。

20170724: なぜか今さら盛り上がってたのであれこれ追記

続きを読む