BT

最新技術を追い求めるデベロッパのための情報コミュニティ

寄稿

Topics

地域を選ぶ

InfoQ ホームページ ニュース 次のSvelteはサーバレスファーストかもしれません - Svelte SummitでのRich Harris氏の講演

次のSvelteはサーバレスファーストかもしれません - Svelte SummitでのRich Harris氏の講演

原文(投稿日:2020/10/28)へのリンク

Svelteの作成者であるRich Harris氏は、Svelte (UIフレームワークとコンパイラ) とSapper (Svelteのアプリケーションフレームワーク) のまわりで行われている実験の幕を開けた。Harris氏は、Svelteがサーバレスファーストフレームワークであるという潜在的な未来を垣間見せた。

講演で示される内容の実験的な性質について聴衆に警告する一方で、Harris氏はそれにもかかわらず、その動機を熱心に詳しく述べた:

おそらくSvelte 3のローンチ以来、そして次の15分間ほど、Svelteにこれほど興奮したことはありません。その理由を説明します。[…]

私がお見せするのは […] Svelteチームからの公式発表ではありません [チームはそれを認識してサポートしていますが]。起こるであろう保証 [または] 物事が起こるであろう時の保証は [ありません]。[…]

それはより広くWeb開発の未来についてであり、私が試みたい、主流に押し上げるのを手伝いたい、いくつかのアイデアがあります。

Harris氏は、予想されていたSapper 1.0はおそらく出てこないだろうと発表した。代わりに、Svelteの新しいイテレーションがそれを置き換える可能性がある。次に、Harris氏は、実験中のSvelteバージョンであるsvelte@nextのデモを行った。以降、これをSvelte Nextと呼ぶ。Sapper (およびNext.js) と同様に、Svelte Nextはファイルベースのルーティングを採用している。Harris氏は、デモされたアプリケーションのルートを実装するコンポーネントをsrc/routesディレクトリに作成した。index.svelteファイルはホームページを実装し、about/index.svelte/aboutルートを実装する。レイアウトコンポーネント ($layout.svelte) は、ページの一般的に発生する部分 (ヘッダやフッタなど) を実装し、ページの実装をDRYに保つことができる。

レイアウトコンポーネントは、スロットコンポジションを使用して、次のようにページコンテンツを配布できる:

<script>
  import Nav from '$components/Nav.svelte';
</script>

<main>
  <Nav/>
  <slot></slot>
</main>

<style>
 :root {
   font-family: -apple-system;
 }

 main {
   text-align:center;
   padding: 1em;
   margin: 0 auto;
 }
</style>

Svelteは通常どおり、一部のスタイルが使用されていない場合、開発者に自動的に警告する。Sapperの場合と同様に、ユーザがアクセスするアプリケーションの最初のルートはサーバでレンダリングされる。次に、クライアント側のルータが引き継ぐ。

Harris氏は、開発で即座にリロードするために、Svelte NextはSnowpackに依存していると説明した。Snowpackは、最新のESM Modulesを活用してコードベースを一定時間で再構築するWasmを利用したフロントエンドビルドツールである。プロダクションのビルドの場合、Svelteは引き続きRollupを使用する。Harris氏はさらに、Svelte NextのSnowpackを使用したホットモジュールのリロードにより、リロード後もアプリケーションの状態が損なわれないことをデモした !

開発者の経験により得た結果、Harris氏は、最新のビルドツールがまもなく開発ツールの大部分を占めるようになると考えた。Harris氏は言った:

開発中にバンドラを使用するプロジェクトが少し時代遅れに見えるようになるのは、もうすぐだと思います。

次にHarris氏は、静的レンダリングとサーバサイドレンダリングを組み合わせるSvelte Nextの機能をデモした。Harris氏は説明した:

この新しいシステムでは、Next[.js]の最近のバージョンと同様に、動的にレンダリングされるページと事前にレンダリングされるページを組み合わせることができるハイブリッドアプリを作成できます。

さらに、svelte.config.jsを使用すると、開発者はNode (サーバ側レンダリング) 、静的レンダリング、またはクラウドベースのサービス (Netlifyなど) 用のアダプタを構成できる。

Harris氏は結論づけた:

サーバレス全体はかなり良いトレンドであり、Svelteはサーバレスファーストのフレームワークになりました。

読者には、技術的な説明の詳細とデモが多く含まれている完全なトークを確認することをお勧めする。svelte@nextは現在公開されていない。

Svelte Summitは、Svelteに関するバーチャルカンファレンスである。2020年は10月にオンラインで開催された。講演の完全なリストは、Svelte SocietyのYoutubeチャンネルで入手できる。

この記事に星をつける

おすすめ度
スタイル

BT