console.lealog();

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

JavaScript

WebRTCのPerfect negotiationについて

なんやそれ・・また新しいプロトコルか?って思いますよね。 安心してください!ただの造語です。 Perfect negotiation in WebRTC - Advancing WebRTC 出自はこの記事で、書かれたのは4月とかなり前。 ただちょいちょい更新されてる + `webrtc-pc`のIssueで…

JavaScriptのTypedArrayについて

調べたのでメモ。

WebRTCで帯域を指定する方法2つ

またも、まったく目新しいトピックではないです。個人でメンテしてるWebRTCのモジュールに機能を追加するときに思い出したしせっかくなのでメモ。

WebRTCでTURNを使う

トピックとしてはまったく目新しくないけど、そういやまとめてないなと思ったのでメモ。

JavaScriptで音声の出力先を変えたい

先日のUGでもみんな気になってる感じがあり、個人的にも気になっており、現状をまとめておこうかと思い。

SkyWay UG Tokyo #4 に行ってきたメモ #WebRTCSkyWay

SkyWay UG Tokyo #4 - connpass 今回は弊社の新オフィス(開発拠点)にて。

TypeScriptでEventEmitterのイベントに型をつけたい

毎回なぜか忘れて毎回調べてるので・・。いろんなパターンがあるはず。

Chromeの76からiceConnectionStateがfailedにならない

M76は07/30にリリース予定。

WebRTCのDataChannelをもっと手軽に

使いたかったので、ライブラリを書きました。`enhanced-datachannel`という名前でnpmからインストールできます。リポジトリはこちら。 GitHub - leader22/enhanced-datachannel: Wanna `enhance(RTCDataChannel)` for general usage. 以下、ざっくり紹介と、…

Firefox 68から空文字列のcandidateが発行されるように

なります。 つまりどういうことで どういう場合に困るか そもそもどういうことか みたいなのをまとめておきます。

WebRTCやるのに最低限必要なJavaScriptのAPIについて

JavaScriptでWebRTCやるための基礎知識 - console.lealog(); 春なので書きました。 言うなれば、これの2019年度版です。

OSSのWebRTC SFU mediasoup v3のコードを読む(サーバー/NodeJS編)

クライアントは読んだので、次はサーバーを。 OSSのWebRTC SFU mediasoup v3のコードを読む(クライアント編) - console.lealog(); こっちもまだ未リリースですが、読むだけなら損はないだろうという話。

addTransceiver() と addTrack() の使い分け

`addStream()`は死にました。 5バージョンくらい前のChromeをサポートしたいとか理由がない限り、忘れてしまってよいです。他人のコードを読んでてコレが出てきたら、メンテされてない or 古いバージョンをサポートしようとしてるの2択です。これからのWebRT…

NodeJSでBufferを読み取る

プロトコルの実装でよく出てくるやつのまとめです。NodeJSの`Buffer`を通して得た、オクテットバイトストリームってやつを対象に。普通に`Buffer`のメソッドを使うこともあるし、特定のバイトからビットを取り出すこともあるはずで、そのバリエーションのメ…

OSSのWebRTC SFU mediasoup v3のコードを読む(クライアント編)

OSSのSFUである`mediasoup`のコードを読みました。サーバーの実装とJS-SDKがあって、JS-SDKの方です。 GitHub - versatica/mediasoup-client: mediasoup client side JavaScript library 現時点でのstableはv2.xなので、今回読んだv3は次期バージョン。つま…

AudioWorkletについて調べたメモ

[WebAudio API] AudioWorklet の使い方 | g200kg Music & Software この大先生の記事を読んで、自分の知ってるWebAudio知識のアップデートをしときたいなーと思って調べたことのメモです。なので重複する部分もあるけど、+ αな部分もあります。 20191129: あ…

“Unified Plan” Transition Guide (JavaScript) の日本語訳

“Unified Plan” Transition Guide (JavaScript) - Google ドキュメント なんかそのうち仕事で見返しそうな感じがあったので訳してみた。

Face Detection APIを試したメモ

なんと、ブラウザで顔認識ができる時代になりました。試したのはChrome 70.0.3530.0(Official Build)canary (64 ビット)で。 仕様 Accelerated Shape Detection in Images Accelerated Shape Detection in Images なる仕様らしく、大きく2つのAPIが定義…

webrtc/adapterのコードを読んだメモ

GitHub - webrtc/adapter: Shim to insulate apps from spec changes and prefix differences. Latest adapter.js release: 界隈で脊髄反射的に必要って言われてる気がする 個人的にはお世話になったことはない SkyWayのJS-SDKでもサンプルでも使ってないし…

SkyWay UG Tokyo #3 に行ってきたメモ #WebRTCSkyWay

SkyWay UG Tokyo #3 - connpass 今回はDEJIMAというスペースにて。めっちゃおしゃれ空間やった。 品川から歩いて20分くらい。 Innovation Space DEJIMA

MobX 4.0.0 について

去年の末から地道に対応が進んでたのですが、ついに出ましたねー。作者によるサマリー記事とあわせて公開されました↓ MobX 4: Better, simpler, faster, smaller – Michel Weststrate – Medium ちゃんとv3からv4へのマイグレーションガイドもあります。 Migr…

getUserMedia()以外でMediaStreamを用意するには

`navigator.mediaDevices.getUserMedia()`することで手に入る`MediaStream`を、それ以外の手段でどうやって自作するかという話です。どんな形であれ思いついたのをメモっておきます。

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

2018年2月verです。 基本的に2017年8月に書いた記事と変わってない。NO進歩。 2017年版: getUserMedia()で画面のストリームを取得する - console.lealog(); この記事に書いてること + さらに最近調べたことをメモ。 なんかおかしかったら教えてください。

postcss-cliで複数のentryを扱いたい

webpackみたく、複数のアプリを1つの設定ファイルでよしなにしてほしい。この気持ち・・わかりますか!

immerのコードを読んだ

GitHub - mweststrate/immer: Create the next immutable state by mutating the current one (MobXの作者による)イミュータブルに状態を操作するユーティリティライブラリ。ちなみに、この世で最初にスターしたのは俺ですw

テストでモックできなくて困るNode.jsのモジュールの書き方

こういう書き方にしてしまったせいで、テストの時にうまくモックできず困ったよというメモ。

Result outputs go wrong with using async tasks in `{before,after}xxx` #jest

beforeAll afterAll beforeEach afterEach jestではこの4つがあるけど、この中で非同期処理をすると、途端にテスト実行時のログの体裁がおかしくなるという話。あと、`--forceExit`というオプションを組み合わせるとまた違った体裁になってよーわからんとい…

getUserMedia()で指定できるMediaTrackConstraintsのよもやま

Media Capture and Streams この仕様書をだらーっと流し読みしたので、知らんかったことをメモ。 あとついでに気になった指定について調べたことも。

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

WebRTC界隈で、 Chromeの`video.srcObject = stream`はバグってるから使っちゃダメ 代わりに`video.src = URL.createObjectURL(stream)`を使え という噂があって。とはいっても、 Safariでは`URL.createObjectURL(stream)`がエラーになる URL.createObjectUR…

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

タイトルに収まらんwSafariのWebRTCは新しめの仕様なので、`createOffer()`にオプションを渡して`recvonly`にする方法が使えない。 pc.createOffer({ offerToReceiveAudio: true, offerToReceiveVideo: true, }) こういうやつ。なので、代わりに、 pc.addTr…