🕌

Next.js App RouterでChakra UIが'use client'無しで実装できるだけだった話

2024/02/28に公開

以前の私の記事にて

以前私が出した記事で、
Chakra UIが'use client'無しで使えるようになってました!と記載していました。

実際に use client を実装しなくても動いていました。

ただ、以下のとおり気になるコミットを見つけたので確認してみました。

実際はどうなのか

結論としては、Chakra UI 自身がビルドする際に use client を付けるようになっただけのようです。。(認識違っていたらご指摘ください。。)

その為、確かにuse client無しの実装で使えるようになったものの、実際はServer Componentsとして機能しているわけではなさそうです。

以前の記事で「動いています!」と記載していたものの、実はClient Componentsとして機能していたことになるかと思います。

とはいえ

ライブラリ側でやってくれるのは純粋にありがたいですね。
client components として使う際は毎度use clientを付けていたのですが、これが不要になるということですからね。

この先どうなるんだろう

前から気になっていた、Panda CSS
Chakra UIの開発チームが出しているようで、CSS-in-JS の課題を解決することを目的とした新しい CSS-in-JSとのこと。
Chakra UI や Tailwind CSS など様々なライブラリから影響されておりそれらのいいとこ取りをしたようなライブラリのようですので、こっちの方が今後盛り上がってくるのでしょうか。

まとめ

Chakra UIはuse client無しでも機能はしますが、ライブラリでつけてくれるようになっただけのようで、Client Componentsとして機能するようです。

実装自体は多少楽にはなったものの、個人的にはChakra UI以外のPanda CSS等にも触れてみて今後の動向を注視してみようと思います。

GitHubで編集を提案
コラボスタイル Developers

Discussion