ep.173『Recap: Svelte Summit 2025 注目プレゼンを振り返る』 | UIT INSIDE

2025/06/03 に公開894 views

このエピソードについて

@TheoSteiner が @tomoam, @ssssotaro に、Svelte Summit 2025やSvelteコミュニティについて話を聞きました。

ゲスト

@tomoam
- Svelte Japanのコアメンバー
- 製造業向けシステムベンダーに勤務
- Svelte公式ドキュメント日本語翻訳の中心メンバー
@ssssotaro
- 株式会社ZOZO フロントエンドテックリード
- Svelte関連ライブラリ開発者
- 国内オフラインイベントで登壇経験多数

今回のトピック

Svelte Summit 2025 現地レポート

テオが現地参加したバルセロナ開催のSvelte Summitの雰囲気をレポート
海外コミュニティの熱気や、日本からのオンライン参加の体験

注目セッションの紹介＆議論

ViteとSvelteの協調と進化（パタック氏）
Svelteのテスト最新事情（ドミニク氏）
Ashley Furnitureの大規模Svelteマイグレーション事例（バート氏）
3Dライブラリ「threlte」とSvelteの宣言的3D]（グリーシャー氏）
「What Svelte Promises」非同期APIの最新動向（リッチ・ハリス氏

Svelte 5の新機能・進化

await blockやAsync API、Signalによるリアクティブ管理の進化
.remote.js/.remote.tsによるサーバーRPC、コア設計思想の変化
コミュニティ貢献や日本語ドキュメント翻訳活動の紹介

コミュニティ・貢献案内

Svelte日本語ドキュメント翻訳は誰でも参加OK。Discord案内は公式サイトから
日本コミュニティは1,000人規模。年1〜2回オフラインミートアップも開催
Svelte Summit動画の日本語字幕付き配信企画も進行中

関連リンク

ハッシュタグ

#UIT_INSIDE #Svelte #SvelteSummit

採用について

使用素材・クレジット

BGM&SE

音声書き起こし

1. オープニング/ゲスト自己紹介 00:00

@TheoSteiner 00:00
こんにちは UITのテオです。

@TheoSteiner 00:10
ユーザーインターフェースとテクノロジーを愛する開発者のためのウィークリーポッドキャスト UIT Inside、本週も始めたいと思います。

@TheoSteiner 00:19
今回はSvelte Summit 2025年をテーマに話していきます。

@TheoSteiner 00:24
トムアムさん、ソータさん、本日はよろしくお願いします。

@tomoam 00:28
よろしくお願いします。

@TheoSteiner 00:29
トムアムさんとソータさん。トムアムさんは確か3回目ですけど、多分初めて聞いてくれる方もいると思うので、軽く自己紹介していただけますか？

@tomoam 00:40
はい、トムアムと申します。Xのユーザー名が@tomoam_matという名前で活動しています。主にSvelte Japanのコミュニティで活動しております。仕事は製造業向けのシステムベンダーに勤めています。よろしくお願いします。

@TheoSteiner 00:54
よろしくお願いします。続いてソータさんも自己紹介お願いします。

ssssotaro 00:59
はい、ソータといいます。株式会社ZOZOでフロントエンドのテックリードとかをさせてもらってたり、Svelteのライブラリ開発や国内のオフラインイベントで話したりしています。よろしくお願いします。

@TheoSteiner 01:17
今日本当にお二方に来ていただいて光栄です。Svelteの日本のコミュニティですごく活発に活動している2人のメンバーなので、今日、先週あったSvelte Summitについて3人で話すのを楽しみにしています。

ssssotaro 01:33
とても楽しみです。

2. Svelte Summit 概要 01:35

@TheoSteiner 01:35
Svelte Summitって当たり前のように言ってたんですけど、そもそもSvelte Summitって何を指しているかをちょっと説明していただけますか？

@TheoSteiner 01:45
いろんなフロントエンドフレームワークでもカンファレンスをやってると思うんですけど、それのSvelte版ですね。Svelteの場合はちょっと変わっていて、Summitという名前で年に2回行われてきて、そのうち片方はオフラインで開催されています。今回はスペインのバルセロナで2日間にわたって開催されました。2年ぶりのオフラインサミットとのことで、とてもSvelteのコミュニティに物理的に会える貴重な機会でした。なんと僕は現地参加ができてとても楽しかったです。

