本文へスキップ

Svelte 7月2024年版 新機能

svelte/events、よりシンプルな要素とより多くのオプション

Dani Sandoval

今月、Svelte 5 リリース候補版に多くの新機能が追加されました。Rich Harris はPrismicのCEOへの説明の中で、Svelteがどのように「雰囲気」を最適化するかを説明し、Geoff RichはCascadiaJS 2024でこの哲学についてさらに詳しく説明しました。

早速見ていきましょう！

Svelteの新機能

以下は、Svelte 5リリースノート（現在はリリース候補版）のハイライトです。

  • runeモードで、`let props = $props()` を使用して、より簡潔にプロパティを宣言できるようになりました (**5.0.0-next.167**、#12201)
  • `svelte/events`からの新しい`on`インポートを使用すると、より多くの状況でイベントハンドラの呼び出し順序を維持できます (**5.0.0-next.152**、ドキュメント、#11912)
  • `Component`型は、Svelteコンポーネントの新しい形状を表すようになりました (**5.0.0-next.143**、#11775)
  • `<svelte:document>`に新しい`activeElement`と`pointerLockElement`バインディングが追加されました (**5.0.0-next.150**、#11879)
  • `<svelte:element>`、CSSカスタムプロパティラッパー、文字列正規化がすべて簡素化され、パフォーマンスが向上しました (**5.0.0-next.152**、#11773、#11948、#11954、#11792、#11949)
  • プロパティが不要な場合、`render`、`mount`、`hydrate`オプションは実際にオプションになりました (**5.0.0-next.163**、ドキュメント、#12111)

SvelteKitの新機能

今月、NodeおよびCloudflareアダプターがいくつかのアップグレードを受けました。

  • `BODY_SIZE_LIMIT`環境変数がアダプターノードに単位サフィックスサポートを追加しました。これにより、大きなバイト値をより簡単に記述および理解できます (**adapter-node@5.2.0**、ドキュメント、#11680)
  • Nodeサーバーは、HTTPサーバーがすべての接続を閉じたのちに送信される`sveltekit:shutdown`イベント（より急な`exit`に取って代わる）をリッスンできるようになりました (**adapter-node@5.1.0**、ドキュメント、#12153)
  • Cloudflareアダプターは、`_routes.json`ファイルが存在するが、svelte.configに構成されたルートがない場合にのみ`_routes.json`エラーをスローするようになりました (**adapter-cloudflare@4.5.0**、#12360)

コミュニティショーケース

Svelteで構築されたアプリとサイト

  • Shootmailは、メールテンプレートとコンテンツ作成ツールです。
  • wplatestは、複数のウェブサイトにわたるWordPressプラグインの更新を自動化します。
  • Svelte-MiniAppsは、SvelteKitで構築された、一口サイズの使いやすいツールの集まりです。
  • Interior Render AIは、数秒であなたのインテリアをAIで再設計します。

学習リソース

Svelteコントリビューターとアンバサダーを紹介します。

読む

見る

ライブラリ、ツール、コンポーネント

  • svelte5-commenterは、一般的なコメントセクションのコンポーネントデモです。
  • SSC (Speedy Svelte Compiler) は、Rustで記述された超高速なSvelteコンパイラです。

今月は以上です！何か見逃したことがあれば、RedditまたはDiscordでお知らせください。

来月まで👋