👌

フロントエンドカンファレンス東京2025 参加レポート

に公開

2025年9月21日にAbemaタワーで行われたフロントエンドカンファレンス東京に参加してきました!

会場到着

会場に到着するとconnpassでの受付を済ませ、スポンサー企業のグッズやパンフレット、ドリンクを受け取ってセッションルームに向かいます。グッズがかわちい

オープニング

did0es さんの挨拶からカンファレンスが始まりました。
会場案内(手洗い場、Wifiなど)や諸注意があり、最初のセッションを待ちます。

Bon Voyage! CSS Ecosystem Meets Standards, now?

最初に聞いたセッションはsakuさんのCSSのこれからと将来を考えるといったコンセプトの発表でした。
https://sakupi01.github.io/slides/ja/2025_09_21_css-ecosystem-meets-standards-now/

日本語縦書きWebの現在地

次にberlysiaさんの「日本語縦書きWebの現在地」という内容のセッションを聴きに行きました。berlysiaさんは今回のフロントエンドカンファレンス東京のCfP選考委員の一人でもあります。

https://speakerdeck.com/berlysia/japanese-vertical-writing-on-the-web-the-state-of-play-in-2025-a19f0026-9473-4863-b75d-35eae77c7e01

このセッションでは、縦書きに関しての歴史の変遷とこれからに関して説明してくださってます。

結論: 縦書きはできるし、ドキュメントも存在するよ!

縦書きはできるものの、エコシステムでの提供がないのでそこがネック。でも、モンゴル語みたいな縦書きしか内容な言語が存在することが追い風になって縦書きが進んでいくのではないか!といった内容のセッションでした。

ランチブレイク

ランチはお弁当とまい泉のとんかつサンドの提供がありました。

すっごい豪華ですよね!参加費無料のカンファレンスということを考えると、スポンサーの方に感謝だなと思いました。ランチのあまりがたくさんでたみたいで、まい泉のとんかつとお弁当を夜ようにたくさんいただいて帰りました、、、。感謝です!!

LLMとPlaywright/reg-suitを活用したjQueryリファクタリングの実際

次はkinocoboyさんのセッションでした。フロントエンドでの非常にレガシーなライブラリとして知られるjQueryのリファクタリングにLLMとreg-suitを用いて取り組んだ経験談をお話しいただきました。

https://speakerdeck.com/kinocoboy2/reg-suitwohuo-yong-sita-jqueryrihuakutaringunoshi-ji?slide=12

レガシーコードって悪なの?

レガシーコードって改修するのに工数かかるし、何かと悪と思われがちですが、本当にそうでしょうか?

  • モダンな開発を生み出してくれる
  • これまで多くの利益を生み出してくれたものでもある

ただ、レガシーコードの改善は楽ではありません。

  • ソースコードがモノリシックで肥大化している
  • 有識者が存在しない
  • IDEが持つ文明の利器が使えない、、、。
    • 定義に移動
    • 参照の検索
      • jQueryのセレクタは文字列として認識される

これまでの選択肢

  • 気合いと根性
  • モダンな技術への移行
    • いや、これができないから苦労してるんよ、、。

しかし、近年のLLMの発展から新たな選択肢を取ることができるようになりました。

LLMとVRTを駆使して対応することができる!

有識者がいないことで困っていた仕様がわからない問題は、LLMに聞くことで解析・翻訳してくれます。また、リファクタリングによって意図せず環境を壊してしまうことを避ける方法としてVRTを用いて解消することができます。

VRT(reg-suit): 画面の差分を検出してくれます。

  • Before : 修正前の画面のスクリーンショット
  • Action : コードのリファクタリングを行う
  • After : 修正後のスクリーンショットを撮影
  • Compare : 実際に比較

結果として

  • jQueryを使っているのに、ビックバンリリースが起こらなくなった
  • コストパフォーマンスがいい
  • 属人性の排除

LLMは読み取りのみに使うのがいいと思うけど、コードの変更の提案を受ける分には問題ない

このような発表でした。このLLM大時代にどのように活用していくかといったところを考えるセッションでした。reg-suitが画面の変更差分をどのように出しているかは気になりました笑

フロントエンドパフォーマンスチューニングでWeb技術を深掘り直す

次に聞いたのはShunsuke Manoさんのセッションです。新卒で株式会社リクルートに入社されたManoさんのリクルートが新卒研修で行っているフロントエンド版ISUCONを通した技術の深掘りに関しての内容の紹介でした。

https://speakerdeck.com/progfay/pahuomansutiyuningude-web-ji-shu-woshen-jue-rizhi-su?slide=43

フロントエンド開発に役立つクライアントプログラム共通のノウハウ

次に聞いたセッションはnrsさんのこちらのセッションです。本人も発表でコメディとして聞いてくださいといっていたように終始面白かったです。レガシーな技術を触れてきた経験からデータの受け渡しはこうあるべきだよねという話を面白おかしく聞くことができました。

https://speakerdeck.com/nrslib/universal-client-side-programming-best-practices-for-frontend-development?slide=214

Reduxモダナイズ コードのモダン化を通して、将来のライブラリ移行に備える

次のセッションはReduxから将来的な状態管理ライブラリ移行を見据えてReduxからRedux Tooltip への移行の経験談とこれからの取り組みへの見込みに関しての内容でした。

https://speakerdeck.com/pvcresin/reduxmodanaizu-kodonomodanhua-wotong-site-jiang-lai-noraiburariyi-xing-nibei-eru

TS - Type = JS ?

次はJxckさんのセッションでした。それまでルームAとルームBに分かれて進行が進められていましたが、このタイミングで会場転換が行われ、ルームAとルームBが統一されました。

セッションの内容も非常に面白いものでした。資料共有はないみたいなので、記憶の限り書き記したいと思います。

TypeScriptってプログラミング言語?

終始トピックはここに帰着します。

TypeScriptはコンパイルしてJavaScriptに変換するという役割を果たしていますよね。プログラミング言語って基本的にコンパイルを行って実行ファイルを生成していますが、TypeScriptはあくまで型チェックを行うという役割ですよね。これってTypeScriptはプログラミング言語と言えるの?

という問いから始まります。

さらに現在では、OXCなどLinterのツールが普及してきているけど、これって、パースするための速度をいかに早くするか見たいな観点で開発が進めれらてるよね?特に処理が早いRustを使って開発が盛んにされているよね。

最近ではTS_GOのようなアプローチも考えられてきている。

結局、Developer ExperienceをTypeScriptに求めているよね

そもそものプログラミング言語といった定義自体が違うんだろう🧐

セッションの視聴はここまで、、脳が疲れたので帰宅。

最後に

走り書きしちゃいましたが、こんな感じの内容でした!

ここまでのセッション続きで疲れたので帰宅しました。この規模のカンファレンスの一般参加は初めてだったのですが、非常に楽しく知見を吸収できました!運営のスタッフ、スポンサー企業のみなさまありがとうございました。

Discussion