概要
どうも、@daiki1003です!先日、こんな動画を見つけたので共有しつつ記事にもしていこうと思います。
めちゃくちゃ良い動画だなと思ったのでまだの方は是非ご覧いただければと!
個人的にはこの動画見ただけでこの方のファンになりましたw
もうすでに笑顔が素敵笑
それでは行ってみましょー!
🌈 ざっくり概要
以下のような果物リストを表示するだけのウィジェットがあるとします。
この繰り返し部分はコードの再利用性を高めるためにも切り出す必要がありそうですね。
あなたならどちらの切り出し方をしますか?
案1:ヘルパーメソッドを作る
案2: (プライベート)クラスを作る
さて、どちら派だったでしょうか?
本記事及び上記動画のサマリ
・基本的にはヘルパーメソッドより新たなWidgetを作ろう
・無駄な再描画を防ぎやすい
・テストしやすい
・適切なBuildContext
が受け取れる
それでは解説に移りたいと思います!
基本的にはヘルパーメソッドより新たなWidgetクラスを作ろう
本記事及び上記動画でのおすすめは案2のクラスを作る、です。
さてなぜこれがおすすめなのでしょうか?
確かに、ヘルパーメソッドだと元のクラスであるMyGreatestWidget
のプロパティ
に簡単に触ることが出来るため、引数を簡略化できるというメリットはあります。
上記例で言うと、onPressed
に関しては、引数に必要ないですよね。
では、ここからは両者を比べつつ解説出来ればと思います。
無駄な再描画を防ぎやすい
以下のような少し大きめのウィジェットの右下にいいねボタンがあったとします。
ヘルパーメソッド
いいねボタンを押した際にリビルドされる範囲はSomeBigWidget
全体になります。
つまり、_buildSomeWidget1
などもリビルドされます。
クラス化
リビルドは_LikeButton
のみに閉じます。
これは想像通りの挙動ではないでしょうか。
テストしやすい
では、テストについてはどうでしょうか?
ヘルパーメソッド
テストをするためには、ヘルパーメソッドを含むクラスのインスタンスを作る必要があります。
冒頭の例で言うところの、MyGreatestWidget
です。
クラス化
そのクラスのみインスタンス化すればテストが可能になります。
今回の例でいうFruitItem
です。
適切なBuildContextが受け取れる
下の様なBuilder
を持つWidget
について考えてみましょう。Bulider
のbuilder
プロパティの引数はinnerContext
とbuild
が持つそれとは別名にしてありますね。
この場合、IconButton
が参照している、context
は時と場合によっては
古いものを参照してしまう可能性があります。
クラス化
改善したのがこちらです。
こうすれば、NewIconButton
は確実に、正しいBuildContext
を得ることができます。
ヘルパーメソッドって使うことあるの?
僕の場合、クラス化した上で、コールバックが多いなどインスタンス化処理が長くなってしまった場合になど
可読性を高める用途で使ったりしています。
🎯 最後に
いかがでしたでしょうか?Flutter
は、本当に書いてて楽しいのですが、
まだデファクトスタンダードと呼ばれるものが他言語に比べると少なく、
たまにこう言うどっちがいいんだろう?みたいな判断に迷うことがあるのでそういった迷いを
なくせる記事を今後も書けると良いなーと思います。
Twitterフォローお願いします
「次回以降も記事を読んでみたい!」「この辺分からなかったから質問したい!」
そんな時は、是非Twitter (@daiki1003)やInstagram (@ashdik_flutter)のフォローお願いします♪
Twitterコミュニティ参加お願いします
Twitterコミュニティ「Flutter lovers」を開設しました!参加お待ちしております😁
☕️ Buy me a coffee
また、記事がとても役に立ったと思う人はコーヒーを奢っていただけると非常に嬉しいです!
コメント