@TheoSteiner 02:22
お二方はライブストリームで自宅から参加されてましたか？

@tomoam 02:27
そうです。

ssssotaro 02:28
はい、僕も同じくオンラインで参加しました。

@TheoSteiner 02:32
実際大変でしたか？後から確認できる方法になってたんですけど、確かトムアムさん、その場でつぶやいていたのを確認できました。

@tomoam 02:44
そう、Svelte JapanのSvelte Summitをつぶやくチャンネルで実況してましたね。時差は今回はバルセロナで7時間差だったのでそこまでつらくなかったです。日本で仕事終わってから夜12時くらいまでの時間帯で開催されていたので、前にニューヨークで開催された時は本当に反対の時間でつらかったんですが、今回は楽でした。

@TheoSteiner 03:12
2年前のワールドハイと同じ時差で見られるイベントでしたね。今日の内容ですが、最初にせっかく現地に行ってきたので現地のインプレッションをお伝えできればと思います。その後、お二方にもサミットのトークから2つずつ選んでいただいて、内容について議論できたらと思います。

@tomoam 03:45
現地の感想ですけど、一言で言うと「すごかった」です。素晴らしいコミュニティで、あまりSvelte関係ないんですけど一番印象に残っているのが、みんな背が高いということです。あとでも話しますが、バートさんという方、面白い発表で有名な方ですが、多分2m以上あって、僕も190cm以上あるんですけど久しぶりに見上げて話さないといけなかったです。リッチさんも映像だと伝わらないですが、とても背が高いですし、2m近くあるんじゃないかと思いました。

3. 現地の感想・印象 03:46

@TheoSteiner 04:30
映像で見てても、リッチさんのトークの時に3人くらいリッチさんのモノマネをする人が出てくる場面があって、それが面白かったですね。そのうちの1人がすごく背が高くて、日本から見てて「フロントエンドって背が高くないといけないのかな」と思ってしまいました。まあ、そんなことはないと思いますけど。リッチさんのモノマネがとても面白かったです。

@TheoSteiner 04:56
アメリカでちょっと流行っている長髪にヒゲという髪型とファッションも似ている方が同じイベントに3人いて、発表の前に1人ずつステージに登ってオーディエンスを沸かせていました。

@TheoSteiner 05:20
では、現地の印象はこれくらいにして、早速トークの内容に入りたいと思います。今回は2日間にわたって本当に数多くのトークがありましたが、お二方には2つずつ紹介してもらえたらと思います。では、先にソータさんから紹介をお願いします。

4. 発表について（ssssotaさん①） 05:31

ssssotaro 05:46
僕が印象に残った1つ目はパタックさんの「The Shared Story of Vite and Svelte」です。ViteとSvelteが協力して成長してきたよ、みたいな内容で、SvelteKitを触ったことがある人ならViteがすごく表に出てくる印象があると思います。実際にViteとSvelteKitが共に高め合ってきた話を、Viteの開発者の方が話してくれました。具体的にどういうアプローチをしたかや、今後APIがどうなっていくか、Svelteの作者であるリッチ・ハリス氏がRollupを作った話など、ViteとSvelteがお互いに高め合ってきたことを多角的に語ってくれました。

@TheoSteiner 06:46
SvelteKitがまだプレアルファの時は、最初はViteじゃなくてSnowpackを使ってたんですよね。でもViteがすごすぎてエコシステムが完全に統一されていく流れになり、今ではどのメタフレームワークでもViteを使っている、その最初がSvelteKitでした。

ssssotaro 07:14
なんだか懐かしい気持ちになりましたよね。

@TheoSteiner 07:16
そうです。絶対プロダクションで使ってはいけない時期に個人開発で使っていたのが懐かしいです。そのおかげでSvelteとViteのコミュニティが一体化して、コアチームもかなり近い関係になっています。ちょうどこの後、トムアムさんが紹介してくれるドミニクさんもSvelteとVite両方のコアチームに入っています。2つのオープンソースコミュニティのつながりが深くて素晴らしいですね。

@tomoam 07:58
その流れで、私がとても良かったと思う発表の一つ目が、今話に出たSvelteコアチームのドミニクさんの「Testing 1234」です。BeatプラグインSvelteやSvelteKitの裏側の仕組み、Svelte Inspectorなど、開発を支えるツールを作っている方です。発表内容はSvelteでテストを行う方法を細やかに説明してくれていて、例えばユニットテストならVite Testでプロジェクトに追加するコマンドや、サーバーサイド・クライアントサイド両方のテスト方法、SvelteモジュールにRoonが入ってからのテスト方法、E2EテストにはPlaywrightを使う話など、実用的な内容でした。

