JavaScriptのUIフレームワーク「Svelte 4」正式リリース。パッケージサイズが10MBから3MBへ大幅縮小、ハイドレーションコードも高速に

今回は「JavaScriptのUIフレームワーク「Svelte 4」正式リリース。パッケージサイズが10MBから3MBへ大幅縮小、ハイドレーションコードも高速に」についてご紹介します。

関連ワード (実現、実行時、縮小等) についても参考にしながら、ぜひ本記事について議論していってくださいね。

本記事は、Publickey様で掲載されている内容を参考にしておりますので、より詳しく内容を知りたい方は、ページ下の元記事リンクより参照ください。


JavaScriptのUIフレームワーク「Svelte」の最新版となる「Svelte 4」が正式にリリースされました。

https://t.co/9qz0sDglCe

— Svelte 4 Ever (@SvelteSociety) June 22, 2023

Svelteは読みやすく簡潔なコードでWebアプリケーションのユーザーインターフェイスを構成できるフレームワークです。Stack Overflowの調査では開発者の人気が急速に高まっていることでも注目されています。

Svelteの最大の特徴はコンパイラであるということです。UIフレームワークは、なんらかのライブラリをアプリケーションに同梱することが一般的ですが、Svelteではコードをコンパイルして、いわゆるバニラJavaScriptを生成する仕組みです。

仮想DOMを使わず、コンパイル時に状態が変化する箇所を特定し、その変更のためのJavaScriptを生成することで実行時の高速な状態変更を実現することも特徴とされています。

このSvelteを基に、ルーティングやサーバーサイドレンダリング、ビルドツールなどを加えてフルスタックなアプリケーションフレームワークとしたのが、昨年(2022年)12月にリリースされた「SveltKit」です。

参考:Webアプリケーションフレームワーク「SvelteKit 1.0」正式リリース。SSR/SSG/SPAなど対応

ちなみに、Svelte/SvelteKitの作者であるRich Harris氏は現在、Next.jsの開発元として知られるVercelの社員となっています。

Sveltパッケージが10MBから3MBにまで縮小

Svelt 4は2019年にリリースされたSvelt 3以来、4年ぶりのメジャーバージョンアップとなります。

ただし今回はSvelt 5のリリースに向けた前段階としてのメンテナンスリリースだと説明されており、大きな機能追加や変更はありません。下記は「Announcing Svelte 4」からの引用です。

Svelte 4 is mainly a maintenance release, bumping minimum version requirements and tightening up the design in specific areas. It sets the stage for the next generation of Svelte to be released as Svelte 5 – we think you’ll love it.

Svelte 4は主にメンテナンスリリースであり、要件としての最小バージョンの引き上げと特定の領域で設計を強化しました。これはSvelteの次世代としてリリースされるSvelte 5(きっと気に入ってもらえると思いますが)の準備段階としてのリリースです。

Svelt 4では、Sveltのパッケージ自身が非常に小さくなりました。具体的には、10.6MBだったものが2.8 MBにまで縮小したとのことです。

さらにこの2.8MBのうち多くの部分を構文チェックなどを行うESLintが占めており、現在ESLintはCommonJSベースからES Moduleベースへと全面的に書き換えられているところなので、この書き換え後のESLintが採用されれば、Sveltのパッケージはさらに約半分になるとのことです。

ただし前述の通り、Svelteはライブラリではなくコンパイラなので、Svelteのパッケージが小さくなることはアプリケーションのバンドルサイズが小さくなるのではなく、ビルド時などにSvelteをロードしてコンパイルを実行する際の時間が短くなる、という効果になります。

また、Webアプリケーションのイベントに紐付けられるコード(Hydration Code)もより小さく高速になっているとのことです。

このタイミングで「svelte.dev」の公式ドキュメントも刷新され、より読みやすいレイアウトになりました。Svelte 3からSvelt 4へのマイグレーションガイドも公開されています。

COMMENTS


Recommended

TITLE
CATEGORY
DATE
大量のデータを必要とするAIを効率よく運用するには
IT関連
2024-07-05 03:54
ソニー「IMX500」採用、動線分析のリアルタイム処理も可能なエッジAIカメラ「S+ Camera Basic」高機能版登場
IoT
2021-06-24 05:06
レノボ、エッジ専用端末「ThinkEdge SE70」を発表–高まるエッジAI需要で製品拡充
IT関連
2022-06-29 05:08
AIがルートを決める「呼出型最適経路バス」、高萩市で実証運行
くらテク
2021-06-29 10:59
7割が「ハイブリッドワークでスキルが向上した」と回答–コンカー社内調査
IT関連
2022-06-02 20:29
自分の声が500円でAIボイスに? 音声読み上げソフト「CoeFont CLOUD」の品質を動画でチェック (1/2 ページ)
くわしく
2021-07-21 23:45
イオンネクスト、AIを活用したオンラインマーケットを開始–買い物をラクに楽しく
IT関連
2023-04-06 06:52
3年以上影響すると見られるテクノロジービジネスのトレンド
IT関連
2023-02-04 19:47
ヤフー、「ワクチンパスポート」の特設ページ開設 「Yahoo!検索」からの誘導も
ネットトピック
2021-07-14 12:22
セキュリティに積極的な企業は業績などが良い–アクセンチュア調査
IT関連
2023-08-04 04:07
NTTデータ、地銀共同利用の勘定系システムを国産クラウド化–2028年稼働へ
IT関連
2024-02-10 20:12
AIを活用して経理業務の自動化を進めるSMBCグループの「人の生かし方」とは
IT関連
2025-02-21 20:10
緊急事態延長–テレワークによる労務管理上の課題解消を急げ
IT関連
2021-02-04 09:20
AWS、DWHサービスのサーバーレス版「Redshift Serverless」を提供開始
IT関連
2022-07-15 23:57