タオルケット体操

サツバツいんたーねっとでゲームとかガジェットのレビューとかをします

PROのためのスーパー型が付くReactフォームライブラリをつくった

GitHub - hachibeeDI/mayoiga

hachibeedi.github.io

つまりReactフォーム界のHANAMASAということ。

良い特徴、あるいはReact Hook Formとの違い

1. refに依存していない

自作するとわかるのですが、Formの状態管理(およびバリデーション)は素朴な実装だとあっという間にUIをブロックするレベルでパフォーマンスが劣化します。
Reactが難しい、と言われる一つの原因ですね。

React Hook Formは各inputをUncontrolled Formとする代わりに、状況に応じてDOMを直接操作することで、普通のフォームであれば適当に実装してもパフォーマンス劣化が起こりにくいです。
昔はrefを直接渡していたようにおもえますが、いまは <input {...register('hoge')} /> というようにインターフェースを隠蔽することが推奨されています。もしかしたら将来的にrefを排除することも考えている可能性はあります*1が、少なくとも直近のバージョンではそうでした。

APIがシンプルでパフォーマンスも素晴らしい、いいことづくめじゃん!と思われるかもしれませんが、当然デメリットがあります。
というかちょっと使い込んだらデメリットがモリモリと明らかになったのが今回フォームライブラリを自作した理由の一つです。

例えば……refに依存している以上、中身の挙動がDOM操作なので初期値の導入まわりでReactのlifecycleと競合を起こします。
またuncontrolledな中身をref越しにどうやって操作しているのかはブラックボックスです。なので useImperativeHandle を使っていると意味不明なエラーが出まくります。
またこの シンプルなAPI は簡単なフォームの作成に特化しているので、refを公開しないような自作あるいはサードパーティの複雑なformを使い始めた瞬間にコード量が増え、APIは非直観的なものになります。

これらを解決するために作ったのがMayoigaです。
ゆえに「 useImperativeHandle なんてつかわねーよ!」というプロジェクトであれば、あるいはrefへの依存に居心地の悪さを感じないのであればHook Formで十分かもしれません。

2. バリデーション前と後で違う型をつけられる、その他の場所でも型がめっちゃつく

はい。

*1:refなしであのシンプルなAPIを保てるとはおもえないですけども

続きを読む

異説 ぼくがかんがえた最強のフレームワーク

注意:本稿にはあまり一般的ではない(かもしれない)筆者の独自思想がふんだんに盛り込まれています。これを受けてどう考え、行動するのかは自己責任でよろしくおねがいします。

ソフトウェア開発に銀の弾丸なし、という言葉は広く市民権を得ています。多少なりとも開発の経験がある方ならばこれに異を唱える人はいないでしょう。

しかしそんな我々もアーキテクチャ(多くの現場でこれはフレームワークの選定と同義語である)の話になると無意識のうちに「最強の何か」を想定して思考してしまいがちです。そうだよね?

なので未来の自分へのメッセージもかねて、いまここではっきりと宣言しましょう。   この世界に最強のアーキテクチャは存在しません。各プロダクトに合わせた最適が存在するだけです。

続きを読む

リモートワーク時代の社会人へおくる文章術 基礎への入門編

リモートワークが当たり前の時代になりつつあります。
弊社では現在、試験的にビジネス側も含めた全メンバーでスクラムを実施しています。

正しく伝わる文章を書くための技術というのはもちろん、いかなる状況下でも非常に大事なものです。しかし、物理出社による対面の人間関係や、マネージャーと個々のメンバーがピラミッド型の組織構造においては文章による情報伝達の拙さを他の方法で補うことが可能でした。

リモートワーク、そしてスクラムによるチーム単位でのタスク管理という状況下ではそうはいきません。
非同期に、効率的かつ正確な情報伝達を行う。そのためには全てのメンバーが正しい文章の書き方をわきまえている必要があります。

正しい文章を書く、と言うのは簡単ですが一筋縄ではいきません。
そもそも我々は義務教育で一度も文章術を習いません。そのため特別に独学した人でもない限り、普通に生きてきた日本人は情報を正しく伝える文章というものを書けません。そこには口語との違いや、日本語そのものの文化的特性というものが関わっています。

本気で書くと本一冊を費やしても終わらないトピックスですが、ここでは知っておくだけで明日から実践できる付け焼き刃の技術をここで伝授します。

続きを読む

型はみんなの心の中に存在しているんじゃない?

はじめに

まずインターネットのお気持ち記事で「型がある」とか「型がない」とか言い始めたら、書き手がどういった意図でそのような言葉を選んだのか警戒しなければならない。

全部を語るとそれだけで5記事分くらいの分量になりそう*1なので割愛するが、世間的には「静的な型検査を行える」ことを指して「型がある」と呼称しており、その強弱とかランタイムの挙動については基本的に無視するという姿勢をとっているようだ。きちんと研究している層にとってはなんとも歯痒い定義なのかもしれないけれど、雑に語るにはとても便利な切り分けなので本記事も基本的にこれを採用する。

余談だけど、世間一般が語る「強|弱い型付け」の定義って恣意的すぎて意味不明だわとおもってたんだけど、いまWikiで確認してもやっぱりどういう基準で決めてるのか意味不明。たぶん時代遅れの概念なんだとおもう。

  • はじめに
  • 変数の型が静的なのは我々にとってごく自然なこと
  • 関数の存在は人類には早いので型は静的なほうが優しい
    • 補足:ジェネリクスを知らないという枷
  • 型検査は動作チェックの自動化
  • じゃあなんすか、型なし言語にはなんの優位性もないっていうんですか
    • 1. メタプログラミングがやりやすい
    • 2. プラグイン的なものへの活用
    • 3. その他
  • まとめ

変数の型が静的なのは我々にとってごく自然なこと

*1:ついでに筆者は十分な知見をもっていない

続きを読む