Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

クライアントサイドでのハイドレーション の文章表現を修正 #639

Open
wants to merge 1 commit into
base: lang-ja
Choose a base branch
from
Open

クライアントサイドでのハイドレーション の文章表現を修正 #639

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/guide/ssr/hydration.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ Vue は、クライアントサイドのコード（ここでは `entry-client.j

Vue はクライアントサイドで生成された仮想 DOM ツリーがサーバからレンダリングされた DOM 構造と一致するかを検証します。不一致がある場合、ハイドレーションを中止し、既存の DOM を破棄して、最初からレンダリングします。ブラウザのコンソールには警告が表示されますが、サイトは引き続き動作します。

SSR が動作していることを確かめる一番の重要な方法は、アプリケーションの状態がクライアントとサーバで同じであるか確認することです。特にブラウザ（ウィンドウ幅、デバイスの機能、localStorage など）やサーバ（Node 組み込みのような）に固有の API に依存しないように注意して、また同じコードが異なる場所で実行すると異なる結果が得られるように注意してください（タイムゾーン、タイムスタンプの利用や、 URL の正規化、乱数の生成など）。詳しくは [ユニバーサルなコードを書く](./universal.md) を参照してください。
SSR が動作していることを確かめる一番の重要な方法は、アプリケーションの状態がクライアントとサーバで同じであるか確認することです。特にブラウザ（ウィンドウ幅、デバイスの機能、localStorage など）やサーバ（Node 組み込みのような）に固有の API に依存しないように注意して、また同じコードが異なる場所で実行すると同じ結果が得られるように注意してください（タイムゾーン、タイムスタンプの利用や、 URL の正規化、乱数の生成など）。詳しくは [ユニバーサルなコードを書く](./universal.md) を参照してください。

SSR とクライアントのハイドレーションを使うとき気づくべき 2 番目に重要なことは、不正確な HTML がブラウザによって変更される可能性があるということです。例えば、 Vue テンプレートでこのように書いたとします:

Expand Down