先日Amazonでゴミ箱ホルダーみたいなのを購入したのが届いた。以前まではAmazonのダンボールのゴミ箱を使っていたが、ゴミ袋が取りやすくなったりゴミ袋を付けたりしやすくなっていい感じ。 その他たまってたダンボールを片付けたりしていた。切らしていた雑巾なども補充したので生活をぼちぼちやっていきたい。 今日は久々に昼にマクドナルドを食べた。自分の料理ばっかり食べていると飯に飽きてくる節があるなあと感じたので、月1くらいで出前を頼んで家で食べたいなとおもった。 最近季節の変わり目だからか朝起きるのがかなりきつい。業務に支障が出てきているので、pavrokをまた購入してもいいかもなあと考えている。 明日は家の契約の更新処理と様々な支払いのために外出したいなと考えている
Posted
夜に東京で予定があったので、オフィスに出社して仕事していた。 深夜にやったツイートがなんかすごい伸びてたのでミュートにした。基本的にTweetがたくさんfavられることとかないので、初めてミュートにする機能を使った。 仕事は自作したデータ構造をReactコンポーネントのレンダリングサイクルと接続するためのAPIを書いたり、説明用のドキュメントを書いていたりしていた。 自作したMutableなオブジェクトの変更に対してReactコンポーネントを接続する時に次のようなコードをよく書く。 import {useState, useEffect} from 'react' interface Collection<T> = { updateSnapshot(value: T): void getSnapshot(): T subscribe(callback: () => void): () => void } const useCollection = <T>(observableCollection: Collection<T>): T = (observableCollection) => { const [state, updateState] = observableCollection.getSnapshot() useEffect(() => { return observableCollection.subscribe(() => { updateState(observableCollection.getSnapshot()) }) }, [observableCollection]) return state } ReactコンポーネントはupdateStateが呼び出される度にuseStateが書かれているコンポーネントを再レンダリングするという特徴を利用して、自前で定義したMutableなCollectionに変更がある度に、useCollectionを呼び出したコンポーネントが再レンダリングさせる。ということを実現している。 これにselectorやmemo化を加えた概念がReact17までのStoreライブラリとReactを繋ぐhooksの実装としてメジャーだったのだが、React18から追加されるConcurrentModeと併用した時に、画面が一瞬だけ前の状態を表示してしまうなどのチラつきが発生してしまう問題を抱えている。 See. https://youtu.be/oPfSC5bQPR8?t=245 この問題を解決するためにReact18から useSyncExternalStore というカスタムフックが提供されていてこれにstoreのメソッドを食わせることでこの問題を解決できる。 職場のコードはReact17を使っているので useSyncExternalStore を使わなくても問題ないし、ReactからこのAPIがexportされていないので使えないが、将来的にReact18に移行する際に実装を変更することなく移行できるようにしたい。 そんな人向けのライブラリとして、 https://www.npmjs.com/package/use-sync-external-store が存在する。 これは古いReactバージョンで useSyncExternalStore を使うためのshimsで、React18が動いている場合は自動でそちらにfallbackしてくれる便利ライブラリだ。
Posted
ブログを書くのが習慣になっていないと近況記事みたいなのでまとめていろいろ書きがち 例によってまとめて書く。 労働 やっていた、が今回のクォーターは成果が芳しくなかった。 なんか単順に仕事する元気があんまりなかった。とはいえ仕事をしなければいけないのでやることはやっていたのだが、やることしかやってなかった感じだ。 最近はすっかり調子も回復してきており、自分が提案した仕様をアプリケーションに入れるためにあーでもないこーでもないみたいなコミュニケーションを頻繁にやったり、サンプル実装を書いてちゃんと動くか検証したりなどをやっている。 検証は順調であり、プロダクションリリースしたらちゃんとブログとして設計する上で考えたことを記述したいなとおもえるほどの自信作なので、これを読んでいる人間がまだいるのであれば楽しみにしていてくれ。:smile: 調子はよくなってきているが、なんか自分があまりやりたくないことに対する気合みたいなのがまだ回復してない気がするので、この辺りの熱意も回復するといいなーとおもいつつがんばる。 ちなみに仕事で元気がなかったのは、大規模な作り直しを終えてしまったから。燃え尽き症候群である 趣味 ゲームしていたり、TypeScriptで パーサーコンビネーター を書いていたりした。 こいつも完全なPrivateなプロジェクトで既に使っていて、使いながら機能を拡張していってる。型で困っていたところこりーさんに助けてもらったりして、だいぶ使いやすい感じのInterfaceになってきてよい。 このプロジェクトを作る上でランタイムとしてdenoをはじめて使ってみた。 denoモジュールからparser-combinatorを呼び出す時は、GitHubのReleasesからrawなmod.tsをimportして使えるのでパッケージマネージャーがなくてもライブラリを動かせて大変便利だなあっておもった。 また、dnt を使ってnpm向けのartifactを出力してpublishすることでNode.jsのスタックでも使うことができる点もよい。 dntを使ってビルドするのはNode.js + TypeScript でnpm packageを作るのに比べてかなり楽だ。denoを使うことで何もしなくてもTypeScriptの型チェック環境やテスト環境が提供されるし、rollupを使ってバンドルする時もd.tsを出力するために設定を自炊する必要がない。 また、Denoのstdに入っている assertEquals は jestと違い 型定義が <T>(actual: T, expected: T, msg?: string) ⇒ void なのもよくて、この型定義だとactualで入力した値のexpectedを手書きする時に補完が効くので,全てがanyになるjestの toStrictEquals などに比べてテストを書く時の体験がよい。 今後はTypeScript用のライブラリを自炊する必要がある場合はdeno + dntを使っていこうとおもった。 ErgoDash EZ 8月の末に長く使っていた自作キーボードが壊れてしまって、直そうとしたのだがスプリングピンヘッダが存在しなくて、なくなく購入した。 届いてみるとキー配列は一瞬で手に馴染むし親指周りで使えるキーは増えるしでいい買い物だった。 ダイエット 油断したら87kgまで増えてたので再開した。今回は白米は完全にカットせず量を少量にして、野菜や肉はちゃんと食べる感じでやっている。 糖質制限ダイエットをやるとまじで昼間仕事にならないほど脳味噌が死んでしまうので、ちゃんと仕事になるくらいまでの糖質は取るようにした。 とはいえこれだけだと絶対に痩せないので週3くらいで腹筋をやっている。 2ヶ月で87kgから80kgまで体重が落ちたのでこのままやっていきたい。とはいえ最近79.9kgから全然体重が下がらないのだが… 最近の悩みは毎週金曜出社して外食したり酒を飲んだりしているのだが、一週間のダイエット成果がこれで撃ち消されてる感じがする点だ。出社をやめれば解決するのだが、このイベント自体は結構好きなのでなるべくそういうことはしたくない……… 自炊 一時期ダレてやっていなかったが、やっている。最近は料理を作ることが日常になってしまい、一々写真とったりしなくなってしまった。 最近では豚の冷しゃぶサラダやポトフなど、ヘルシーなメニューがメインに作ってたべている。 昨日は豚肉を食べる気合がなかったので、蒸し鶏をキャベツと人参と一緒にフライパンで蒸して作った。優しい味がしてよかった
Posted
type RegisteredUser = { kind: 'registered', id: string, name: string, } type TentativeUser = { kind: 'tentative' id: string, name: string, } type User = TentativeUser | RegisteredUser みたいな構造が存在した時に User[] に対する振舞いを定義したい！みたいなモチベーションが発生することがある。 例を上げると、登録済みのユーザーのみでfilterしたい！みたいな感じだ。 フロントエンドのコードを書いたり見たりしたりすると、やりがちなのは User[] で引き回してコンポーネント側で次のようなコードで実装するやつだ。 import { FC, useMemo } from 'react' const UserCard: FC<{ users: User[] }> = ({users}) => { const registeredUsers = useMemo(() => { return user.filter((u): u is TentativeUser => u.kind === 'registered') }, []) return <>.
Posted
なんか仕事していたり趣味でコード書いてたりしてこっちに記事を投稿してなかった。 そろそろ広告が付く気がするので死ぬ気で記事を更新しようと思う(古代文化) wikiシステムを作っている https://github.com/nibo4/matsunoki 会社で使っているNotionへのイラ立ちが抑えられなくなってきており、最近はwikiシステムを作ろうとしている。 ここ1ヵ月で認証だったりCIだったりの足回りを大体整えた。 こういう者を作る時のベストプラクティスとしてコアコンセプトの実装をやって、ちゃんと使えることを最初に証明してから認証だとかテスト基盤を作っていく というのが一般的だが、今回は逆のアプローチで作っている。 これには理由があって、コアコンセプトができあがった時の実装がテスタブルじゃなかったりそもそもテストが少なかったりすると、そこから認証とかを作るためにリファクタリングしたりしないといけなくなるのだが、それが面倒でエターナルことがよくあるためだ。 また、新規技術の採用も積極的にやっている。バックエンドはRust + axumでフロントエンドはTypeScriptのままだが、最近巷で話題のSolidJSを採用してみた。 axumはtokioベースでユーザーフレンドリーなAPIを提供しているWebサーバー立てるマンで、hyperよりもroutingの構造が書きやすかったり、actixとかで採用されているFromRequestTraitなどを輸入してきていて、リクエストハンドラの仮引数の定義次第で自動的にバリデーションを走らせたりヘッダーが適切に設定されているかなどを検証できて、便利だなあとおもった。 SolidJSはVue + React / 2 みたいな感じで個人的には今のところかなり使い勝手がいいUIライブラリに見える。 現職ではReactを書いてるのでそれとの比較になってしまうのだが、Reactで再レンダリングをちゃんと抑制しつつコードを書こうとするとどうしてもmemoだけだと大変すぎて、「Reduxや自作のストアパターンを作って繋ぎ込む部分で、ストアの値が更新されていたらforceUpdateをする」 みたいなパターンに甘えがちなのだが、SolidJSだとこのパターンがデフォルトで採用されていて、自分がやりたいことを素直に書けるなあとおもった。 どちらの技術も5万行も書いてないので、もうちょっとwikiシステムがおおきくなったら再評価していきたいなとおもう あと、友達のkb10uyと一緒に作ろうぜ！っていいつつ、動作させる基盤がまだ揃い切ってないので今週中には全部できるといいなあという感じ 料理 相変わらずやっている。友達が一人暮らしをはじめたのもあって、みんなで料理をDiscordに投稿していたりしたが、最近は写真活動は落ち付いてきてしまった。 最近よく食べている食べ物はしらすで、これはすごい。何も調理せずに白米に納豆と乗せて食べるとうまいし最悪そのまま食ってもうまい。最近は冷凍するために沢山かって保存していたりしてすっかり冷蔵庫のいつものメンバー入りしてしまった。 あとはおやつの間食も控えていて、冷蔵庫であまりがちな人参や胡瓜を野菜スティックにしてディップしながら間食している。あんまり健康になることを望んでいるわけではないが、野菜はおいしいし水分を含んでいるので喉も潤うしなんかお得な気分になる。 ディップするタレは色々試しているのがだ、一番おいしいと感じたのは 味噌と胡椒と砂糖と少量の水を加えて混ぜたやつだ。調味料はいろいろ混ぜて使うと味の解像度が増えて食べた時楽しくなる印象がある。まあいれすぎると味がうるさくなるという欠点もあるのだが… Twitter 昨今のTwitterはレコメンドが暴走していて、自分が見たくもないコンテンツがめちゃくちゃ表示されていて嫌だなあと感じていたのだが、これを抜け出すためのコツが最近わかったのでここに記載しておこうとおもう。 日本人のTweetをふぁぼするのをやめて、 #NaturePhotography などのハッシュタグの画像付きツイートをふぁぼすることだ。 こうすることによって日本人の陰湿なツイートがレコメンドされるのを避け、綺麗な自然の写真のみを摂取し続けられてお得だ。 最強料理ツイートなどをふぁぼっていた時期もあったが、人気が出てきた日本人は政治評論や人間評論に夢中になって、最悪情報しかたれながさなくなるので、避けたほうがいいということがわかってきた。 仕事 先月初めの話になるが https://scalebase.com/news/article#ft82t7sfn_oc これを開発していてリリースした。 対応自体はシンプルにReactComponentで一段ラップすることでどの権限がないと見れないのかという属性を付与できる簡単な仕組みにしたのだが、補完できるようにする基盤を用意したり、そもそも対応する箇所が多すぎるなどで大変だったなあ。 この後にチーム移動してまたでかい機能を作ることになった。 前のチームの成功体験として、「ちゃんとした粒度でチケットが切れていて、いつまではリリースできないのかが明確にする」といったことが明確になったので新しいチームでもそれを実績していたり、それだけではうまく回りそうになかったので細かく動作確認するための環境を作るなどをやっていたりする。 自分や回りの人間の作業のクオリティを上げるためにどういうのを用意すればいいか というのを考えながら実績するのは楽しいな。とおもったりした。一歩でも明日を今日よりよくするためにこういう作業は今後も積極的にやっていきたい。 こういうのを社外にアウトプットできるとより良いらしいのだが、僕が日本の巷に興味ないのと友達の間で効率よく作業するためにはどうすればいいのか議論できればそれで満足なので、社外のためにアウトプットするみたいなことはしない気がする。 ほかにも友達とスカイツリー登って酒を買ってきた話とか、呑みをやった話とかいろいろしたいのだが、収拾が付かなくなるのでまた今度にしようとおもう。さらばだ…
Posted