mizdra's blog

ぽよぐらみんぐ

1Password のカスタムフィールドを autofill に利用する

1Password にはカスタムフィールドという機能があります。これを使うと、ログインのためのちょっとしたメモや、秘密の質問の答えなど、好きな情報を id/pass とともに記録できます。 秘密の質問の答えを記録している様子 ところでこのカスタムフィールドは、…

Sentry で IP アドレスの収集をやめる

@sentry/browser を使うと、ブラウザでエラーが発生した時にそのエラーを Sentry の集計サーバに送信して記録してくれます。送信されたエラーはエラーの種類ごとに Issue という単位にグルーピングされ、Issue ごとに何件発生しているのか、何人のユーザで発…

巨大なコードベースに対して段階的に新しい ESLint rule を導入する

背景 既存の巨大なコードベースに対して新しい ESLint rule を導入したいことがある ESLint を導入した段階では厳しすぎて OFF にしていたけど、やっぱり便利なので ON にしたい、みたいなケース 例えば @typescript-eslint/no-floating-promises とか しか…

svh という策定中の CSS Unit について

css

CSS Values and Units Module Level 4 という提案にて、 svh という新たな CSS Unit の導入が検討されています。簡単に言うと、ブラウザのナビゲーションバーやオムニボックスの高さを除外した vh です。 There are some changes being proposed regarding v…

nodebrew と homebrew の Node.js が重複しないようにする

普段 yarn を homebrew で管理していているのだけど、yarn が node への依存を持っているせいで、インストールしたり、更新したりする時に Node.js が homebrew で追加でインストールされることがある。けど Node.js は nodebrew で管理しているので、2重で…

icon-suggestion v2 をリリースしました

あの大人気 Scrapbox UserScript の v2 をリリースしました。既に icon-suggestion をお使いの方は、自動で v1 からアップデートされているはずです。 「icon-suggestion って何?」という方はこちら: www.mizdra.net 前バージョンからの変更点 ポップアップ…

JavaScript で print デバッグ時に変数名を出力する

