Movatterモバイル変換


[0]ホーム

URL:


コンテンツにスキップ
Wikipedia
検索

Qwik

出典: フリー百科事典『ウィキペディア(Wikipedia)』
Qwik
開発元Builder.io
リポジトリhttps://github.com/QwikDev/qwik
プログラミング
言語
TypeScript,Rust
ライセンスMIT License
公式サイトhttps://qwik.dev
テンプレートを表示

Qwik は、JavaScript/TypeScript 向けのWebアプリケーションフレームワークである。[1] SSR 及びブラウザ上での実行におけるパフォーマンスに重点を置いている。[1][2]

概要

[編集]

Next.jsNuxtJS などのフレームワークでは、SSR を行い、それをクライアントで動かすためにハイドレーションを行う。[3][4] ハイドレーションには一定のコストが存在し、それはコードが多くになるにつれて大きくなるという課題が存在する。[5]

それに対して Qwik は、Resumable という手段を提供する。Resumable は、ハイドレーションを行わない。Resumable では、ページのロード時に小さな JavaScript コードのみをダウンロードすることで、コードの量によらず JavaScript のロード時間は変わらない。Qwik では、ビルド時にコンポーネントや関数をチャンク分割そ、[6]ユーザーのインタラクションがあるなど必要なときのみ最小限のチャンクをダウンロードし、実行する。[7]

例えば、以下のコードにおいて、component$ という単位でコンポーネントが非同期にチャンク分割される。[1]

constComponent=component$(()=>{return<div>HelloWorld!</div>})

Qwik City

[編集]

Qwik City とは、Qwik におけるメタフレームワークである。[6] 通常の Qwik プロジェクトにおいては、Qwik City を使用する。[8]

Qwik City は、ファイルベースルーティングを提供する。[9] また、Service Worker を用いてチャンクをキャッシュすることにより、チャンクを高速に読み込むことができる。[7]

参考文献

[編集]
  1. ^abcqwikをざっくり調べてみた”. Zenn. 2024年10月19日閲覧。
  2. ^Qwikとは何か?特徴と使い始める方法を解説 | 株式会社一創”. www.issoh.co.jp (2024年10月15日). 2024年10月19日閲覧。
  3. ^NextjsのHydrationって何?|DonTacos”. note(ノート) (2023年2月15日). 2024年10月19日閲覧。
  4. ^Nuxt3における hydrationとは?”. Qiita (2023年8月15日). 2024年10月19日閲覧。
  5. ^Qwik調べてみたら結構面白かった”. Zenn (2022年9月28日). 2024年10月19日閲覧。
  6. ^abQwik City で作るブログアプリ”. Zenn. 2024年10月19日閲覧。
  7. ^abQwikの基本概念である Resumable を理解する”. Zenn. 2024年10月19日閲覧。
  8. ^Qwik(City)を試してみた感想 | Memory ice cubes”. leaysgur.github.io (2023年1月23日). 2024年10月19日閲覧。
  9. ^NewtとQwik Cityを利用してブログを作成する”. コンテンツ管理の新しいスタンダード | ヘッドレスCMS「Newt」 (2024年1月18日). 2024年10月19日閲覧。
概念
エンジン
コンパイラ
デバッガ
エディタ
サーバーサイド
フレームワーク
ライブラリ
ユニットテスト
Docジェネレータ
コード解析
パッケージ管理
アプリケーション
バンドラー
関連技術
人物
ASP.NET
C++
Groovy
ColdFushion
Common Lisp
Haskell
Java
JavaScript
Perl
PHP
Python
Ruby
Rust
Scala
Smalltalk
その他
開発終了
カテゴリカテゴリ
https://ja.wikipedia.org/w/index.php?title=Qwik&oldid=108229940」から取得
カテゴリ:

[8]ページ先頭

©2009-2026 Movatter.jp