0Pricing
Sveltejs Academy · レッスン

Universal loadとServer-only loadの違い

loadがクライアントとサーバーの両方で実行される場合と、サーバーだけで実行される場合を理解します。

「Universal loadとServer-only loadの違い」はCoddyKit上の無料Sveltejs Academyレッスンです。 これはレッスン1/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはSveltejs Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Sveltejs Academyコースには全4レッスンが含まれています。

2種類のloadファイル

SvelteKitは、+page.js(ユニバーサル)と+page.server.js(サーバー専用)の2種類をサポートしています。

ユニバーサルload

サーバー(初回SSR)とクライアント(以降のナビゲーション)の両方で実行されます。

サーバーload

常にサーバーで実行されます。コードとインポートはクライアントバンドルから除外されます。

サーバーを使う場面

データベースクエリ、秘密鍵、サーバー専用API、ファイルシステムへのアクセスに使用します。

ユニバーサルloadを使う場面

両方の環境で同じように動作する公開APIの呼び出しに使用します。

両方を同時に使う

両方のファイルを使用できます。まずサーバーloadが実行され、その結果をユニバーサルloadが利用できます。

型の推論

型は自動的に引き継がれます。ページでは結合されたデータ型が認識されます。

パフォーマンス

サーバーloadはAPIロジックをクライアントに公開せず、ユニバーサルloadはナビゲーション時のサーバー負荷を避けます。

セキュリティ

ユニバーサルloadに秘密情報を決して置かないでください。バンドラーによってクライアントバンドルにインライン化されます。

Form Actions

Form Actionsは、サーバーloadと同じく+page.server.jsに記述します。

環境変数

秘密情報を安全に保つため、$env/static/privateはサーバーファイル内でのみ使用します。

理解度チェック

データベースクエリはどこに記述しますか。

まとめ

サーバー専用ロジック(DB、秘密情報)には+page.server.jsを使用し、両側で実行するユニバーサルロジックには+page.jsを使用します。

よくある質問

「Universal loadとServer-only loadの違い」レッスンは無料ですか?

はい。「Universal loadとServer-only loadの違い」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、Sveltejs Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Sveltejs Academyコースには全4レッスンが含まれています。

「Universal loadとServer-only loadの違い」で何を学びますか?

loadがクライアントとサーバーの両方で実行される場合と、サーバーだけで実行される場合を理解します。 ブラウザで直接実行するハンズオンコードでSveltejs Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

Sveltejs Academyを始めるのに経験は必要ですか?

事前経験は必要ありません。CoddyKitのSveltejs Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン1/4です。

「Universal loadとServer-only loadの違い」レッスンにはどのくらい時間がかかりますか?

ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このSveltejs Academyレッスンでコードを書いて実行できますか?

はい。すべてのSveltejs Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

  1. Universal loadとServer-only loadの違い
  2. 静的ページのためのprerender = true
  3. クライアント専用ページのためのssr = false
  4. アイランドアーキテクチャ
← Sveltejs Academyに戻る