What’s new in Svelte: 2021年7月

バグ修正、TypeScriptツール、および多数の新機能でクールに保つ

Dani Sandoval Jul 1 2021

北半球が暑くなる中、 Svelte はパフォーマンス向上やバグ修正、 TypeScript のサポート強化、エコシステム全体から多くの新しいコンポーネントやツールの追加などで涼しさを保ちました。ちょっと覗いてみましょう。 👀

New in SvelteKit

adapter-node gzip と brotli を使ってアセットを事前に圧縮するようになりました。 (#1693)
TypeScript トランスパイルのサポートが svelte-kit package ツールに追加されました。 (#1633)
adapter-node デフォルトのキャッシングを改善しました。 (#1416)
Rollup の出力オプションを設定可能に。 (#1572)
HMR での SSL の使い方を修正。 (#1517)

Features & bug fixes from around svelte/*

Svelte 3.38.3 (released June 22) には、ハイドレーションの最適化、バブリングイベントでの this の保存など、多くのパフォーマンス改善とバグ修正が含まれています。
最新の Svelte Language Tools のリリースでは、コンポーネント外部での prop 名変更サポート、 PostCSS の構文文法、 Svelte ファイルから型定義を作成するのに使用できる svelte2tsx の .d.ts 出力ターゲットが追加されました。
また、 Svelte Language Tools では、 TypeScript のサポートを強化するための待望の実験的機能が追加されました。 - コンポーネントのイベントやスロットに明示的に型を付与することや、ジェネリックを使用することなどです。詳細は the RFC をご覧いただき、お使いの方は this issue にフィードバックをお願いします。
svelte-scroller 2.0.7 では、 quality-of-life をいくつか修正しました。初期の幅に関するバグを修正し、index をより控えめに更新しました。

Coming soon to Svelte

マークアップにおける定数 - (RFC) ローカル定数を定義する新しい {@const ...} タグを追加しました (PR)

Community Showcase

Apps & Sites

SvelteThemes svelte, sveltekit, elderjs, routify などを使用して構築された Svelte テーマとテンプレートの厳選されたリストです。
Beatbump は、Svelte/SvelteKit を用いて作成された、 YouTube Music 代替のフロントエンドツールです。
Sveltuir はギターのフレットボードを覚えるのに役立つアプリです。

Educational Content

Svelte Radio: A Jolly Good Svelte Summer は、 Svelte の最新情報や Svelte Radio 1周年を祝うトークです。
Class properties in Svelte は、 React から Svelte に乗り換える開発者のために、 class の力を再確認します。
Sveltekit Tutorial for Beginners は、 WebJeda による SvelteKit を学ぶためのビデオプレイリストです。
How To Cache Dynamic Pages On Demand With A Service Worker In SvelteKit は、 SvelteKit でオンデマンドキャッシングに使用されるサービスワーカーの力を説明します。
Vue vs Svelte: Comparing Framework Internals は、 Vue と Svelte の違いを内側から深く掘り下げます。
Setting up a development environment for SvelteKit with Docker and Docker Compose は、どんなデバイスでコードを実行しても、再利用可能な開発環境を作るために Docker を使用する方法を説明します。
Scalable Scripts は今月、 Docker 化された Svelte アプリを AWS, Azure, Google Cloud にデプロイする方法を説明した3つのビデオを公開しました。
Render Katex with Svelte from zero to hero は、 Svelte プロジェクトに Katex を導入する方法を紹介します。
Using Custom Elements in Svelte では、 Svelte サイトで custom elements を使用する際に注意すべき点を紹介しています。

Libraries, Tools & Components

svelte-pipeline は、 Svelte Store として、 REPL や Editor などにカスタムの JavaScript コンテキストと Svelte Compiler を提供します。
Sveltotron はあなたの Svelte アプリを検査するために作られた Electron ベースのアプリです。
svelte-qr-reader-writer は、QRコードからのデータの読み取りと書き込みを支援する Svelte コンポーネントです。
svelte-stack-router Stacks との連携により、 Svelte アプリをよりネイティブに近づけることを目的としています。
svelte-typed-context では、 getContext や setContext に提供されると、より厳密な型が可能になるインターフェースを提供しています。
svelte-modals は、シンプルで柔軟性が高く、 zero-dependency のモーダルマネージャです。

コンポーネントを投稿したいですか？ Svelte を Web 上で存在感を高めることに興味がありますか？ コンポーネントを Svelte Society サイトに提出するには、 a PR to this file を作成してください。 SvelteKit で Svelte Society の書き直しに貢献したい場合は、 the list of open issues をチェックしてください。

See you next month!

もっと更新情報が欲しいですか？ Reddit or Discord に参加してください！