SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

高速・軽量なJavaScriptフレームワーク「Svelte」の世界

高速で開発者体験も抜群!JavaScriptフレームワークの新星「Svelte」とは何か?

高速・軽量なJavaScriptフレームワーク「Svelte」の世界 第1回

  • X ポスト
  • このエントリーをはてなブックマークに追加

2022年にSvelteを使うべき理由

 記事の前半では、Svelteの特徴をReactやVueと比較して紹介しました。ここからの後半では、Svelte自体から少し離れた目線で、Svelteを取り巻く環境やエコシステムについて紹介したいと思います。

State of JS 2020でカテゴリトップ

 読者の皆さまの多くもご存知のように、JavaScriptやその周辺のフレームワークや開発ツールは、変化が非常に激しいことで有名です。同じことをするにも複数の選択肢があることは良いことですが、一方で、新たに学ぼうとする方にとっては、どのライブラリや開発ツールを使うべきか迷ってしまいがちなのも事実です。

 そこで、そんなたくさんのライブラリや開発ツールの中でも、どれが開発者により支持されているのか、どれを使ったプロジェクトが増えているのかなどを、毎年世界的に大規模に調査するサーベイとして「State of JavaScript」というコミュニティ主導のプロジェクトがあります。

State of JS 2020 / フロントエンドフレームワーク / 満足度(出典:State of JS 2020)
State of JS 2020 / フロントエンドフレームワーク / 満足度(出典:State of JS 2020

 「フロントエンドフレームワーク」のカテゴリでは長年Reactかトップに君臨してきました。2020年の調査でも「利用度」「認知度」の項目では相変わらずReactに軍配が上がる中で、「興味」「満足度」の項目ではSvelteが首位となりました。

メイン開発者がメディア企業からVercelに移籍し、フルタイムでのプロジェクト推進へ

 開発者のRichard Harris氏はこれまでNew York Timesに勤務し、本業の傍でSvelteを開発していました。パンデミックの影響もあり社会的責務が強まるNew York Timesでの多忙な本業と両立し、また本業の中でもSvelteの活躍の場を作ってきたことは、OSS開発者として素晴らしいことです。

 一方で、大資本がチームとして開発を進めるReactや、フルタイムの開発者が率いるVueとの比較では、長期的な視点からやや懸念として認識されることもありました。

 そんな中、11月、Harris氏がサーバレスPaaSを提供するVercelに転職し、同社内においてフルタイムでSvelteの開発に携わっていくことを発表しました。直近ではSvelteのエッジ関数への最適化をはじめ、マルチページアプリケーションとSPAの良いとこ取りをした"Transitional App"の推進に取り組んでいると述べ、期待が高まります。

周辺エコシステムの充実:VercelでのSvelte Kitのサポート等

 Harris氏が移籍したVercelは、JavaScript向けのアプリケーションのホスティングサービスを提供する企業ですが、React向けのアプリケーションフレームワークであるNextの開発元としても有名です。

 Nextに限らずVueやAngularなど、いわば競合のフレームワークもサポートしていますが、Svelteのサポートは、これまで限定的でした。

 具体的には、Svelteそのものはサポートされているものの、メタフレームワークであるSvelte Kitは、細かく設定すれば使えるものの、公式にはサポートされていな状態でした。

 そんな中、Harris氏の移籍に先立つ今年の7月、VercelはSvelte Kitの公式サポートを発表し、GitHubリポジトリを連携するだけでほとんど設定なし(Zero config)でデプロイできるようになりました。

VercelでのSvelte Kitの公式サポートを発表したブログ
VercelでのSvelte Kitの公式サポートを発表したブログ

 Vercelでは細かな設定をしてデプロイする場合には有料プランでもメモリ上限を変更することができないなど、いくつかの公開されていない制限があったのですが、Svelte Kitで書かれたアプリでもこの制限を受けずにホストすることができるようになりました。

 これによって手軽にアプリケーションを公開する選択肢が格段に広がり、また今後は開発者のHarris氏が在籍していることもあって、安心して採用できるホスティング環境になったと言えます。

Svelte Summitの盛り上がり

12月1日に開催されたSvelte Summit Mini Edition: Stockholmの様子(出典:YouTube)
12月1日に開催されたSvelte Summit Mini Edition: Stockholmの様子(出典:YouTube

 Svelteのコミュニティ活動を推進するSvelte Societyというグループがあります。これまでボランティアベースで活動してきたグループですが、つい先日、メンバーのKevin氏がテクニカル・コミュニティ・ビルダーに就任し、フルタイムでコミュニティ活動の支援を推進していくことが発表されました。

 そんなSvelte Societyは昨年から、Svelte Summitというイベントを開催しています。今年は春と秋の2度開催され、11月に開催されたSvelte Summit 2021 Fallでは、次のようなテーマの発表が行われました。

  • 「Svelteが初心者にも経験者にもおすすめのフレームワークである理由」
  • 「ReactからSvelteへ」
  • 「Svelteのトランジションとアクセシビリティ」
  • 「レガシープロジェクトにSvelteを組み込む方法」

 今回のSvelte Summitは少し特殊な開催形式で、まだ終了していません。世界各地で継続的にローカルイベントを開催し、そこでさらに発表を続けていくそうです。

 12月1日にはSvelte Summit Mini Stockholm、14日には同Londonが開催され、その後も数カ所で開催されるそうです。筆者もそのうちのいずれかに登壇し、「Svelteで開発するWeb Componentsライブラリ」というテーマで登壇することとなっています。

おわりに

 ここまでお読みくださりありがとうございました。

 今回の記事では、ReactやVueを少し触ったことがある方を想定して、それらと比較する形で、Svelteの特徴を説明してきました。また、後半ではSvelteを取り巻くエコシステムやコミュニティに関しても紹介させていただきました。

 コミュニティの交流はDiscordで行われてきます。ぜひSvelte日本Discordにお越しください。筆者も参加していますので、お気軽にお声がけください。

 第2回・第3回では、実際にSvelteを使用してアプリケーションを開発する手順を説明します。Svelteによるアプリケーション開発の流れを一通り理解・体験していただける内容となる予定ですので、Svelteに興味を持たれた方は、ぜひお読みいください。

 最後に、草稿をレビューしてくれた小関さん、SvelteコミュニティのTheoさんに、この場を借りて感謝を申し上げます。

参考

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
高速・軽量なJavaScriptフレームワーク「Svelte」の世界連載記事一覧
この記事の著者

濱口 恭平(ハマグチ キョウヘイ)

 1990年・三重県生まれ。ドイツに拠点を置く Web3 / Privacy Tech スタートアップ でCTO/VPoEを務める傍ら、サイドプロジェクトとして「誰でも使えるビデオ通話SDK 」"kommu" を開発している。 多くの人に快適な開発者体験を提供できるフロントエンド技術を探求する中で Svelte に出会い、開発者コミュニティでの交流をきっかけに2021年には公式イベントSvelte Summit での登壇を経験。 2022年からは国内...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/15394 2021/12/28 11:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング