にゅーとぴあ

気が向いたら書きます。

フロントエンドカンファレンス北海道2025に参加してきました

9月6日、フロントエンドカンファレンス北海道2025が開催されました！先日初めてTSKaigiへ参加したのですが、ネット上で得られる知見以上のものがカンファレンス参加により得られると感じ、今後もいろいろなカンファレンスへ参加していきたいと思うようになりました。簡単ではありますが参加体験記を書いたので、少しでも現地の雰囲気を感じ取っていただければ幸いです。

会場の様子

会場は札幌駅から1駅の場所にある桑園駅近くにある「エア・ウォーターの森」という施設でした。親戚の家が札幌市にあったため、今回泊めてもらったのですが、この施設も最近できたという話を聞きました。

「Frontend Conference Hokkaido 2025」と日付が記された大型ポスター。北海道のモチーフとともに、Platinum／Gold／Local Gold／Silverなどの区分で多数のスポンサー企業ロゴが並び、隅にReact・Vue・JavaScript・TypeScriptのアイコンが配置されている
会場内の看板

会場では「フロントエンドチョットデキルルーム」と「ガウディルーム」の2部屋でトークが行われており、並行して施設内の中央スペースでスポンサー企業によるブースが開かれていました。

Techtouchのブースではフロントエンドに関するクイズに挑戦してみたのですが、想像以上に難易度が高く、5問中2問しか正解できませんでした😭

ちょっと社のブースではなんとVercel公式のNext.js Tシャツが配布されていました！

机の上に置かれた黒いTシャツ。胸元に薄いグレーで「NEXT.JS」のロゴがプリントされている
Next.js Tシャツ

学生支援

今回のカンファレンスでは学生支援プログラムが用意されており、チケット代を免除していただきました。

note.com

さらに学生向けの特別プログラムとして、お昼休みにはお弁当をいただきながら、運営の方々とお話しする機会も設けられていました。

机の上の紙容器に入ったランチ。黄色いターメリックライスの上にグリルチキン、半分に切ったゆで卵、トマトやブロッコリーなどのサラダが添えられ、右に緑茶のペットボトル、手前に割り箸とおしぼりがある
お昼ごはん

今回実行委員長のn13u(@n13u)さん、前回実行委員長のおゆ(@yud0uhu)さんをはじめ、スタッフの方々から貴重なお話を伺うことができ、有意義な時間となりました。ありがとうございました！

聴講したセッション

実際に聴講したセッションの中で、特に印象に残ったもののいくつかを紹介します。

「フロントエンドで1,000万件のデータをリアルタイム処理しろですって？😱」WebGL2を活用したGPGPUの世界へ

fortee.jp

WebGLを使った大量データ処理についてのお話を聞くことができました。1,000万件以上のデータポイントをリアルタイムでレンダリングやフィルタリングする技術について紹介されていました。比較として挙げられていたDuckDBなどのwasm系の技術がそれほど高速ではなかったというのは少し意外でした。

セッションでは実際にCPUによる演算/GPUによる演算でどれほど実行時間に違いがでるのかのデモがあり、大規模データを扱う際特にGPUが威力を発揮することがよくわかりました。

Viteのプラグインを作ると内部をイメージできるようになる

fortee.jp

こちらのセッションも、実際にデモを動かしながら進行されていました。「存在しないモジュールをインポートできるようにしたい」というテーマを取り上げ、Viteプラグインの仕組みに触れながら、vite.config.jsを編集して作っていました。Viteのプラグインがこれほどシンプルに実装できることに驚きました。

RSCの時代にReactとフレームワークの境界を探る

fortee.jp

React Server Componentsについて掘り下げたセッションでした。@lazarv/react-serverというライブラリが紹介され、RSCがReact本体の機能なのかという疑問について解説されていました。複数の異なるフレームワークで、共通の構文を使ってRSCが利用できることから、Reactが一種の規約としての役割を担っているという考えも面白かったです。

AI時代のUIはどこへ行く？

fortee.jp

AIとUIの未来について考察されたセッションでした。参考資料として「The future of AI interaction: Beyond just text」という記事が紹介されていました。

現在はAIとチャット形式で、自然言語で対話するUIが主流となりつつありますが、その前は検索エンジンを用いた単語単位、キーワード単位での入力が中心でした。

AIとUIの関係性として3つのパターンが示されていました。1つ目は「UIの中でAIを使う」パターンで、チャットボットなどが該当します。2つ目は「AIがUIを作る」パターンで、ChatGPTのグラフ機能やClaude Artifacts（window.claude.completeを通じて、ユーザーが公開したプレイグラウンド内でAIのAPIを呼び出す機構）が例として挙げられていました。3つ目は「AIがUIを受け取る」パターンで、MCP UIなどが該当します。

3つ目のパターンについて、「近くにあるおすすめのラーメン屋を表示し、そこまでの行き方をGoogleマップで表示する」というデモがありました。AIがより動的にUIを作れるようになれば、できるタスクの幅は広がりますし、きっと将来はそうなるのでしょう。

私自身かなり興味を持っているテーマだったので、進化の方向性についての考察はとても面白かったです。

すべてのinputに可視ラベルをつけたい

fortee.jp

テーブルのフィルターなどで設置するセレクトボックスにラベルはつけていますか？電話番号の入力欄それぞれにラベルはつけていますか？

1つのラベルに対して1つの入力欄を対応させる必要性は理解していたつもりでしたが、電話番号や郵便番号の入力欄が複数に分かれている場合の対処という、見落としがちな点を指摘されてハッとしました。

今回のカンファレンスではこれ以外にもWebアクセシビリティにまつわるトークが多く、改めてアクセシビリティの奥深さに気付かされました。

iPhone Eye Tracking機能から学ぶやさしいアクセシビリティ

fortee.jp

iOS 18で実装されたEye Trackingの紹介とともに、現時点での課題が具体的に取り上げられました。

スクロールや音量調整などのスライダーUIは現状では操作に工夫が必要で、視線誘導だけでの操作には限界があるというお話でした。現時点では専用のインターフェースを追加で実装する必要がありそうです。

むすびにかえて

地方開催ではありましたが、フロントエンド界隈で著名な方による登壇も多く、非常に充実したカンファレンスでした！

登壇者のみなさん、スタッフのみなさんありがとうございました！