console.lealog();

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

Svelte Society Day 2020: Rich Harris: Frequently Asked Questions の要点まとめ

Svelte Society Day 2020: Rich Harris: Frequently Asked Questionsわかりみしかなかった。リッチ氏、本職はNYTのデザイナーなんですよね・・エンジニアじゃないんですよね・・まじすげーわ・・。

転職しました

Web

そして子も生まれていました!というわけで、子です🤗 pic.twitter.com/UzvIiUpCOP— りぃ (@leader22) 2020年6月10日 人生ですなあ。

Svelteで生DOMを扱う

Reactでいうところの`ref`を、Svelteでどうやって扱うか。まぁドキュメントにちゃんと書いてあるけども。

Svelte/Sapperを静的サイトジェネレーター(SPA)として使う

最近ひさしぶりにペライチの静的なサイトを作る機会があって、何で作ろうかなーと考えた。Nextの`export`や、Nuxtの`generate`があるなら、Svelte/SapperにもそういうSSGの機能があるのでは?というのがきっかけ。 https://sapper.svelte.dev/docs#Exporting…

React x MobXな趣味プロダクトをSvelteでリライトした

続・React x MobXな趣味プロダクトをTypeScriptでリライトした - console.lealog(); このシリーズの続編で、いわばSvelte人柱シリーズです。

Svelte 3の仕組みとその手触り

実は最近まとまった時間ができたので、フロントエンド勘を取り戻すためにも、ずっと気になってたSvelteを触ってみてる。一通りDocsやTutorialに目を通しきったところで、備忘録も兼ねて記事を書いておこうかと思った次第。 Svelte 3: Rethinking reactivity …

mobx-reactとmobx-react-liteと、それぞれのobserver APIの違い

わかってる側からすると無意識に選んでたけど、わかってない側からすると混乱するよなこれ・・。と思ったので、今さらではあるが言語化の意味も込めてメモ。

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

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

wasm-bindgen/web-sysでWebRTC

っていうのをやってみた。いちおうやったので、公式のexampleにもPRも出して、マージしてもらった。

NetlifyのFormsについて

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

Preact x TypeScript x Babel x webpack x ESLintの環境構築

久々にやったら割と時間を食ったのでメモっておく・・。

PWA Night vol.15 ~テクニック/API~ に行ってきたメモ #pwanight

Web

PWA Night vol.15 ~テクニック/API~ - connpass オンライン登壇の実績を解除した・・・!

フロントエンド x RTC界隈の最近とこれから

フロントエンドエンジニアからみる、この界隈で今どんなIssueが話題になってるのかと、この先どういう動きがありそうかについて。そこまで自分に先見の明があるとも思ってないけど、アウトプットしておかないと忘れてしまいそうなので・・。ちなみにここでい…

mediasoupの開発Tips

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

mediasoupを使う前に知っておくべき概念たち

公私問わず`mediasoup`をここ半年くらいずっと触ってて、ドキュメントだけでなく中のコードもそれなりに読み通してる身として。

NodeJSのStreamについておさらい

とあるNodeJSのサーバー実装を読んでて、頻出するこいつらに目が慣れてなかったせいで、読み進めるのに時間がかかってた。ので、思い出しながら、おさらいがてらメモを残してたので記事にしておく。考え方やデザインがどうっていうよりも、コードを読む時に…

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

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

Rust x WASMのyewでTodoAppを作ってみた

話題になってたのは去年くらいな気もするし今さら感はあるけど、今だからこそすごい化けてたりしないかなーという期待も込めて。個人的には、WASMでWebアプリを作る時代になるとはあまり思えてないけど、まぁ試しておく価値はあるかなと思いその学びをメモ。

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

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

Androidで`getUserMedia()`したら`NotReadableError: could not start video source`

なかなか懐かしい気分にさせてくれますが、特定の機種でのみ発生するエラーでした。回避方法がちゃんとあるのでそれをメモっておきます。

Rustのモジュールとディレクトリの関係のおさらい

Rust 2018 Editionです。 Rustのモジュールの使い方 2018 Edition版 | κeenのHappy Hacκing Blog なおこちらの偉大な先人の記事がスッと頭に入る人は、このメモを読む必要ないです。

webrtc-statsの各ブラウザごとの実装状況をまとめた

GitHub - leader22/webrtc-stats-impl-status このリポジトリで。

chrome://webrtc-internals のしくみ

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

2019年の振り返り

Web

そして転職して1年経っての振り返り。

バンドラを使わずにRustをWASMにする

調べると初手`wasm-pack`があまりに多くて、諸事情により`webpack`いらないんですけど・・ってなシーンでどうすればいいかわからんかった。それを2019年末にあれこれトライアンドエラーしてみた結果のメモです。

WebAudioでの音声信号処理

WebAudioでの音声信号処理 〜入門以前〜 - console.lealog(); この内容を踏まえて、実際にコードを書いていく際のポイントなど。2019年末の情報です。

WebAudioでの音声信号処理 〜入門以前〜

今までずっと雰囲気でやってました。`ScriptProcessor`や`AudioWorkletProcessor`をさわったことはあっても、そこで成されている処理自体を具体的に考えたことはなかった。波形がどうとか、周波数がどうとか、PCMがどうとか、サンプリングレートがどうとか、…

WebRTCのPerfect negotiationについて

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

Mercari x Merpay Frontend Tech Talk vol.3 に行ってきたメモ

Web

Mercari x Merpay Frontend Tech Talk vol.3 - connpass 六本木のメルカリ社にて。

JavaScriptのTypedArrayについて

調べたのでメモ。