※本記事は、2023年11月1日に社名をメシウス株式会社へ変更したグレープシティ株式会社が社名変更前に開催したイベントのレポート記事です。
Server Componentsが登場するなど継続的に進化を遂げるReact
近年、急速な進化を遂げるWebフロントエンド開発の領域において、とりわけ圧倒的な導入率を誇っているJavaScriptライブラリ「React」。低廉なコーディングコストや改修・管理のしやすさがその人気の理由で、世界中にユーザーを抱える著名なWebサービスやアプリケーションの開発にも広く採用されている。
この日最初のセッションに登場したサイボウズの小林徹氏は、Webデータベース型の業務アプリ構築クラウドサービスとして、官民問わず幅広い組織に導入されている「kintone」のフロントエンドエンジニアチームを牽引するキーパーソンだ。「Reactを用いた持続可能なフロントエンド開発」と銘打たれた講演において小林氏は、Reactの特徴やエコシステムの動向、チーム開発におけるポイントなどについて解説した。
サイボウズ株式会社 kintone 開発チーム フロントエンドエンジニア
kintone フロントエンド刷新プロジェクトリーダー 小林徹氏
まず小林氏は、開発市場におけるReactの受容状況について、毎年、世界中の開発者へのアンケート調査を通じてJavaScriptライブラリの動向を伝えている「State of JavaScript 2022年版」のフロントエンドフレームワークのランキングを参照しながら、Reactが利用率や利用継続意思において、Reactと並んで3大JavaScriptフレームワークと見なされるAngularやVue.jsを抑えて1位の座を継続していることを強調。
そのうえで、Reactの特徴について、宣言的でコードが見やすく、コンポーネント指向で小さな部品を組み合わせていく形で開発が行え、Viewの変更が単方向のフローによるデータバインディングで行われるかたちとなっていることなどをあげた。
React自体、OSSとしてリリースされてすでに10年が経過しており、当初はクラス的な記法から始まって、やがて関数でコンポーネントが記述できるようになりました。その後も引き続きさまざまな進化を続けており、例えば最近では『React Server Components』が登場して、Reactに新たな特徴が加わっています」と小林氏は語る。
React Server Componentsとは、端的にいえばサーバーサイドにコンポーネントのレンダリング処理を移す仕組みだ。データベースなどサーバー側のリソースに直接アクセスできるので、データのやり取りがより円滑に行えるほか、サーバーでしか扱えないような機密情報などにもアクセスしやすい環境となる。
サーバーでの処理結果は、ツリー構造をもったReactの内部表現によってクライアントにわたされるかたちとなり、従来のSSRのようにサーバーサイドでHTMLを生成するアプローチとは根本的に異なる（※サーバーサイドレンダリングと Server Components は組み合わせ可能）。
「Server Componentsを使用することで、クライアント側ではコンポーネントが実行されず、ページのレンダリングが高速化。また、開発者にとってはサーバーサイドだけを動作環境として意識すればよく、シンプルに捉えられるため、開発体験が向上するといったメリットもあります」と小林氏は説明する。