数列の和を求めるプログラムを作成することになり、意気揚々と以下のようなプログラムを書いたという状況を想像して下さい。 function sum(nums, acc = 0) { if (nums.length === 0) return 0; if (nums.length === 1) return nums[0]; return sum(nums.slic…

思考実験: Wasm が普及した未来を考える

…という題でサークル仲間とディスカッションして盛り上がっていた。面白いアイデアが色々出てきたので、たまには正確性を無視して思い思いに書いてみる。裏取りは全くしていない。 もし Wasm が普及したら、.wasm に含まれる ホスト言語 (Wasm のコンパイル…

株式会社はてなに入社しました

株式会社はてなに入社しました 株式会社はてなに入社しました - hitode909の日記

GitHub Packages を npm install するための手段あれこれ

概要 社内向けの npm packages を publish するのに GitHub Packages が便利 GitHub 内で完結してお手軽 & Actions を使って自動リリースフローを作りやすい しかし GitHub Packages に上がっている npm packages を npm install するには少々手間がかかる …

Webpack における bundle size の変化を継続的に監視する

main ブランチとこのPRでどれだけ bundle size が変化したか比較したり、増加量がある閾値を超えていたら CI を fail させる、みたいなソリューションは結構紹介されているけど、bundle size の変化を継続的に監視する方法はあまり紹介されていないようだっ…

VSCode で tsserver や ESLint が通知するエラーがおかしくなった時にやること

TypeScript を書いていると、tsconfig.json を変更したのに何故かその設定が tsserver に読み込まれないとか、vscode-eslint に変更が通知されずに古い型情報を使って lint し続けているとか、そういうことが多々ある。大体 VSCode を再起動すれば解決するの…

global install したパッケージを引き継ぎつつ Node.js のバージョンを上げる

時々 nodenv やら nodebrew やらで Node.js のバージョンを上げているのだけど、素朴にバージョンを上げるだけだと npm で global install したパッケージが引き継がれない。その結果、新しいバージョンで手作業で global install し直す作業を強いられるこ…

rule ごとに高速に eslint --fix できるツールを作った

大量のエラーに対して rule ごとに高速に eslint --fix できるツール 「eslint-interactive」 を作ったので、その紹介です。 動機 ESLint のデフォルトの出力はエラーの発生源や修正のためのヒントなど、開発者に役立つ多くの情報を含みます。これは多く場合…

ブラウザにおけるメモリリークを解決するために読んでおけると良い資料

最近趣味や仕事の Web アプリケーションでメモリリークに遭遇して、頑張ってメモリリークの原因を突き止めて修正する、ということがあった。その過程でメモリリークについて色々調べて知見が溜まったので、学習資料の紹介という形でアウトプットしてみる *1…

スナップショットテストの向き不向きについて考えてみる

ふとスナップショットテストってなんだろう、どういう場面で向いていて、どういう場面には向いていないんだろうと考える機会があって色々調べてました。丁寧な記事にしようとしたのですが、上手くまとまらなくて挫折してしまった… とはいえこのまま手元に置…

自分を鼓舞する言葉を思い出しながら文章を書く

ここ一番は頑張りたいだとか、ここは力を入れてやりたいとか、そういった場面に遭遇する時が時々ある。最近だとイベントで発表する資料を作ったりだとか、卒業論文書いたりだとか、1つの技術をひたすら深堀りしていく記事を書いたりだとか。けどそういったも…

2020年ブックマークランキング

年間ブックマークランキングジェネレーター で作ってみた。手軽に1年を振り返れて便利。8位は去年に投稿した記事だけど何故かランキングに入っている。まあ気にしないことにします。 mizdra's blogの2020年ブックマークランキングベスト8(累計600ブックマー…

日向縁さんの笑い声について思いを馳せる

この記事はゆゆ式 Advent Calendar 2020 13日目の記事です。12日目はセレーノ (@haidorenzia) さんの尻尾ファンタジアでした。 adventar.org 私事ですが最近COMIC FUZできららを定期購読するようになりました。以前は一気に読んだときの充実感が味わえない点…

polyfill を深堀りする

この記事ははてなエンジニア Advent Calendar 2020 5日目の記事です。4日目は id:syou6162 さんで、数字のバラ付きを考慮して意思決定する技術でした。 qiita.com developer.hatenastaff.com こんにちは、id:mizdra です。今年新卒としてはてなに入社し、Web…

ポケモン乱数調整Wikiという取り組みについて

この記事はPokémon RNG Advent Calendar 2020 1日目の記事です。 adventar.org 皆さんお元気でしょうか。楽しみにされていた方は大変お待たせしました。Pokémon RNG Advent Calendar、2年振りの開催となります。去年はとある問題により開催を渋々見送らさせ…

target=''_blank" な <a> タグに noopener だけでなく noreferrer も付けるべきか

追記 2020/10/29: モダンブラウザによって noreferrer が自動的に付与されつつある、という説明をしていましたが、正しくは noopener の間違いでした。既に記事の方は修正済みです。 追記終わり。 target="_blank" は新しいタブでリンク先を開くためのオプシ…

150B で動く strictly-typed な Event Emitter を作った

超軽量で strictly-typed な (強く型付けされた) Event Emitter を作りました。 github.com 背景 従来 Event Emitter は ブラウザでは EventTarget として、Node.js では EventEmitter として、それぞれ独自に実装されていました。これらは機能的には変わり…

趣味で創作する時は常に何かしら新しいことに挑戦する

普段趣味プログラミングで何か作る時、何かしら新しいことに挑戦するということを意識している 例えば何か触ったことのない技術を導入してみるとか、採用したことのない開発手法を取り入れてみるとか より具体的に言うとHeroku導入してみるとか、TDDで開発し…

Scrapboxのページ内に埋め込まれているアイコンをsuggestして挿入できるUserScript作った

Scrapboxで会議の議事録を取っていると、誰の発言かを記録するために他人のアイコンを挿入したい、という場面が出てくる。Scrapboxでは ctrl+i と入力すれば簡単に自分のアイコンは挿入できるけど、他人のアイコンを簡単に挿入する方法は意外にない。一応以…

画像による Layout Shift が無くなる Web がやって来る

はじめに Web では古来より <img> タグを用いて画像を読み込んでいました. しかし <img> タグにはアスペクト比に関する情報を埋め込むための属性が用意されていません. そのため, ブラウザが画像をネットワークから fetch して読み込みが完了するまで, レスポンシブな …

株式会社はてなに入社しました

株式会社はてなに入社しました 株式会社はてなに入社しました - hitode909の日記

OK Google, 今日のゆゆ式

この記事はゆゆ式 Advent Calendar 2019 21日目の記事です. 20日目はJonah Wilsonさんのゆゆ式BDを持って星を見に行った話でした. ゆゆ式 Advent Calendar 2019 21日目の「今日のゆゆ式」の動画です #ゆゆ式achttps://t.co/tezNbs9JTK pic.twitter.com/NtUvp…

iTerm2 で `cat /dev/urandom` すると印刷ダイアログが出ることがある

皆さんは /dev/urandom と呼ばれるUnixデバイスをご存知でしょうか. /dev/urandom は一言でいうと擬似乱数を出力する疑似デバイスで, catすると以下のようにランダムなバイト列を逐次的に出力してくれます. 出力するバイトの値域に特に制限は無いため, ター…

Review AppsでFirebase Authenticationを使いたい

最近趣味で作っているWebアプリをHerokuにデプロイしてReview Appsを導入したところ, Firebase Authenticationと相性が悪くてちょっとハマったという話. 当該のアプリではFirebase Authenticationを使っていて, ログインボタンを押すとTwitterのOAuth認証画…

ポケットモンスター・ポケモン・Pokémon・は任天堂・クリーチャーズ・ゲームフリークの登録商標です.

当ブログは @mizdra 個人により運営されており, 株式会社ポケモン及びその関連会社とは一切関係ありません.