5. 発表について（tomoamさん①） 07:59

@tomoam 09:24
発表動画は今見られませんが、発表で使われたコードやスライドはGitHubで公開されています。注意点として、メインブランチにはテストコードはなく、別ブランチにセットアップやユニットテストのコードがあるので、そちらをチェックしてください。

@TheoSteiner 10:05
僕もこのテストの発表がすごく気に入っていて、毎日の仕事で一番すぐ使えそうな内容でした。発表を見ながら「これを自分のプロジェクトに落とし込んでテスト実装したいな」と思っていました。ちょうど携帯で見てたのでその場で手を動かせなかったですが、パソコンで見てたらきっとやってましたね。

6. Theo氏の発表について 10:44

@TheoSteiner 10:53
実は僕も今回、現地で発表してきました。人生初のカンファレンス登壇で、本当に緊張しました。タイトルは「SvelteでWebコンポーネントを作る、売れてイメージドガイド」という名前にしました。内容としては、SvelteでWebコンポーネントを作るのは意外と簡単なんですが、実際にプロジェクトで使うとなるとビルドパイプラインなどが複雑になるので、そのプロセスを簡単にするライブラリを作ったという話です。

@TheoSteiner 12:29
発表の中では、リッチさんの前で「Webコンポーネントはいいぞ」と言い切ったのがかっこよかったと自分でも思います。スライドではリッチさんを少しネタにしたりもしましたが、会場はとても盛り上がっていました。

@TheoSteiner 13:53
ちなみに僕の発表中に2回も会場の電源が落ちるという出来事があり、とてもビビりましたが、なんとかエンターテイナーっぽく振る舞いました。もし1ヶ月後くらいにYouTubeに動画が上がったら、ぜひ僕の顔がビビってるかどうか確認してください。

@TheoSteiner 15:04
SvelteでWebコンポーネントを作っているプロダクトやチームはまだ少ないと思うので、今回作ったライブラリを使ってもっと簡単にSvelteでWebコンポーネントを作れるようにしたいと思っています。ライブラリ名は「swebコンポーネント」で、GitHubで検索すれば出てくるはずです。

ssssotaro 17:07
僕もリポジトリを見てみたんですが、すでにテンプレートが作られていて、そこからすぐに作業を始められそうでした。キットのテンプレートをクローンして、コードだけをローンできる仕組みにしてあるのがいいですね。

@TheoSteiner 17:57
今朝、Svelteコアチームのサイモンソンさんから「いつかその機能をSvelteのコアに入れてコンポーネント作成をもっと簡単にしたい」という話も出ていて、とても楽しみです。まずはライブラリとしてバグを潰して、いつかコアに移せたらと思っています。

7. 発表について（ssssotaさん②） 18:33

@TheoSteiner 18:33
では次の発表紹介に進みます。続いてはソータさん、何の発表でしたか？

ssssotaro 18:44
バートさんの「How to Win with Svelte」という発表です。世界で2番目に大きい家具サイト「Ashley Furniture」をSvelteでマイグレートしたという話で、もともと表示が遅くアクセシビリティにも課題があったのを、どうやってSvelteで置き換えていったかという壮大なストーリーでした。大規模な会社ならではの人の問題もありつつ、Webコンポーネントやユニットテストの導入、段階的なリプレイスなど具体的な話が聞けました。3年かかったそうですが、KPIも上がり、アクセシビリティも改善され、読み込みも速くなり、Svelteの良さが伝わる発表でした。

@TheoSteiner 21:33
本当に大規模にやりきった素晴らしい事例ですよね。発表の仕方も個性的で面白かったです。Svelteのロゴが全身に書かれた服にサングラスで会場を走り回るなど、スタイルもMemeが多く使われていて見ていて楽しい発表でした。

@TheoSteiner 22:04
ちなみにバートさんは身長2m10cmくらいあるので、迫力がすごかったです。テイラーメイドのSvelteロゴ入りアロハシャツも印象的でした。

