🍃このブログは移転しました。
3秒後、自動的に移動します・・・。

JavaScript

ブラウザで動くSQLite alternativesとしてのLovefield

タイトルはさておき、LovefieldというSQLライクなAPIが使えるライブラリがあって、個人的に便利だったので。

new Function() ではなく new AsyncFunction() したい

我ながらニッチなことをやろうとしてるなって思う・・。普通の生活をしてる分には、活躍する出番はないはず。`eval()`はもっと使わない。

配列のインデックスを`.keys()`で操る

TL;DRこちら。for (let i = 0; i < arr.length; i++)はfor (let i of arr.keys())って書けるし、中身もいるならfor (let [i, d] of arr.entries())ってする— りぃ / Yuji Sugiura (@leader22) 2023年1月10日

DOM ready events considered harmful | HTTP 203 の要点まとめ

なかなか気になるタイトルの動画が出てたので。 DOM ready events considered harmful | HTTP 203 - YouTube こういうコード、ほんとに懐かしいな・・・w // コレとか $(() => {}); // コレとか document.addEventListener("DOMContentLoaded", () => {}, f…

html-rewriter-wasmでHTMLをパースする

HTMLファイルをパースして、 特定の文字列を抜き出したり 特定の属性を書き換えたものを書き出したり ってことをやりたい時、今までは`cheerio`を使うことが個人的には多かった。 GitHub - cheeriojs/cheerio: Fast, flexible, and lean implementation of c…

Cleaner, more elegant, and ... の、例外とエラーの話

Cleaner, more elegant, and wrong - The Old New Thing Cleaner, more elegant, and harder to recognize - The Old New Thing という、似たようなタイトルの記事が2つありまして。 どちらもマイクロソフト社のレイモンド・チェン氏が書いたもの。 氏は、「…

JSDoc TSでジェネリクスを使う

あんまり知られてないかもしれんけど、JSDocのコメントを書くことでもTypeScriptの恩恵は受けられる。より正確には、 JSDocコメントを書くことで `.js`ファイルであっても TypeScriptのLanguage Serverの機能を(一部)利用できる というわけ。で、これが結…

ラベル付き文でif文をbreakする

っていう使い方もあるのか〜と久々に学びがあったのでメモ。

アクセストークンをWebWorkerで扱う

というアプローチを紹介してる記事があって、なるほど?と思ったのでまとめてみる。元記事はこちら。 Leveraging Web Workers to Safely Store Access Tokens – The New Stack 毎度のことながら、今にはじまったことではない。

慣性ドラッグの慣性のところだけを実装したライブラリ

作った。いわゆるGoogleMapのようなものを作りたい場合に使えるやつ。まあだいたいはDOMイベントまわりまで面倒みてくれるライブラリを使う事が多いとは思うけど、そのすべてを自作しないといいけない場合、こういう部品だけがあるのも便利かと思い。 GitHub…

ev.composedPath()でClick awayを実装する

Event.composedPath() - Web APIs | MDN いつの間にこんな便利なやつが・・。

SVGをcanvas要素で扱う

普通の`img`やら`video`要素なら、`CanvasRenderingContext2D`の`drawImage()`で楽勝なんですが、SVGは画像であって画像ではないので、ひと手間が必要・・・。地味に面倒だったのでメモ。

beforeunloadイベントと確認ダイアログ

Changes you made may not be saved. フォームの入力中とかにページを離脱しようと出るアレのこと。昔から微妙に使われてるくせに、いまいち挙動が不定でブラウザ差異もあって釈然としない。最近はどうなってるのか知る必要が出たので、改めて調べた。 Chrom…

MobX作者による、RecoilとMobXについての簡単なまとめ

http://github.com/facebookexperimental/recoil 先日のReactEuropeで発表されたてホヤホヤの、ExperimentalなReact向けの状態管理ライブラリであるRecoil。ただAPIとかやりたいことを見てると、「MobXファミリーとの違いってなんぞ・・?」って個人的になっ…

NetlifyのFormsについて

Forms setup | Netlify Docs 個人的に忘れないようにメモ。

mediasoupの開発Tips

`mediasoup`を使ったサービスを開発する上での役立ちTipsをメモっておきたいなと思ってたので。(なんか思いついたらまた追記します。)

JavaScriptでもバーチャル背景する

やってやれないことはなかったです。 ぱっと思いついた2通りのアプローチで実装してみたので、その学びをメモっておきます。ただ、個人的には別にいらない機能かな・・。

続・続・WebRTCなコードをE2Eテストする

続・WebRTCなコードをE2Eテストする - console.lealog(); WebRTCなコードをE2Eテストする - console.lealog(); 新しいネタを仕入れたので、このシリーズがまだ続きます!

chrome://webrtc-internals のしくみ

なんとなくアテはついてたけど、中身が気になるという話を聞いたので調べてみた。WebRTCやってるみなさんならお馴染みのあのページです。

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年度版です。