#JavaScript

2015年頃に作った版権音楽の試聴プレーヤーのコードを振り返る。当時の苦労と、今ならどれだけ簡単に書けるかの対比。

WebRTCのシグナリング情報をQRコードで交換し、サーバなしでP2P音声通話を実現する実験。SDPの分割・結合やICE候補収集の実装を解説。

大規模な同時視聴イベントで、動画再生に合わせたWeb演出を同期させるアーキテクチャ設計

SVGのパスをクリックして色を塗る仕組み。fill属性を変えるだけのシンプルな実装を、バニラJSで解説する。

ブラウザでカラオケ採点を作った昔話と、今風にリベンジするならどうするかの考察

Web Speech APIやMediaRecorderを使って、ブラウザで音声入力を実装する方法を解説

記事にWebM/MP4を埋め込むとページが重くなる。preload="metadata"で最初のフレームだけ読み込み、クリックで再生開始する仕組みをrehypeプラグインで実装した。

画像と字幕を並べてパタパタアニメーションを作れるブラウザツール。WebM/MP4/SRT出力対応。

ブラウザOCR、サーバーOCR、クラウドAPI、AIまで。日本語OCRをウェブで実装しようとして得た知見と各手法の限界をまとめる

YouTube公式の埋め込みコードは重い。rehypeプラグインを自作して、サムネイル表示→クリックでiframe読み込みする仕組みを実装した。

PaddleOCRのJavaScript実装をブラウザで使おうとして失敗した記録

形態素解析をブラウザで実装しようとしてSudachiは重すぎ、kuromoji.jsはバグってた話。最終的にフォーク版でカスタムローダーを実装して解決。