@TheoSteiner 22:39
Ashley Furnitureの規模は1日60万アクセスもあるらしく、IKEA.comもSvelteで書かれているなど、なぜか家具サイトとSvelteの相性が良いみたいです。発表中に回っていた3DのSvelteロゴが印象的で、「どうやって実装したんだろう」と思いましたが、次にトムアムさんが紹介してくれる発表でそのヒントが得られると思います。

8. 発表について（tomoamさん②） 23:41

@tomoam 23:44
私が2つ目に紹介するのは「Create an immersive product configurator with Svelte」という発表です。THRELTという3Dライブラリの作者の方で、3JSをSvelteで宣言的に使えるようにしたものです。Web上の3Dの歴史や、手続き的な3JSのコードをSvelteの構文で宣言的に書けるようになる比較などがあり、とても素晴らしかったです。CLIツールで3Dファイルを読み込んでWebで使えるコードを出力し、バイクの3DデモでSvelteのステートやリアクティビティが3Dに反映される様子を見せてくれました。3D未経験の私でもやってみたいと思える発表でした。

ssssotaro 25:48
僕はGLSL（シェーダー）は少し触ったことがあるんですが、それ以上は手続き的で大変で、現実的じゃないと思っていました。でもTHRELTを見て「何でもできる気がする」と感じ、手を動かしたくなる発表でした。

@TheoSteiner 26:13
発表は20分ほどでしたが、その間にプロダクトの紹介ページをどんどん作っていく様子も素晴らしかったです。Webサイトはsvelte.xy.comなので、興味がある方はぜひ見てみてください。

@TheoSteiner 26:43
では最後、僕が紹介するセッションは、Svelte Summit恒例のリッチ・ハリスさんの発表「What Svelte Promises」です。JavaScriptのPromise APIにかけてあるタイトルで、Svelteで非同期処理をどう扱うかという内容でした。今まではawait blockくらいしかなくて、Async APIの導入でよりスッキリ書けるようになるそうです。トップレベルawaitや複数Promiseのオーケストレーションなど、パワフルなAPIになる印象でした。

9. リッチ・ハリス氏の発表について 26:44

ssssotaro 29:09
await block本当に便利なんですよ。これがあるからSvelteを使っているまであるくらいですが、Async APIでさらに便利になるのは衝撃でした。

@TheoSteiner 29:32
発表自体はかなり複雑な部分もありましたが、Svelte 5ではシグナルによるリアクティブなステート管理や、依存関係グラフの自動構築、非同期処理のオーケストレーションなど、今後の進化がとても楽しみです。

@TheoSteiner 33:13
また、リッチさんの発表ではRPCの話も出てきて、.remote.js/.remote.tsファイルの導入でサーバー関数をクライアントから透過的に使える仕組みが検討されています。Rollupを開発したリッチさんがバンドラーやコロケーションをあまり信用していない話も面白かったです。安全性を担保しつつ開発体験を良くする設計思想が伝わってきました。

10. 最後の質問に答える時間について 34:20

@TheoSteiner 34:36
発表の後にはメンテナーの方々が集まって参加者の質問に答えるQ&Aもあり、使ってくれることやIssueを上げることも立派な貢献だと伝えてくれたのが印象的でした。

@TheoSteiner 35:26
また、トムアムさんが中心となってSvelte公式ドキュメントの日本語翻訳にも多くの方が貢献していて、もし興味があればぜひ日本語ドキュメントのコントリビュートもお願いします。Discordの案内は公式サイトから辿れますし、日本のSvelteコミュニティも1,000人近くに成長しています。年1〜2回オフラインミートアップも開催しています。

@TheoSteiner 37:17
今回のSvelte Summitを開催したケビンさんから「日本のミートアップで発表動画に日本語字幕をつけて配信してくれないか」と声をかけていただいたので、今後その企画も進めていく予定です。興味がある方はDiscordのKoryuチャンネルをチェックしてください。

11. エンディング 37:54

@TheoSteiner 37:56
というわけで今回はSvelte Summitについて話してきました。LINEのフロントエンド開発組織UITではこのようなフロントエンドに関する議論やキャッチアップを日々行っております。過去のエピソードでは社内の学習企画から始まったコンテンツも多くありますので、今後も発信していければと思います。今回はSvelte SummitとSvelteコミュニティについて話してきました。トムアムさん、ソータさん、ありがとうございました。

@tomoam 38:26
ありがとうございました。

ssssotaro 38:27
ありがとうございました。